:root{--bg:#070b12;--card:#101827;--card2:#131d2d;--text:#eaf1ff;--muted:#b7b0a7;--blue:#304bc4;--green:#4c8f44;--pink:#ff9fa3;--line:rgba(255,255,255,.08)}
*{box-sizing:border-box}body{margin:0;background:linear-gradient(#111827,#070b12);color:var(--text);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-weight:700;padding-bottom:88px}
.appHeader{padding:calc(env(safe-area-inset-top) + 20px) 22px 10px;display:flex;justify-content:space-between;align-items:start}h1{font-size:48px;line-height:.9;margin:6px 0 0}h2{font-size:30px;margin:10px 0}h3{margin:8px 0;color:var(--pink)}.eyebrow{text-transform:uppercase;letter-spacing:.18em;color:#9cc7ff;font-size:14px}.muted{color:var(--muted);font-weight:650}.label{color:var(--muted);margin-bottom:10px}.screen{display:none;padding:10px 16px;max-width:760px;margin:0 auto}.screen.active{display:block}.card{background:linear-gradient(180deg,var(--card2),var(--card));border:1px solid var(--line);border-radius:26px;padding:20px;margin:14px 0;box-shadow:0 20px 40px rgba(0,0,0,.22)}.cloud{border-color:rgba(78,170,91,.4)}.row{display:flex;align-items:center}.between{justify-content:space-between}.gap{gap:12px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}.pill{border:1px solid var(--line);background:rgba(255,255,255,.03);border-radius:999px;padding:10px 14px;color:var(--muted)}button,select,input{font:inherit;border:0;border-radius:18px;padding:16px;background:#0b111b;color:var(--text)}select,input{width:100%;border:1px solid var(--line)}button{cursor:pointer}.primary{background:var(--blue)}.secondary{background:#303949}.success{background:var(--green)}.small{padding:12px 16px}.full{width:100%;margin-top:14px}.imageButton{position:relative;width:100%;padding:0;overflow:hidden;background:#111914;border-radius:20px}.imageButton img{width:100%;max-height:430px;object-fit:contain;background:white;display:block}.imageButton span{position:absolute;right:12px;bottom:12px;background:rgba(0,0,0,.65);border-radius:999px;padding:10px 14px}.cue{font-size:20px;color:#d7e6ff}.bar{height:16px;background:#0b111b;border-radius:999px;overflow:hidden;margin-top:16px}.bar div{height:100%;width:0;background:#55a653}.counter{background:#0b111b;border-radius:22px;padding:14px;text-align:center}.counter strong{display:block;font-size:50px}.counter button{padding:12px;margin:4px;background:#313b4d}.todayRow,.historyRow{border-bottom:1px solid var(--line);padding:12px 0}.stats{display:grid;grid-template-columns:1fr 1fr;gap:12px}.stats div{background:#0b111b;padding:16px;border-radius:18px}.stats strong{display:block;font-size:28px}.preview #previewList{display:flex;flex-direction:column;gap:14px}.previewItem{border:1px solid var(--line);border-radius:20px;padding:14px;margin-top:12px}.previewImgs{display:grid;grid-template-columns:1fr 1fr;gap:10px}.previewImgs div{background:#101512;border-radius:14px;text-align:center;overflow:hidden}.previewImgs img{width:100%;height:180px;object-fit:contain;background:white}.previewImgs span{display:block;padding:8px}.bottomNav{position:fixed;left:0;right:0;bottom:0;background:#080d15;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:10px 12px calc(env(safe-area-inset-bottom) + 10px);z-index:50}.bottomNav button{padding:14px 8px;background:#222936}.bottomNav button.active{background:var(--blue)}.menuBtn{position:fixed;right:16px;top:calc(env(safe-area-inset-top) + 10px);z-index:90;width:48px;height:48px;padding:0;font-size:26px;background:rgba(15,23,42,.86);border:1px solid var(--line)}.drawerShade{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:100}.drawer{position:fixed;right:0;top:0;bottom:0;width:min(340px,86vw);background:#101827;z-index:101;padding:calc(env(safe-area-inset-top) + 24px) 18px 18px;box-shadow:-20px 0 50px rgba(0,0,0,.45)}.drawerTop{display:flex;justify-content:space-between}.drawer button:not(.closeDrawer){display:block;width:100%;margin:8px 0;text-align:left;background:rgba(255,255,255,.06)}.closeDrawer{background:transparent;font-size:36px;padding:0}.hidden{display:none!important}.modal{position:fixed;inset:0;background:rgba(0,0,0,.9);z-index:200;display:flex;align-items:center;justify-content:center}.modal img{max-width:96vw;max-height:86vh;background:white;border-radius:18px}#closeModal{position:absolute;top:40px;right:20px;background:#222;font-size:28px}.reuseBox{border:1px solid var(--line);border-radius:18px;padding:12px;margin:10px 0;background:rgba(255,255,255,.03)}
