:root{--bg:#060814;--bg2:#0d1236;--card:rgba(20,27,66,.58);--line:rgba(130,150,255,.22);--ink:#eaf0ff;--mut:#93a0cc;--c1:#00e5ff;--c2:#7b5cff;--c3:#ff35d4;--g1:#00e5ff;--g2:#6a8bff;--fg:#04101a;
--ok:#2dffb0;--okbg:rgba(45,255,176,.12);--wn:#ffcf5c;--wnbg:rgba(255,207,92,.12);--bad:#ff5f7e;--badbg:rgba(255,95,126,.14);--field:rgba(255,255,255,.05);--glow:0 0 26px rgba(0,229,255,.28);
box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);color-scheme:dark}
:root[data-theme="light"]{--bg:#eef2ff;--bg2:#e2e8ff;--card:rgba(255,255,255,.82);--line:rgba(70,90,210,.2);--ink:#0c1233;--mut:#5a6595;--c1:#0589b6;--c2:#5a3df0;--c3:#c81fa8;--g1:#0687b3;--g2:#4f35e0;--fg:#fff;
--ok:#0b8f5c;--okbg:rgba(11,143,92,.12);--wn:#a86a00;--wnbg:rgba(255,190,50,.22);--bad:#d6264b;--badbg:rgba(214,38,75,.1);--field:rgba(20,30,90,.05);--glow:0 8px 26px rgba(90,61,240,.2);color-scheme:light}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
[hidden]{display:none!important}
body{margin:0;min-height:100vh;color:var(--ink);font:15px/1.5 Manrope,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font-variant-numeric:tabular-nums;
background:radial-gradient(900px 520px at 6% -8%,rgba(0,229,255,.2),transparent 60%),radial-gradient(800px 520px at 100% 0%,rgba(123,92,255,.24),transparent 55%),radial-gradient(700px 520px at 50% 115%,rgba(255,53,212,.13),transparent 60%),var(--bg);background-attachment:fixed}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:0;background-image:linear-gradient(rgba(130,150,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(130,150,255,.07) 1px,transparent 1px);background-size:46px 46px;-webkit-mask-image:radial-gradient(ellipse at 50% 0%,#000 25%,transparent 72%);mask-image:radial-gradient(ellipse at 50% 0%,#000 25%,transparent 72%)}
.wrap{position:relative;z-index:1;max-width:1180px;margin:0 auto;padding:16px 14px 70px}
.wrap.narrow{max-width:640px}
h1,h2,h3,.stats b{font-family:Sora,Manrope,system-ui,sans-serif}
.top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:16px}
.brand{display:flex;align-items:center;gap:12px;min-width:0}
.logo{flex:none;width:44px;height:44px;padding:10px;border-radius:14px;background:linear-gradient(135deg,rgba(0,229,255,.22),rgba(123,92,255,.28));border:1px solid var(--line);box-shadow:var(--glow)}
.logo path{fill:var(--c1);filter:drop-shadow(0 0 6px var(--c1))}
h1{margin:0;font-size:24px;line-height:1.1;font-weight:800;letter-spacing:-.02em;background:linear-gradient(90deg,var(--c1),var(--c3));-webkit-background-clip:text;background-clip:text;color:transparent}
.sm{color:var(--mut);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.acts-top{display:flex;gap:8px;flex:none}
.ghost{background:var(--field);border:1px solid var(--line);color:var(--mut);padding:8px 13px;border-radius:11px;font:600 13px Manrope,sans-serif;cursor:pointer;transition:.15s}
.ghost:hover{color:var(--c1);border-color:var(--c1);box-shadow:0 0 14px rgba(0,229,255,.25)}
.ghost.danger{color:var(--bad);border-color:var(--bad)}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-bottom:14px}
.tile{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:14px 16px;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);position:relative;overflow:hidden}
.tile::after{content:"";position:absolute;right:-20px;top:-20px;width:70px;height:70px;border-radius:50%;background:radial-gradient(circle,rgba(0,229,255,.25),transparent 70%)}
.tile b{display:block;font-size:24px;font-weight:700;letter-spacing:-.02em}
.tile span{color:var(--mut);font-size:12px}
.neg{color:var(--bad)}.pos{color:var(--ok)}
.search{position:relative;margin-bottom:12px}
.search svg{position:absolute;left:15px;top:50%;transform:translateY(-50%);width:20px;height:20px;stroke:var(--c1);fill:none;stroke-width:2;stroke-linecap:round;filter:drop-shadow(0 0 5px var(--c1))}
.search input{padding:15px 16px 15px 46px;font-size:16px;border-radius:16px;background:var(--card);border-color:var(--line);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
input,select{width:100%;min-width:0;padding:12px 13px;border:1px solid var(--line);border-radius:12px;background:var(--field);color:var(--ink);font:500 16px Manrope,sans-serif;transition:.15s}
input::placeholder{color:var(--mut)}
input:focus,select:focus{outline:none;border-color:var(--c1);box-shadow:0 0 0 3px rgba(0,229,255,.18),0 0 18px rgba(0,229,255,.2)}
select option{background:var(--bg2);color:var(--ink)}
.tabs{display:flex;gap:4px;background:var(--card);border:1px solid var(--line);border-radius:15px;padding:4px;margin-bottom:14px;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.tabs button{flex:1;border:0;background:none;color:var(--mut);padding:10px 4px;border-radius:11px;font:700 14px Manrope,sans-serif;cursor:pointer;transition:.15s}
.tabs button.on{color:var(--fg);background:linear-gradient(135deg,var(--g1),var(--g2));box-shadow:0 4px 18px rgba(0,229,255,.3)}
.tabs em{font-style:normal;font-size:12px;opacity:.75;margin-left:5px}
.hint{color:var(--mut);font-size:13px;margin:-4px 2px 12px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:12px}
.card{position:relative;background:var(--card);border:1px solid var(--line);border-radius:20px;padding:16px 16px 14px 21px;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);overflow:hidden;transition:border-color .2s,box-shadow .2s}
.card:hover{border-color:rgba(0,229,255,.5);box-shadow:var(--glow)}
.card::before{content:"";position:absolute;left:0;top:16px;bottom:16px;width:4px;border-radius:0 4px 4px 0;background:var(--wn);box-shadow:0 0 14px var(--wn)}
.card.done::before{background:var(--ok);box-shadow:0 0 14px var(--ok)}
.card.late::before{background:var(--bad);box-shadow:0 0 14px var(--bad)}
.head{display:flex;gap:12px;align-items:center}
.head>div{flex:1;min-width:0}
.seal{flex:none;width:50px;height:50px;display:grid;place-items:center;text-align:center;font:800 9px/1.1 Sora,sans-serif;letter-spacing:.05em;color:var(--c1);border-radius:50%;border:2px solid transparent;background:linear-gradient(var(--bg2),var(--bg2)) padding-box,linear-gradient(135deg,var(--c1),var(--c2),var(--c3)) border-box;box-shadow:0 0 16px rgba(0,229,255,.28)}
.seal.t{border-radius:13px}
.card h3{margin:0;font-size:16px;font-weight:700;overflow-wrap:anywhere}
.num{color:var(--mut);font-size:13px;overflow-wrap:anywhere}
.tag{padding:4px 11px;border-radius:99px;font:700 12px Manrope,sans-serif;white-space:nowrap}
.tag.w{background:var(--wnbg);color:var(--wn);box-shadow:0 0 12px var(--wnbg)}
.tag.d{background:var(--okbg);color:var(--ok);box-shadow:0 0 12px var(--okbg)}
.tag.l{background:var(--badbg);color:var(--bad);box-shadow:0 0 12px var(--badbg)}
.chips{display:flex;gap:6px;flex-wrap:wrap;margin:12px 0}
.chip{background:var(--field);border:1px solid var(--line);border-radius:99px;padding:3px 11px;font-size:13px}
.money{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;background:var(--field);border:1px solid var(--line);border-radius:13px;padding:10px 12px;margin-bottom:10px}
.money span{display:block;font-size:11px;color:var(--mut)}
.money b{font:700 15px Sora,sans-serif}
.files{font-size:13px;color:var(--mut);display:flex;flex-direction:column;gap:3px;margin-bottom:10px}
.files a{color:var(--c1);font-weight:600;text-decoration:none;overflow-wrap:anywhere}
.files a:hover{text-shadow:0 0 10px var(--c1)}
.btns{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:8px}
.btns .full{grid-column:1/-1}
.b{display:block;text-align:center;padding:12px 12px;border-radius:12px;font:700 14px Manrope,sans-serif;border:0;cursor:pointer;color:var(--fg);background:linear-gradient(135deg,var(--g1),var(--g2));box-shadow:0 6px 22px rgba(0,229,255,.25);text-decoration:none;transition:.15s}
.b:hover{filter:brightness(1.1);transform:translateY(-1px)}
.b.o{background:transparent;color:var(--c1);border:1.5px solid var(--c1);box-shadow:none}
.b.o:hover{box-shadow:0 0 18px rgba(0,229,255,.35)}
.b:disabled{opacity:.5;transform:none}
.b input{display:none}
.b.s{padding:10px 10px;font-size:13px}
.pay{display:grid;grid-template-columns:1fr auto;gap:8px;margin-top:4px}
.pay input{padding:10px 12px}
.foot{display:flex;justify-content:flex-end;gap:8px;align-items:center;margin-top:10px;flex-wrap:wrap}
.empty{grid-column:1/-1;background:var(--card);border:1px dashed var(--line);border-radius:20px;padding:36px 14px;text-align:center;color:var(--mut)}
details.new{background:var(--card);border:1px solid var(--line);border-radius:20px;margin-bottom:12px;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
details.new summary{list-style:none;cursor:pointer;padding:15px 18px;font:700 15px Sora,sans-serif;display:flex;justify-content:space-between;align-items:center}
details.new summary::-webkit-details-marker{display:none}
details.new summary::after{content:"+";font-size:26px;line-height:1;color:var(--c1);text-shadow:0 0 10px var(--c1);transition:transform .2s}
details.new[open] summary::after{transform:rotate(45deg)}
form.nf{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;padding:0 18px 18px}
label.f,.login label{display:flex;flex-direction:column;gap:5px;font-size:12px;font-weight:600;color:var(--mut);min-width:0}
.col2{grid-column:1/-1}
.rows{grid-column:1/-1;display:flex;flex-direction:column;gap:10px}
.row{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;background:var(--field);border:1px solid var(--line);border-radius:16px;padding:12px}
.row .rn{grid-column:1/-1;color:var(--c1);font-family:Sora,sans-serif}
.tools{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:12px}
.tools label.ghost{display:inline-block}
.tools input{display:none}
#xmsg{color:var(--mut);font-size:13px}
.login{margin-top:7vh;padding:24px;display:grid;gap:14px}
#lerr{color:var(--bad);font-size:13px;min-height:18px}
#note{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(18px + env(safe-area-inset-bottom,0px));background:var(--card);color:var(--ink);border:1px solid var(--c1);box-shadow:var(--glow);padding:11px 18px;border-radius:14px;font-size:14px;max-width:92vw;z-index:20;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}
@media (max-width:560px){.grid{grid-template-columns:1fr}.stats{grid-template-columns:repeat(2,1fr)}h1{font-size:21px}.tile b{font-size:21px}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}