:root{--teal:#007272;--teal-d:#004d4d;--sky:#4aa3df;--head:#004d4d;
--bg:#f1f6f6;--card:#fff;--text:#1b2a2a;--muted:#587070;--line:#d9e4e4;--field:#fff;
--tile:#00706f;--tile-h:#005252;--ok:#17703f;--okbg:#e2f4ea;--warn:#8a5300;--warnbg:#fff0d6;--err:#b3261e;--errbg:#fde8e6;--info:#1a5fa0;--infobg:#e3effb;--off:#586a6a;--offbg:#e8eeee;
--shadow:0 1px 2px rgba(0,40,40,.06),0 8px 22px rgba(0,40,40,.08);--radius:14px;color-scheme:light dark}
@media (prefers-color-scheme:dark){:root{--head:#8fd6d6;--bg:#0d1717;--card:#142222;--text:#e5f0f0;--muted:#97b0b0;--line:#263c3c;--field:#0f1c1c;
--tile:#0b6867;--tile-h:#108381;--ok:#7fdca6;--okbg:#153626;--warn:#f0c674;--warnbg:#3a2c0f;--err:#ff9d94;--errbg:#3b1917;--info:#8ec5f5;--infobg:#15304a;--off:#a5b8b8;--offbg:#203030;
--shadow:0 1px 2px rgba(0,0,0,.5),0 8px 22px rgba(0,0,0,.35)}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}
a{color:inherit}
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--sky);outline-offset:2px}
.wrap{width:min(1240px,100% - 32px);margin-inline:auto}
.ic{flex:none}
.top{background:linear-gradient(180deg,var(--teal),var(--teal-d));color:#fff;box-shadow:0 3px 12px rgba(0,0,0,.2)}
.top .wrap{display:flex;align-items:center;gap:14px;min-height:68px;padding-block:8px}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none;color:#fff;min-width:0}
.brand img{height:46px;width:auto;display:block}
.brand .bi{font-weight:600;font-size:1.05rem;padding-left:14px;border-left:1px solid rgba(255,255,255,.35);letter-spacing:.02em}
.brand .bt{display:flex;flex-direction:column;line-height:1.15}
.brand .bt small{font-size:.72rem;letter-spacing:.07em;text-transform:uppercase;opacity:.85}
.brand .bt b{font-size:1.25rem;font-weight:650}
.top .sp{flex:1}
.iconbtn{position:relative;display:inline-grid;place-items:center;width:44px;height:44px;border-radius:12px;color:#fff;background:rgba(255,255,255,.13);border:0;cursor:pointer;text-decoration:none;font:inherit}
.iconbtn:hover{background:rgba(255,255,255,.25)}
.bellbadge{position:absolute;top:3px;right:3px;min-width:16px;height:16px;padding:0 4px;border-radius:99px;background:#e0433a;color:#fff;font-size:.68rem;font-weight:700;line-height:16px;text-align:center;box-shadow:0 0 0 2px var(--teal-d)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:8px 18px;border-radius:10px;border:1px solid var(--line);background:var(--card);color:var(--text);font-family:inherit;font-weight:600;font-size:.92rem;line-height:1.2;cursor:pointer;text-decoration:none}
.btn:hover{border-color:var(--teal)}
.btn.primary{background:var(--teal);border-color:var(--teal);color:#fff}
.btn.primary:hover{background:var(--teal-d)}
.btn.danger{color:var(--err)}
.btn.sm{min-height:36px;padding:6px 12px;font-size:.85rem}
.btn[disabled]{opacity:.55;cursor:default}
footer.foot{margin-top:auto;background:linear-gradient(180deg,var(--teal),var(--teal-d));color:#fff;font-size:.85rem;padding:16px 0}
footer.foot a{color:#fff}
