:root{
  --bg1:#160d2e; --bg2:#241356; --bg3:#3a1c6b;
  --card:rgba(255,255,255,.06); --brd:rgba(255,255,255,.12);
  --ink:#f4f1ff; --muted:#b6abe0;
  --saff:#ff8a3d; --gold:#ffd23f; --lotus:#ff5c8a; --teal:#3ad6c5; --violet:#a06bff; --green:#57e08a; --red:#ff6b6b;
}
*{box-sizing:border-box;margin:0;padding:0;font-family:'Segoe UI',system-ui,-apple-system,sans-serif;-webkit-tap-highlight-color:transparent}
body{background:linear-gradient(150deg,var(--bg1),var(--bg2) 55%,var(--bg3));color:var(--ink);min-height:100vh;overflow-x:hidden}
.aura{position:fixed;border-radius:50%;filter:blur(90px);opacity:.30;z-index:0;animation:float 16s ease-in-out infinite;pointer-events:none}
.a1{width:360px;height:360px;background:var(--saff);top:-90px;right:-70px}
.a2{width:320px;height:320px;background:var(--violet);bottom:-120px;left:-90px;animation-delay:-6s}
.a3{width:240px;height:240px;background:var(--lotus);top:45%;left:60%;animation-delay:-10s}
@keyframes float{0%,100%{transform:translate(0,0)}50%{transform:translate(24px,-34px)}}
.wrap{position:relative;z-index:1;max-width:1120px;margin:0 auto;padding:20px 16px 96px}
header{display:flex;align-items:center;gap:13px;margin-bottom:2px}
.lamp{font-size:32px;filter:drop-shadow(0 0 14px var(--gold));animation:pulse 3.2s infinite}
@keyframes pulse{50%{transform:scale(1.13)}}
h1{font-size:21px;font-weight:700;letter-spacing:2px}
h1 b{background:linear-gradient(90deg,var(--gold),var(--saff),var(--lotus));-webkit-background-clip:text;background-clip:text;color:transparent}
.me-badge{margin-left:auto;display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted)}
.me-badge img{width:26px;height:26px;border-radius:50%}
.linkbtn{background:none;border:1px solid var(--brd);color:var(--muted);padding:5px 11px;border-radius:16px;cursor:pointer;font-size:11.5px}
.linkbtn:hover{color:var(--ink)}
.greet{color:var(--muted);font-size:13.5px;margin:3px 0 16px 45px}
.greet b{color:var(--ink);font-weight:600}
nav{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:20px}
.tab{background:var(--card);border:1px solid var(--brd);color:var(--muted);padding:9px 14px;border-radius:26px;cursor:pointer;font-size:13.5px;transition:.22s;display:flex;align-items:center;gap:6px;user-select:none}
.tab:hover{transform:translateY(-2px);color:var(--ink)}
.tab.on{background:linear-gradient(90deg,var(--saff),var(--lotus));color:#fff;border-color:transparent;box-shadow:0 6px 18px rgba(255,92,138,.32)}
.panel{display:none;animation:fade .45s ease}
.panel.on{display:block}
@keyframes fade{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.grid{display:grid;gap:15px}
.g2{grid-template-columns:1fr 1fr}.g3{grid-template-columns:repeat(3,1fr)}
@media(max-width:780px){.g2,.g3{grid-template-columns:1fr}}
.card{background:var(--card);border:1px solid var(--brd);border-radius:18px;padding:17px;backdrop-filter:blur(9px);transition:.28s}
.card:hover{border-color:rgba(255,255,255,.24)}
.card h3{font-size:14.5px;margin-bottom:12px;display:flex;align-items:center;gap:8px}
.pill{font-size:10.5px;padding:3px 9px;border-radius:20px;background:rgba(255,255,255,.1);color:var(--muted);font-weight:500}
label{display:block;font-size:12.5px;color:var(--muted);margin:9px 0 5px}
textarea,input,select{width:100%;background:rgba(0,0,0,.26);border:1px solid var(--brd);border-radius:11px;color:var(--ink);padding:10px 12px;font-size:14px;resize:vertical;font-family:inherit}
textarea:focus,input:focus,select:focus{outline:none;border-color:var(--saff)}
.btn{background:linear-gradient(90deg,var(--saff),var(--lotus));border:none;color:#fff;padding:10px 17px;border-radius:22px;cursor:pointer;font-size:13.5px;font-weight:600;margin-top:12px;transition:.22s}
.btn:hover{transform:translateY(-2px);box-shadow:0 8px 20px rgba(255,138,61,.38)}
.btn.ghost{background:rgba(255,255,255,.08);color:var(--ink);border:1px solid var(--brd)}
.btn.sm{padding:6px 12px;font-size:12px;margin:0}
.btn.danger{background:rgba(255,107,107,.15);color:var(--red);border:1px solid rgba(255,107,107,.3)}
.row{display:flex;gap:9px;flex-wrap:wrap;align-items:center}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:5px}
.chip{padding:8px 13px;border-radius:19px;border:1px solid var(--brd);background:rgba(255,255,255,.05);cursor:pointer;font-size:13px;transition:.18s;user-select:none}
.chip.sel{background:linear-gradient(90deg,var(--teal),var(--green));color:#08261f;border-color:transparent;font-weight:600}
.stat{text-align:center;padding:6px}
.stat b{font-size:25px;background:linear-gradient(90deg,var(--gold),var(--saff));-webkit-background-clip:text;background-clip:text;color:transparent}
.stat span{display:block;font-size:11.5px;color:var(--muted);margin-top:2px}
.habit{display:flex;align-items:center;justify-content:space-between;padding:11px 3px;border-bottom:1px solid rgba(255,255,255,.07)}
.habit:last-child{border:none}
.check{width:26px;height:26px;border-radius:8px;border:2px solid var(--muted);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.18s;font-size:15px;flex:none}
.check.done{background:var(--green);border-color:var(--green);color:#08261f}
.streak{font-size:11.5px;color:var(--gold)}
.mini{background:none;border:none;color:var(--muted);cursor:pointer;font-size:14px;padding:2px 6px}
.mini:hover{color:var(--red)}
.chat{height:340px;overflow-y:auto;display:flex;flex-direction:column;gap:9px;padding:6px 2px}
.msg{max-width:82%;padding:10px 13px;border-radius:15px;font-size:13.5px;line-height:1.45;animation:fade .35s;white-space:pre-wrap}
.me{align-self:flex-end;background:linear-gradient(90deg,var(--saff),var(--lotus));color:#fff;border-bottom-right-radius:4px}
.ai{align-self:flex-start;background:rgba(255,255,255,.1);border-bottom-left-radius:4px}
.chatbar{display:flex;gap:8px;margin-top:10px}
.proj{display:flex;align-items:center;gap:11px;padding:12px;border-radius:13px;background:rgba(255,255,255,.05);margin-bottom:8px;border:1px solid var(--brd)}
.proj b{font-size:14px}.proj small{color:var(--muted);display:block;font-size:11.5px;margin-top:2px}
.dot{width:9px;height:9px;border-radius:50%;flex:none}
.badge{font-size:10.5px;padding:3px 9px;border-radius:18px;white-space:nowrap}
.b-Live{background:rgba(87,224,138,.18);color:var(--green)}
.b-Building{background:rgba(255,210,63,.18);color:var(--gold)}
.b-Idea{background:rgba(160,107,255,.22);color:var(--violet)}
.b-Official{background:rgba(58,214,197,.18);color:var(--teal)}
.b-Paused{background:rgba(255,255,255,.12);color:var(--muted)}
.note{font-size:11.5px;color:var(--muted);margin-top:14px;text-align:center;line-height:1.6}
.entry{padding:11px;border-radius:12px;background:rgba(255,255,255,.04);border:1px solid var(--brd);margin-bottom:9px}
.entry .d{font-size:12px;color:var(--gold);font-weight:600}
.entry p{font-size:13px;margin-top:4px;color:var(--ink)}
.empty{text-align:center;color:var(--muted);font-size:13px;padding:26px 10px;line-height:1.6}
.toast{position:fixed;bottom:78px;left:50%;transform:translateX(-50%) translateY(80px);background:linear-gradient(90deg,var(--green),var(--teal));color:#08261f;padding:11px 20px;border-radius:26px;font-weight:600;font-size:13.5px;transition:.4s;z-index:30;opacity:0}
.toast.show{transform:translateX(-50%) translateY(0);opacity:1}
.fabbar{position:fixed;bottom:0;left:0;right:0;background:rgba(22,13,46,.85);backdrop-filter:blur(12px);border-top:1px solid var(--brd);display:none;justify-content:space-around;padding:8px 4px;z-index:8}
@media(max-width:780px){nav{display:none}.fabbar{display:flex}.wrap{padding-bottom:80px}}
.fab{background:none;border:none;color:var(--muted);font-size:19px;padding:6px 10px;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:2px}
.fab span{font-size:9.5px}
.fab.on{color:var(--saff)}
/* login gate */
#gate{position:fixed;inset:0;z-index:40;display:flex;align-items:center;justify-content:center;background:linear-gradient(150deg,var(--bg1),var(--bg2) 55%,var(--bg3));padding:20px}
.gatecard{background:var(--card);border:1px solid var(--brd);border-radius:22px;padding:36px 28px;max-width:380px;width:100%;text-align:center;backdrop-filter:blur(10px)}
.gatecard .lamp{font-size:52px;display:block;margin-bottom:10px}
.gatecard h2{font-size:24px;letter-spacing:3px;margin-bottom:6px}
.gatecard h2 b{background:linear-gradient(90deg,var(--gold),var(--saff),var(--lotus));-webkit-background-clip:text;background-clip:text;color:transparent}
.gatecard p{color:var(--muted);font-size:13px;line-height:1.6;margin-bottom:22px}
.gbtn{display:inline-flex;align-items:center;gap:10px;background:#fff;color:#222;border:none;padding:12px 20px;border-radius:26px;font-size:14.5px;font-weight:600;cursor:pointer;transition:.2s}
.gbtn:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(0,0,0,.35)}
.gbtn img{width:19px;height:19px}
.gate-note{margin-top:18px;font-size:11px;color:var(--muted)}
.gate-err{color:var(--red);font-size:12.5px;margin-top:14px;min-height:16px}
.hidden{display:none!important}
/* modal */
.overlay{position:fixed;inset:0;z-index:35;background:rgba(10,6,24,.6);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:18px}
.modal{background:var(--bg2);border:1px solid var(--brd);border-radius:18px;padding:20px;max-width:420px;width:100%}
.modal h3{margin-bottom:12px;font-size:16px}
.seg{display:flex;background:rgba(0,0,0,.25);border-radius:12px;padding:3px;margin-top:6px}
.seg button{flex:1;background:none;border:none;color:var(--muted);padding:7px;border-radius:9px;cursor:pointer;font-size:12.5px}
.seg button.on{background:rgba(255,255,255,.12);color:var(--ink)}