:root{
--bg:#f4f7fa;--surface:#ffffff;--surface2:#eaf0f6;--chip:#eef3f8;--chip2:#e3ebf3;--chip3:#d7e2ec;
--ink:#0f2a4a;--ink2:#3b5776;--muted:#55708a;--faint:#657f99;
--line:#e4eaf1;--line2:#d3dde7;--line3:#bfccdb;
--brand:#123a63;--teal:#0f7c8c;--teal-h:#0b6270;--teal-t:#0d6a78;--teal-soft:#e4f1f3;--teal-on-photo:#7fe0ee;
--acc:#1f7a3f;--acc-h:#166330;--acc-soft:#e6f4ea;--hi:#1f7a3f;--on-acc:#ffffff;
--red:#d63b4c;--red-soft:#fbe9eb;--red-t:#b32a3a;
--hero:linear-gradient(118deg,#f2f8ff 0%,#ffffff 44%,#f0f8f3 100%);--wash:linear-gradient(to left,rgba(255,255,255,.97) 0%,rgba(255,255,255,.87) 27%,rgba(255,255,255,.42) 50%,rgba(255,255,255,.14) 68%,rgba(255,255,255,.58) 87%,rgba(255,255,255,.93) 100%);--scrim:rgba(9,26,44,.62);--header:rgba(244,247,250,.86);--sh:rgba(15,42,74,.13);
}
html,body{margin:0;background:var(--bg);color:var(--ink);font-family:'Cairo',system-ui,sans-serif}
*{box-sizing:border-box}
a{color:var(--teal-t);text-decoration:none}a:hover{color:var(--hi)}
img{display:block}
input,select,textarea,button{font-family:inherit}
input[type=range]{accent-color:var(--teal-t)}
nav::-webkit-scrollbar{display:none}
#picked-row::-webkit-scrollbar,#cat-strip::-webkit-scrollbar{display:none}
::-webkit-scrollbar{height:8px;width:8px}::-webkit-scrollbar-thumb{background:var(--line3);border-radius:6px}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(214,59,76,.7)}70%{box-shadow:0 0 0 8px rgba(214,59,76,0)}}
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(50%)}}
@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes fall{0%{transform:translateY(-10vh) rotate(0)}100%{transform:translateY(110vh) rotate(720deg)}}
@keyframes pop{0%{transform:scale(.6);opacity:0}60%{transform:scale(1.08);opacity:1}100%{transform:scale(1)}}
@keyframes shimmer{from{background-position:200% 0}to{background-position:-200% 0}}
@keyframes kenburns{from{transform:scale(1)}to{transform:scale(1.08)}}
@keyframes sweep{0%{transform:translateX(-120%) skewX(-18deg)}100%{transform:translateX(320%) skewX(-18deg)}}
@keyframes slideIn{from{transform:translateX(100%)}to{transform:none}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes goldshine{0%{background-position:0% 50%}100%{background-position:200% 50%}}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.35}}
@keyframes eq{0%,100%{height:22%}50%{height:92%}}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(50%)}}
@keyframes popIn{from{opacity:0;transform:scale(.92) translateY(12px)}to{opacity:1;transform:none}}
@keyframes glowPulse{0%,100%{box-shadow:0 0 0 0 rgba(15,124,140,.35)}50%{box-shadow:0 0 0 12px rgba(15,124,140,0)}}
@keyframes feedIn{from{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:none}}