/* Phone visual reference: warm dark brown cards, orange actions, bottom navigation. */
:root{--bg:#211109;--panel:#311d12;--line:#65462f;--text:#fff9ef;--muted:#c3a98f;--accent:#ff9a36;--accent-dark:#351603;--green:#acd7a3}
html{scroll-behavior:smooth;scroll-padding-top:24px}body{background:radial-gradient(ellipse at 50% 0,#77432327,transparent 45%),#180d08;padding-bottom:calc(76px + env(safe-area-inset-bottom))}
.topbar{max-width:540px;padding:24px 22px 12px}.brand{font-size:19px;letter-spacing:.005em;gap:9px}.brand img{width:33px;height:33px;border-radius:10px}.brand-sub{font-size:10px;letter-spacing:.03em;margin-top:5px;color:#b89375}.pill{font-size:9px;padding:6px 7px;border-color:#69442a;color:#dfbea0}
main{max-width:540px;padding:6px 20px 32px}.intro{padding:17px 2px 22px}.intro .eyebrow{font-size:9px;color:#cc8d55;letter-spacing:.13em;margin-bottom:8px}h1{font-size:27px;line-height:1.45;letter-spacing:-.025em;margin-bottom:10px}.lead{font-size:12px;line-height:1.9}.layout{display:flex;flex-direction:column;gap:14px}.card{padding:19px 17px;background:linear-gradient(125deg,#442917bb,#2c190ff5);border:1px solid #64432d;border-radius:13px;box-shadow:0 8px 24px #00000012}.section-heading{gap:8px;margin-bottom:17px}.section-heading h2{font-size:15px}.step{font-size:10px;color:#ffd1a1;background:#85431d2a;border-color:#8e5431;border-radius:6px;padding:4px 6px}.tiny-badge{font-size:9px;padding:5px 7px;border-color:#795138;color:#e5b887;background:#ffb04708}.input-wrap,input{background:#1f1009;border-color:#735034;border-radius:7px}.input-wrap input{font-size:13px;padding:14px 0}.button{border-radius:99px;font-size:13px;min-height:45px;margin-top:13px}.primary{background:linear-gradient(105deg,#ffa527,#ff7039);color:#fffaf2;box-shadow:0 3px 12px #cf4c191c}.primary:hover:not(:disabled){background:linear-gradient(105deg,#ffb23e,#ff8955)}.primary svg{width:20px}.primary>span{margin-left:0}.secondary{background:#614531;color:#ffdfb4;border:1px solid #8c6241}.secondary:hover:not(:disabled){background:#765039}.flow{margin-top:19px;font-size:10px;color:#caa283}.flow b{color:#866040}.note{color:#b48c6c;font-size:10px;line-height:1.9}.install-card>p{font-size:12px}.install-card details{font-size:11px;border-color:#66442c;padding-top:12px;margin-top:12px}.install-card strong{color:#ffe3be}.status-text{font-size:10px!important;color:#d6b99d!important}.receipt-card{border-color:#d08739;background:linear-gradient(120deg,#653c1c65,#301c12)}.success{color:#c7e0ac;background:#6b78331c;border-color:#7e864e}.video-preview{gap:13px}.video-preview>img{width:110px;border-radius:7px}.video-preview h3{font-size:15px}.video-preview .eyebrow{font-size:9px}.video-preview a{font-size:11px}.read-only{font-size:11px;color:#dcc1a4}.queue-card{margin-top:14px}.count{font-size:10px;background:#9b663924;color:#dfb68d}.empty{padding:10px 6px 17px}.empty-icon{color:#f5a841;background:#b15e2012;border-color:#82532e;border-radius:10px}.empty p{color:#e9d2bc;font-size:13px}.empty span{font-size:11px}.queue-list li{border-color:#66442c}.queue-list li:before{color:#c18957}.queue-list a{color:#ffe6cd}.queue-list code{color:#ae8564}.remove{color:#c99971;border-color:#755035}.fallback{font-size:11px;margin:20px 3px}.fallback .button{min-width:155px}.read-only{border-radius:7px}.empty-icon{font-size:28px}footer{font-size:10px;border-color:#513321;color:#987357;padding-top:19px}footer strong{color:#bd9470}#pwa-status{font-size:9px;color:#967052}.bottom-nav{position:fixed;z-index:5;bottom:0;left:50%;transform:translateX(-50%);display:flex;justify-content:center;gap:6px;width:100%;max-width:540px;padding:8px 14px calc(8px + env(safe-area-inset-bottom));background:#29180ff5;border-top:1px solid #745034;backdrop-filter:blur(14px)}.bottom-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;flex:1;max-width:200px;color:#b39374;font-size:10px;min-height:46px;border-radius:9px}.bottom-nav a[aria-current]{color:#ffa638;background:#66401944}.bottom-nav svg{width:20px;height:20px}.toast{bottom:95px;background:#51301b;border-color:#a56b36;color:#ffdfb4;font-size:12px}#receipt,#search-title,#queue-title{scroll-margin-top:18px}@media(max-width:360px){.brand{font-size:16px}.brand img{width:28px;height:28px}.topbar{padding:20px 16px 10px}main{padding-inline:14px}.video-preview>img{width:80px}h1{font-size:25px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}