@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@500;700;800&display=swap');
:root{--bg:#fdf0e6;--card:#fff8f2;--ink:#4a3a35;--mut:#9a8378;--org:#ffe2b8;--pnk:#fbdde8;--grn:#d6efd9;--blu:#d3ebf2;--acc:#f5a623;--red:#c9484a;--gr:#3f8a55}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:500 15px/1.45 Nunito,system-ui,sans-serif}
a{color:inherit;text-decoration:none}
.app{display:grid;grid-template-columns:230px 1fr;min-height:100vh}
nav.s{padding:22px 14px;position:sticky;top:0;height:100vh}nav.s b{display:block;font-size:24px;margin:0 10px 18px}
nav.s a{display:block;padding:12px 14px;border-radius:16px;margin-bottom:4px;font-weight:700}nav.s a.on{background:var(--org)}
main{padding:20px;max-width:880px;width:100%}
.hero{position:relative;border-radius:28px;overflow:hidden;height:190px;box-shadow:0 8px 24px #d9a37a33}.hero img{width:100%;height:100%;object-fit:cover}
.hero h2{position:absolute;left:18px;bottom:14px;margin:0;background:#ffffffcc;padding:8px 16px;border-radius:99px;font-size:17px}
.g2{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:14px 0}
.c{background:var(--card);border-radius:22px;padding:16px;box-shadow:0 4px 14px #d9a37a22;margin-bottom:12px}
.c small,.m{color:var(--mut)}.c h3{margin:0 0 10px;font-size:17px}
.st{border-radius:22px;padding:14px 16px}.st b{font-size:22px;display:block}.o{background:#fdd9d3}.i{background:var(--grn)}
.q{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;text-align:center;font-size:13px;font-weight:700}
.q a{background:var(--card);border-radius:20px;padding:12px 4px;box-shadow:0 4px 14px #d9a37a22}.q span{display:block;font-size:28px}
.row{display:flex;align-items:center;gap:12px;border-radius:18px;padding:10px 12px;margin-bottom:8px}
.row .ic{font-size:26px;background:#fff9;border-radius:14px;width:44px;height:44px;display:grid;place-items:center}.row div{flex:1;min-width:0}
.row em{font-style:normal;font-weight:800}.neg{color:var(--red)}.pos{color:var(--gr)}
.bar{height:8px;background:#fff9;border-radius:9px;overflow:hidden;margin-top:6px}.bar i{display:block;height:100%;background:var(--acc)}
.k0{background:var(--org)}.k1{background:var(--pnk)}.k2{background:var(--grn)}.k3{background:var(--blu)}
input,select,button,textarea{font:inherit;padding:11px 14px;border:2px solid #f0dccb;border-radius:14px;background:#fff;color:var(--ink);width:100%;margin-bottom:8px}
button,.btn{background:var(--acc);border:0;color:#fff;font-weight:800;cursor:pointer;display:block;text-align:center;border-radius:14px;padding:11px}
button.l{background:var(--org);color:var(--ink)}button.x{width:auto;background:none;color:var(--mut);padding:4px 8px;margin:0}
.f{display:flex;gap:8px}.f>*{margin-bottom:8px}
.fab{position:fixed;right:22px;bottom:86px;width:58px;height:58px;border-radius:50%;font-size:30px;padding:0;box-shadow:0 8px 20px #f5a62366;z-index:5}
dialog{border:0;border-radius:26px;background:var(--bg);width:min(420px,92vw);padding:20px}dialog::backdrop{background:#4a3a3566}
.bn{display:none}
.auth{max-width:400px;margin:6vh auto;padding:20px}.err{background:#fdd9d3;padding:10px 14px;border-radius:14px;margin-bottom:10px}
@media(max-width:800px){.app{display:block}nav.s{display:none}main{padding:14px 14px 100px}.fab{right:16px;bottom:84px}
.bn{display:flex;position:fixed;left:0;right:0;bottom:0;background:var(--card);padding:8px 6px 12px;justify-content:space-around;box-shadow:0 -4px 16px #d9a37a33;z-index:4}
.bn a{text-align:center;font-size:11px;font-weight:700;padding:4px 8px;border-radius:14px}.bn a.on{background:var(--org)}.bn span{display:block;font-size:22px}.q{grid-template-columns:repeat(4,1fr)}}
