:root{
      --bg:#04050a;--ink:#eef2ff;--muted:#8b95b0;--line:rgba(140,160,255,.14);
      --a:#6ee7ff;--b:#8b5cff;--c:#ff4fd8;--rose:#ff5d73;--acc:var(--a);
      --grad:linear-gradient(120deg,var(--a),var(--b) 55%,var(--c));
      --glass:rgba(14,17,30,.66);
      --display:'Space Grotesk',Alexandria,system-ui,sans-serif;
    }
    *{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
    html{-webkit-text-size-adjust:100%;background:var(--bg)}
    body{margin:0;color:var(--ink);font-family:Alexandria,system-ui,sans-serif;background:var(--bg);overflow-x:hidden;min-height:100vh}

    /* ===== boot overlay (fades out by CSS even if JS fails) ===== */
    .boot{position:fixed;inset:0;z-index:100;background:#04050a;display:grid;place-content:center;justify-items:center;gap:22px;animation:bootout .7s ease 2.3s forwards}
    @keyframes bootout{to{opacity:0;visibility:hidden}}
    .boot.skip{animation-duration:.01s;animation-delay:0s}
    .boot-core{width:84px;height:84px;border-radius:50%;background:conic-gradient(var(--a),transparent 30%,var(--b) 55%,transparent 75%,var(--c));-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 calc(100% - 3px));mask:radial-gradient(farthest-side,transparent calc(100% - 4px),#000 calc(100% - 3px));animation:rot 1.2s linear infinite;filter:drop-shadow(0 0 14px var(--a))}
    @keyframes rot{to{transform:rotate(360deg)}}
    .boot pre{margin:0;font:500 12px/1.9 var(--display);letter-spacing:2px;color:#8fb7da;text-align:left;min-height:96px}
    .boot pre b{color:var(--a)}

    /* ===== 3D background ===== */
    .bg{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
    .bg:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 70% 50% at 85% -5%,rgba(139,92,255,.28),transparent 60%),radial-gradient(ellipse 55% 45% at 0% 40%,rgba(255,79,216,.13),transparent 60%),radial-gradient(ellipse 60% 40% at 50% 110%,rgba(110,231,255,.16),transparent 60%)}
    .floor{position:absolute;left:-60%;right:-60%;bottom:-8vh;height:70vh;transform-origin:50% 100%;transform:perspective(520px) rotateX(64deg);background:
      linear-gradient(90deg,rgba(110,231,255,.22) 1px,transparent 1px) 0 0/64px 64px,
      linear-gradient(0deg,rgba(139,92,255,.22) 1px,transparent 1px) 0 0/64px 64px;
      -webkit-mask-image:linear-gradient(to top,#000 5%,transparent 85%);mask-image:linear-gradient(to top,#000 5%,transparent 85%);animation:floor 6s linear infinite}
    @keyframes floor{to{background-position:0 0,0 64px}}
    .orbit{position:absolute;border-radius:50%;filter:blur(60px);opacity:.5;animation:drift 16s ease-in-out infinite alternate}
    .o1{width:340px;height:340px;background:var(--b);top:12%;left:6%}
    .o2{width:280px;height:280px;background:var(--a);bottom:14%;right:8%;animation-delay:-8s;opacity:.28}
    @keyframes drift{to{transform:translate3d(60px,-40px,0) scale(1.15)}}

    .app{position:relative;z-index:1;max-width:1480px;margin:auto;padding:24px 32px calc(48px + env(safe-area-inset-bottom))}

    /* ===== header ===== */
    .top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:26px}
    .brand{display:flex;align-items:center;gap:16px}
    .cube-wrap{width:30px;height:30px;perspective:240px;margin:6px}
    .cube{position:relative;width:30px;height:30px;transform-style:preserve-3d;animation:cube 10s linear infinite}
    .cube i{position:absolute;inset:0;border:1.5px solid var(--a);background:rgba(110,231,255,.07);box-shadow:inset 0 0 10px rgba(110,231,255,.35),0 0 12px rgba(110,231,255,.25)}
    .cube i:nth-child(1){transform:translateZ(15px)}.cube i:nth-child(2){transform:rotateY(180deg) translateZ(15px)}
    .cube i:nth-child(3){transform:rotateY(90deg) translateZ(15px);border-color:var(--b)}.cube i:nth-child(4){transform:rotateY(-90deg) translateZ(15px);border-color:var(--b)}
    .cube i:nth-child(5){transform:rotateX(90deg) translateZ(15px);border-color:var(--c)}.cube i:nth-child(6){transform:rotateX(-90deg) translateZ(15px);border-color:var(--c)}
    @keyframes cube{from{transform:rotateX(-28deg) rotateY(0)}to{transform:rotateX(-28deg) rotateY(360deg)}}
    .brand-text b{display:block;font:700 26px var(--display);letter-spacing:6px;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;line-height:1}
    .brand-text small{display:block;margin-top:6px;font:500 10px var(--display);letter-spacing:5px;color:var(--muted)}
    .month-switch{display:flex;align-items:center;gap:8px;background:var(--glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);padding:6px;border:1px solid var(--line);border-radius:14px;font:600 14px var(--display);box-shadow:0 10px 30px -10px #000a}
    #monthLabel{min-width:132px;text-align:center;letter-spacing:.5px}
    .round{border:1px solid var(--line);background:linear-gradient(180deg,#1a2040,#0e1226);width:38px;height:38px;border-radius:10px;cursor:pointer;font-size:20px;color:var(--ink);box-shadow:0 3px 0 #060814;transition:.12s}
    .round:active{transform:translateY(2px);box-shadow:0 1px 0 #060814}

    /* ===== cards ===== */
    .card{position:relative;background:var(--glass);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--line);border-radius:20px;padding:24px;min-width:0;
      box-shadow:0 40px 70px -30px #000e,0 2px 0 rgba(255,255,255,.04) inset;overflow:hidden}
    .card:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .3s;background:radial-gradient(circle 380px at var(--mx,50%) var(--my,0%),rgba(255,255,255,.09),transparent 70%)}
    .card.hot:before{opacity:1}
    .card:after{content:"";position:absolute;left:12%;right:12%;top:0;height:1px;background:linear-gradient(90deg,transparent,var(--acc),transparent);opacity:.7;pointer-events:none}
    .tilt{transform:perspective(1200px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .5s cubic-bezier(.2,.8,.2,1);will-change:transform}
    .tilt.hot{transition:transform .12s ease-out}
    .card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:18px}
    .card h2{font:700 14px var(--display);margin:0;text-transform:uppercase;letter-spacing:2.2px}
    .sys{display:block;font:500 9px var(--display);letter-spacing:3px;color:var(--muted);margin-bottom:10px}
    .label,.date{color:var(--muted);font:500 11px var(--display);letter-spacing:1px}

    /* ===== hero ===== */
    .hero{display:grid;grid-template-columns:1.15fr .85fr;gap:20px;align-items:center;padding:36px 40px;margin-bottom:24px}
    .eyebrow{display:inline-flex;align-items:center;gap:9px;font:600 11px var(--display);letter-spacing:3.5px;color:var(--a)}
    .hud-dot{width:7px;height:7px;border-radius:50%;background:var(--a);box-shadow:0 0 12px var(--a);display:inline-block;animation:pulse 2s infinite}
    @keyframes pulse{50%{opacity:.35}}
    .hero h1{margin:14px 0 8px;font:700 clamp(30px,3.6vw,52px)/1.05 var(--display);letter-spacing:-.5px;background:linear-gradient(120deg,#fff 10%,var(--a) 50%,var(--b));-webkit-background-clip:text;background-clip:text;color:transparent}
    .hero h2{font:600 20px Alexandria,var(--display);margin:0 0 4px;text-transform:none;letter-spacing:0;color:var(--ink)}
    .hero p{margin:0;color:var(--muted);font-size:14px;line-height:1.8}
    #scoreSub{color:var(--a);font-weight:600;font-size:13px}
    .kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:26px}
    .kpi{background:rgba(255,255,255,.035);border:1px solid var(--line);border-radius:14px;padding:13px 14px;box-shadow:0 8px 20px -10px #000a,inset 0 1px 0 rgba(255,255,255,.05)}
    .kpi small{display:block;font:500 9px var(--display);letter-spacing:2px;color:var(--muted);margin-bottom:8px;text-transform:uppercase}
    .kpi b{font:700 26px var(--display);line-height:1;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;display:inline-block}

    /* ===== 3D orb ===== */
    .hero-orb{display:grid;place-items:center;min-height:300px}
    .orb{position:relative;width:min(300px,100%);aspect-ratio:1;perspective:900px}
    .orb-3d{position:absolute;inset:0;transform-style:preserve-3d;animation:spin 20s linear infinite}
    @keyframes spin{from{transform:rotateX(-22deg) rotateY(0)}to{transform:rotateX(-22deg) rotateY(360deg)}}
    .o-ring{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 20deg,var(--a),transparent 28%,var(--b) 52%,transparent 74%,var(--c));
      -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 2px));mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 2px))}
    .r1{transform:rotateX(74deg)}.r2{transform:rotateY(74deg) scale(.9)}.r3{transform:rotateX(40deg) rotateY(40deg) scale(.78);opacity:.8}
    .hud-ring{position:absolute;inset:-7%;width:114%;height:114%;pointer-events:none;animation:rot 40s linear infinite reverse}
    .hud-ring circle{fill:none}
    .hud-ring .ticks{stroke:rgba(110,231,255,.5);stroke-width:1.6;stroke-dasharray:.35 1.75}
    .hud-ring .arcs{stroke:var(--a);stroke-width:.7;stroke-dasharray:14 36;opacity:.8}
    .core{position:absolute;inset:23%;border-radius:50%;background:radial-gradient(circle at 32% 26%,rgba(255,255,255,.4),rgba(110,231,255,.14) 28%,rgba(10,12,26,.92) 68%);
      box-shadow:0 0 60px rgba(110,231,255,.35),0 0 120px rgba(139,92,255,.3),inset -14px -18px 34px rgba(0,0,0,.6),inset 8px 8px 22px rgba(255,255,255,.1);animation:bob 5s ease-in-out infinite}
    @keyframes bob{50%{transform:translateY(-8px)}}
    .prog{position:absolute;inset:11%;width:78%;height:78%;transform:rotate(-90deg);filter:drop-shadow(0 0 8px rgba(110,231,255,.65))}
    .prog circle{fill:none;stroke-linecap:round;stroke-width:3.4}
    .prog .track{stroke:rgba(255,255,255,.08)}
    #progArc{stroke:url(#pg);stroke-dasharray:289.03;stroke-dashoffset:289.03;transition:stroke-dashoffset .9s cubic-bezier(.2,.8,.2,1)}
    .orb-text{position:absolute;inset:0;display:grid;place-content:center;text-align:center;z-index:2;pointer-events:none}
    .orb-text strong{font:700 clamp(34px,4vw,48px) var(--display);line-height:1;text-shadow:0 0 24px rgba(110,231,255,.5)}
    .orb-text span{margin-top:6px;font:500 12px var(--display);letter-spacing:3px;color:var(--muted)}
    .shadow-floor{position:absolute;left:18%;right:18%;bottom:-28px;height:30px;border-radius:50%;background:radial-gradient(ellipse,rgba(110,231,255,.35),transparent 70%);filter:blur(8px)}

    /* ===== layout ===== */
    .content{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:24px;align-items:start}
    .col{display:grid;gap:24px;min-width:0}

    /* ===== ZEN assistant ===== */
    .zen{--acc:var(--b)}
    .zen-id{display:flex;align-items:center;gap:12px}
    .zen-orb{width:38px;height:38px;border-radius:50%;position:relative;flex:none;background:radial-gradient(circle,#fff 0,var(--a) 22%,transparent 60%);box-shadow:0 0 18px var(--a),0 0 40px rgba(139,92,255,.5);animation:pulse 2.4s infinite}
    .zen-orb:before{content:"";position:absolute;inset:-5px;border-radius:50%;background:conic-gradient(var(--a),transparent 35%,var(--b) 60%,transparent 80%,var(--c));-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 2px),#000 calc(100% - 1px));mask:radial-gradient(farthest-side,transparent calc(100% - 2px),#000 calc(100% - 1px));animation:rot 3s linear infinite}
    .mini{border:1px solid var(--line);background:rgba(255,255,255,.04);color:#b5c0e0;border-radius:9px;padding:8px 11px;font:600 10px var(--display);letter-spacing:1.5px;cursor:pointer;text-transform:uppercase}
    .mini.on{border-color:var(--a);color:var(--a);box-shadow:0 0 14px -4px var(--a)}
    .zen-log{background:rgba(0,0,0,.32);border:1px solid var(--line);border-radius:14px;padding:12px 14px;height:150px;overflow-y:auto;font-size:13px;line-height:1.7;display:flex;flex-direction:column;gap:6px}
    .zen-log .ln{display:flex;gap:9px;align-items:baseline}
    .zen-log .pfx{font:600 10px var(--display);letter-spacing:1.5px;flex:none;color:var(--a)}
    .zen-log .me .pfx{color:var(--muted)}
    .zen-log .me{color:#9aa6c6}
    .zen-log .zen:last-child span:last-child:after{content:"▌";color:var(--a);animation:blink 1s steps(1) infinite;margin-left:2px}
    @keyframes blink{50%{opacity:0}}
    .zen-input{display:flex;align-items:center;gap:10px;margin-top:12px}
    .zen-input .prompt{font:700 18px var(--display);color:var(--a)}
    .zen-input input{flex:1;min-width:0;background:#070914;color:var(--ink);border:1px solid var(--line);border-radius:12px;padding:11px 14px;font-family:inherit;font-size:16px;outline:none;min-height:46px}
    .zen-input input:focus{border-color:var(--a);box-shadow:0 0 0 3px rgba(110,231,255,.12)}
    .chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
    .chips button{border:1px solid var(--line);background:rgba(255,255,255,.03);color:#9fb0d6;border-radius:999px;padding:7px 12px;font:500 11px var(--display);cursor:pointer}
    .chips button:hover{border-color:var(--a);color:#fff}

    /* habits */
    .habit-list,.task-list{display:grid;gap:10px}
    .habit,.task{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.03);transition:transform .15s,border-color .2s,background .2s;box-shadow:0 8px 18px -12px #000}
    .habit:hover,.task:hover{transform:translateX(3px);border-color:rgba(110,231,255,.4)}
    .habit.done{background:linear-gradient(90deg,rgba(110,231,255,.1),rgba(110,231,255,.02));border-color:rgba(110,231,255,.4);border-left:3px solid var(--acc)}
    .check{appearance:none;-webkit-appearance:none;width:26px;height:26px;border:2px solid #4b557a;border-radius:8px;margin:0;cursor:pointer;display:grid;place-content:center;flex:none;transition:.2s;background:#070914}
    .check:checked{border-color:var(--acc);box-shadow:0 0 14px color-mix(in srgb,var(--acc) 55%,transparent),inset 0 0 8px color-mix(in srgb,var(--acc) 35%,transparent)}
    .check:checked:after{content:'✓';color:var(--acc);font-size:16px;font-weight:700}
    .emoji{background:#070914;border:1px solid var(--line);border-radius:10px;width:38px;height:38px;display:grid;place-items:center;flex:none;box-shadow:inset 0 0 12px rgba(139,92,255,.15)}
    .habit-name,.task-title{text-align:left}
    .habit-name{font-size:14px;font-weight:600;flex:1;min-width:0;overflow-wrap:anywhere}
    .remove{border:0;background:transparent;color:#6b7699;cursor:pointer;font-size:22px;width:38px;height:38px;flex:none;border-radius:8px}
    .remove:hover{color:var(--rose);background:rgba(255,93,115,.08)}
    .add-row{display:flex;gap:10px;margin-top:14px}
    .add-row input,.task-form input{flex:1;min-width:0;background:#070914;color:var(--ink);border:1px solid var(--line);border-radius:12px;padding:11px 14px;font-family:inherit;font-size:16px;outline:none;min-height:46px;transition:.2s}
    .add-row input:focus,.task-form input:focus{border-color:var(--a);box-shadow:0 0 0 3px rgba(110,231,255,.12)}
    .add{border:0;border-radius:12px;padding:0 22px;min-height:46px;background:var(--grad);color:#04050a;font:700 13px var(--display);letter-spacing:1px;cursor:pointer;box-shadow:0 4px 0 #3b2a8a,0 12px 24px -8px rgba(139,92,255,.6);transition:.12s;text-transform:uppercase}
    .add:hover{filter:brightness(1.1)}
    .add:active{transform:translateY(3px);box-shadow:0 1px 0 #3b2a8a,0 4px 10px -4px rgba(139,92,255,.6)}
    .templates{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
    .template{border:1px solid var(--line);background:rgba(255,255,255,.03);color:#b5c0e0;border-radius:10px;padding:10px 12px;font:600 10px var(--display);letter-spacing:1.5px;cursor:pointer;transition:.15s}
    .template:hover{border-color:var(--a);color:#fff;transform:translateY(-2px);box-shadow:0 8px 16px -8px rgba(110,231,255,.5)}
    .install-note{color:#6f7a99;font-size:11px;margin:16px 0 0;line-height:1.7}
    .checkin{margin-top:20px;padding:16px;border:1px solid var(--line);background:rgba(0,0,0,.28);border-radius:14px}
    .checkin-head{display:flex;justify-content:space-between;gap:10px;align-items:center}
    .checkin-head b{display:block;font-size:13px}
    .checkin-head span{display:block;color:var(--muted);font-size:10px;margin-top:4px}
    .checkin select,.checkin textarea{background:#070914;color:var(--ink);border:1px solid var(--line);font:16px Alexandria,sans-serif;outline:none}
    .checkin select{border-radius:10px;padding:9px;max-width:170px;min-height:42px}
    .checkin textarea{width:100%;height:78px;resize:vertical;border-radius:12px;padding:12px;margin-top:12px}
    .checkin textarea:focus{border-color:var(--a)}
    .save-checkin{margin-top:10px;border:1px solid var(--line);border-radius:10px;background:linear-gradient(180deg,#1a2040,#0e1226);color:#dce8ff;padding:11px 16px;font:600 11px var(--display);letter-spacing:1.5px;cursor:pointer;box-shadow:0 3px 0 #060814;text-transform:uppercase}
    .save-checkin:active{transform:translateY(2px);box-shadow:0 1px 0 #060814}

    .task-title{font-size:13px;font-weight:700;flex:1;min-width:0;overflow-wrap:anywhere}
    .due{font:500 10px var(--display);color:var(--muted);background:rgba(255,255,255,.05);border-radius:8px;padding:5px 8px;white-space:nowrap}
    .grade{font:600 11px var(--display);color:#ffd27a;background:rgba(255,190,80,.12);border-radius:8px;padding:5px 8px}
    .task-form{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
    .task-form input:first-child,.task-form .add{grid-column:1/-1}

    /* ===== stats: HUD ===== */
    .stat-total{display:flex;align-items:end;gap:12px;margin:0 0 16px}
    .stat-total strong{font:700 44px var(--display);line-height:1;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
    .stat-total span{font-size:12px;color:var(--muted);padding-bottom:6px}
    .chart-box{--hc:#6ee7ff;position:relative;border:1px solid color-mix(in srgb,var(--hc) 22%,transparent);border-radius:6px;padding:14px 12px 8px;
      background:
        linear-gradient(var(--hc),var(--hc)) 0 0/18px 2px no-repeat,linear-gradient(var(--hc),var(--hc)) 0 0/2px 18px no-repeat,
        linear-gradient(var(--hc),var(--hc)) 100% 0/18px 2px no-repeat,linear-gradient(var(--hc),var(--hc)) 100% 0/2px 18px no-repeat,
        linear-gradient(var(--hc),var(--hc)) 0 100%/18px 2px no-repeat,linear-gradient(var(--hc),var(--hc)) 0 100%/2px 18px no-repeat,
        linear-gradient(var(--hc),var(--hc)) 100% 100%/18px 2px no-repeat,linear-gradient(var(--hc),var(--hc)) 100% 100%/2px 18px no-repeat,
        radial-gradient(ellipse at 50% 0,color-mix(in srgb,var(--hc) 9%,transparent),transparent 70%),
        linear-gradient(160deg,#091024,#050813);
      box-shadow:0 0 40px -14px color-mix(in srgb,var(--hc) 60%,transparent),inset 0 0 50px rgba(0,0,0,.4)}
    .ch-head{display:flex;justify-content:space-between;align-items:center;margin:0 6px 6px}
    .ch-title{font:600 11px var(--display);letter-spacing:3px;color:#a9c4e6;text-transform:uppercase}
    .ch-live{display:inline-flex;align-items:center;gap:7px;font:600 9px var(--display);letter-spacing:2px;color:var(--hc)}
    .ch-live i{width:6px;height:6px;border-radius:50%;background:var(--hc);box-shadow:0 0 10px var(--hc);animation:pulse 1.4s infinite}
    .chart-box svg{display:block;width:100%;height:auto;overflow:visible}
    .chart-box text{font-family:'Space Grotesk',Arial,sans-serif;fill:#7f9cc2}
    .chart-box .axt{letter-spacing:.18em;font-size:9px;fill:#5f7aa0}
    .chart-box .grid{stroke:rgba(120,160,230,.13);stroke-width:1;stroke-dasharray:2 5}
    .chart-box .base{stroke:rgba(140,180,255,.35);stroke-width:1}
    .chart-box .tick{stroke:rgba(140,180,255,.35);stroke-width:1}
    .chart-box .avg{stroke:rgba(255,255,255,.28);stroke-width:1;stroke-dasharray:6 5}
    .chart-box .scan{animation:scan 5.5s linear infinite}
    @keyframes scan{from{transform:translateX(-50px)}to{transform:translateX(var(--pw,300px))}}
    .chart-box .ping{transform-box:fill-box;transform-origin:center;animation:ping 1.8s ease-out infinite}
    @keyframes ping{from{opacity:.9;transform:scale(1)}to{opacity:0;transform:scale(3.4)}}
    .table-box{margin-top:14px;overflow-x:auto;direction:ltr;border:1px solid var(--line);border-radius:10px;-webkit-overflow-scrolling:touch;background:rgba(0,0,0,.25)}
    .table-box::-webkit-scrollbar{height:8px}.table-box::-webkit-scrollbar-thumb{background:#2a3355;border-radius:6px}
    .table-box table{border-collapse:collapse;width:max-content;min-width:100%;font:12px var(--display)}
    .table-box td,.table-box th{border:1px solid rgba(140,160,255,.09);text-align:center;padding:8px 4px;min-width:46px;color:#c9d6f2}
    .table-box th{position:sticky;left:0;z-index:1;background:#0b0e1c;color:var(--muted);font-weight:600;font-size:10px;letter-spacing:1px}
    .table-box td.pc{font-weight:700;color:#fff;text-shadow:0 1px 6px #000a}
    .table-box td.now{box-shadow:inset 0 0 0 2px var(--a);color:var(--a);font-weight:700}

    .quit-card{--acc:#ff6b8a}
    .quit-card .check:checked{border-color:var(--rose)}
    .quit-card .check:checked:after{color:var(--rose)}
    .quit-card .habit.done{background:linear-gradient(90deg,rgba(255,93,115,.1),rgba(255,93,115,.02));border-color:rgba(255,93,115,.45)}
    .quit-card .habit:hover{border-color:rgba(255,93,115,.5)}
    .quit-score{font:600 11px var(--display);letter-spacing:1px;color:var(--rose);white-space:nowrap}
    .quit-card .stat-total strong{background:linear-gradient(120deg,#ff9a8b,#ff4f8b);-webkit-background-clip:text;background-clip:text}

    .toast{position:fixed;bottom:calc(24px + env(safe-area-inset-bottom));left:50%;transform:translate(-50%,20px);background:rgba(20,26,50,.95);border:1px solid var(--line);color:#fff;padding:12px 20px;border-radius:12px;font-size:13px;opacity:0;transition:.25s;pointer-events:none;z-index:20;max-width:90vw;text-align:center;backdrop-filter:blur(10px)}
    .toast.show{opacity:1;transform:translate(-50%,0)}

    @media(max-width:1100px){.app{padding:20px 20px calc(40px + env(safe-area-inset-bottom))}.content{grid-template-columns:1fr}.hero{grid-template-columns:1fr;padding:28px}.hero-orb{order:-1;min-height:260px}.orb{width:250px}}
    @media(max-width:600px){
      .app{padding:14px 12px calc(34px + env(safe-area-inset-bottom))}
      .top{margin-bottom:16px}.brand-text b{font-size:21px;letter-spacing:4px}
      .hero{padding:20px 16px;margin-bottom:16px;gap:6px}.hero-orb{min-height:230px}.orb{width:210px}
      .kpis{grid-template-columns:repeat(2,1fr);margin-top:20px}.kpi b{font-size:22px}
      .card{padding:16px;border-radius:16px}.content,.col{gap:16px}
      .stat-total strong{font-size:36px}.zen-log{height:170px}
      #monthLabel{min-width:104px}
    }
    @media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.boot{display:none}}

    /* ===== v3 additions ===== */
    .hdr-right{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
    .install-btn{border:1px solid var(--a);background:rgba(110,231,255,.08);color:var(--a);border-radius:12px;padding:0 16px;min-height:42px;font:700 11px var(--display);letter-spacing:1.5px;cursor:pointer;text-transform:uppercase;box-shadow:0 0 18px -6px var(--a)}
    .install-btn[hidden]{display:none}

    .alerts{display:grid;gap:10px;margin-bottom:20px}
    .alerts:empty{display:none}
    .alert{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 16px;border:1px solid var(--line);border-radius:14px;background:var(--glass);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);font-size:13px;line-height:1.7}
    .alert .ico{font-size:18px;flex:none}
    .alert .txt{flex:1;min-width:180px}
    .alert.warn{border-color:rgba(255,190,80,.5);background:linear-gradient(90deg,rgba(255,190,80,.1),rgba(255,190,80,.02))}
    .alert.bad{border-color:rgba(255,93,115,.55);background:linear-gradient(90deg,rgba(255,93,115,.12),rgba(255,93,115,.02))}
    .alert.info{border-color:rgba(110,231,255,.4)}
    .alert button{border:1px solid var(--line);background:rgba(255,255,255,.05);color:#dce8ff;border-radius:10px;padding:8px 12px;font:600 10px var(--display);letter-spacing:1.2px;cursor:pointer;text-transform:uppercase}

    .zen-log{height:250px;white-space:pre-wrap}
    .zen-log .ln{align-items:flex-start}
    .zen-log .ln>span:last-child{min-width:0;overflow-wrap:anywhere}
    .zen-log .ln.zen:last-child>span:last-child:after{content:""}
    .zen-log .ln.zen:last-child.typing>span:last-child:after{content:"▌";color:var(--a);animation:blink 1s steps(1) infinite;margin-left:2px}
    @media(max-width:600px){.zen-log{height:280px}}

    .date-nav{display:flex;align-items:center;gap:6px}
    .date-nav .round{width:34px;height:34px;font-size:18px}
    .date-nav .round:disabled{opacity:.3;cursor:default}
    .date-nav .dlabel{font:600 12px var(--display);min-width:112px;text-align:center;color:var(--ink)}
    .today-btn{border:1px solid var(--a);background:rgba(110,231,255,.08);color:var(--a);border-radius:9px;padding:7px 10px;font:700 10px var(--display);letter-spacing:1.4px;cursor:pointer;text-transform:uppercase}
    .today-btn[hidden]{display:none}

    .streak{font:700 11px var(--display);color:#ffb86b;background:rgba(255,160,70,.12);border-radius:8px;padding:4px 7px;white-space:nowrap;flex:none}
    .icon-btn{border:0;background:transparent;color:#6b7699;cursor:pointer;font-size:17px;width:36px;height:38px;flex:none;border-radius:8px}
    .icon-btn:hover{color:var(--a);background:rgba(110,231,255,.08)}
    .empty{color:var(--muted);font-size:12px;padding:10px 4px;line-height:1.8}

    .mood-row{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
    .mood-opt{flex:1;min-width:92px;border:1px solid var(--line);background:rgba(255,255,255,.03);color:#b5c0e0;border-radius:12px;padding:10px 8px;font:600 11px Alexandria,var(--display);cursor:pointer;text-align:center;transition:.15s}
    .mood-opt.on{border-color:var(--a);color:#fff;box-shadow:0 0 16px -6px var(--a);background:rgba(110,231,255,.08)}
    .mood-opt b{display:block;font-size:20px;margin-bottom:2px}
    .ck-list{display:grid;gap:8px;margin-top:16px;max-height:340px;overflow-y:auto}
    .ck{display:flex;gap:12px;align-items:flex-start;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.025);cursor:pointer}
    .ck:hover{border-color:rgba(110,231,255,.4)}
    .ck .when{font:600 11px var(--display);color:var(--muted);min-width:58px;letter-spacing:.5px}
    .ck .mo{font-size:18px;flex:none}
    .ck .nt{font-size:12.5px;line-height:1.7;color:#c9d6f2;overflow-wrap:anywhere;flex:1;min-width:0}
    .ck .pc{font:600 10px var(--display);color:var(--a);flex:none}
    .mood-sum{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
    .mood-sum span{font:600 10px var(--display);letter-spacing:1px;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:5px 10px}

    .task.done .task-title{text-decoration:line-through;opacity:.5}
    .cd{font:600 10px var(--display);border-radius:8px;padding:5px 8px;white-space:nowrap;background:rgba(255,255,255,.05);color:var(--muted)}
    .cd.soon{background:rgba(255,190,80,.14);color:#ffd27a}
    .cd.urgent{background:rgba(255,93,115,.16);color:#ff8a9a}
    .task .check{width:22px;height:22px;border-radius:7px}

    .perf-tabs{display:flex;gap:6px}
    .perf-list{display:grid;gap:12px;margin-top:6px}
    .perf{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:6px 12px;align-items:center}
    .perf .nm{font-size:13px;font-weight:600;overflow-wrap:anywhere;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
    .perf .tag{font:700 9px var(--display);letter-spacing:1.4px;border-radius:6px;padding:3px 6px;text-transform:uppercase}
    .perf .tag.best{background:rgba(110,231,255,.14);color:var(--a)}
    .perf .tag.weak{background:rgba(255,93,115,.15);color:#ff8a9a}
    .perf .tag.q{background:rgba(255,79,216,.12);color:#ff9be8}
    .perf .bar{grid-column:2;height:8px;border-radius:6px;background:rgba(255,255,255,.06);overflow:hidden}
    .perf .bar i{display:block;height:100%;border-radius:6px;transition:width .6s cubic-bezier(.2,.8,.2,1)}
    .perf .val{font:700 14px var(--display);text-align:right;min-width:54px}
    .perf .sub{grid-column:2/4;font:500 10.5px var(--display);color:var(--muted);letter-spacing:.4px}
    .dow{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-top:6px;align-items:end;height:90px}
    .dow div{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:4px;height:100%}
    .dow i{display:block;width:100%;border-radius:6px 6px 2px 2px;min-height:3px}
    .dow small{font:500 9px Alexandria,var(--display);color:var(--muted)}
    .dow b{font:700 10px var(--display);color:#c9d6f2}
    .subhead{font:600 10px var(--display);letter-spacing:2.5px;color:var(--muted);text-transform:uppercase;margin:22px 0 8px}
    .mood-line{font-size:12px;color:#c9d6f2;line-height:1.9;margin:10px 0 0}

    .set-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 0;border-top:1px solid var(--line)}
    .set-row:first-of-type{border-top:0;padding-top:0}
    .set-row .lbl{font-size:13px;font-weight:600}
    .set-row .hint{display:block;font-size:11px;color:var(--muted);margin-top:3px;line-height:1.7;font-weight:400}
    .btns{display:flex;gap:8px;flex-wrap:wrap}
    .btn{border:1px solid var(--line);border-radius:10px;background:linear-gradient(180deg,#1a2040,#0e1226);color:#dce8ff;padding:10px 14px;font:600 10.5px var(--display);letter-spacing:1.3px;cursor:pointer;box-shadow:0 3px 0 #060814;text-transform:uppercase}
    .btn:active{transform:translateY(2px);box-shadow:0 1px 0 #060814}
    .btn.danger{border-color:rgba(255,93,115,.5);color:#ff8a9a}
    .btn.primary{border-color:var(--a);color:var(--a)}
    .switch{position:relative;width:46px;height:26px;flex:none}
    .switch input{appearance:none;-webkit-appearance:none;position:absolute;inset:0;margin:0;cursor:pointer;border-radius:999px;background:#1a2040;border:1px solid var(--line);transition:.2s}
    .switch input:checked{background:rgba(110,231,255,.25);border-color:var(--a)}
    .switch input:after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#8b95b0;transition:.2s}
    .switch input:checked:after{left:23px;background:var(--a);box-shadow:0 0 10px var(--a)}
    input[type=time],.card select,.modal input,.modal select{background:#070914;color:var(--ink);border:1px solid var(--line);border-radius:10px;padding:9px 10px;font:16px Alexandria,sans-serif;outline:none;min-height:42px;color-scheme:dark}
    .status-ok{color:#7dffb2}.status-bad{color:#ff8a9a}

    .modal{position:fixed;inset:0;z-index:60;background:rgba(2,3,8,.72);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:grid;place-items:center;padding:16px}
    .modal[hidden]{display:none}
    .modal-box{width:min(440px,100%);max-height:92vh;overflow-y:auto;background:#0b0e1c;border:1px solid var(--line);border-radius:18px;padding:22px;box-shadow:0 40px 90px -20px #000}
    .modal-box h3{margin:0 0 14px;font:700 14px var(--display);letter-spacing:2px;text-transform:uppercase}
    .modal-box p{margin:0 0 12px;font-size:13px;line-height:1.8;color:#c9d6f2}
    .modal .fld{display:grid;gap:6px;margin-bottom:12px}
    .modal .fld label{font:600 10px var(--display);letter-spacing:1.6px;color:var(--muted);text-transform:uppercase}
    .modal .fld input,.modal .fld select{width:100%}
    .emoji-pick{display:flex;gap:6px;flex-wrap:wrap}
    .emoji-pick button{width:36px;height:36px;border-radius:9px;border:1px solid var(--line);background:rgba(255,255,255,.03);font-size:18px;cursor:pointer}
    .emoji-pick button:hover,.emoji-pick button.on{border-color:var(--a);box-shadow:0 0 12px -4px var(--a)}
    .modal-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end;margin-top:16px}
    .modal-actions .left{margin-right:auto;display:flex;gap:6px}
    .tilt.no-tilt{transform:none}
    .table-box td[data-d]{cursor:pointer}
    .table-box td.sel{background:rgba(139,92,255,.35)}
    .hero-date{color:var(--a);font:600 11px var(--display);letter-spacing:2px}
    @media(max-width:600px){.date-nav .dlabel{min-width:88px;font-size:11px}.perf{grid-template-columns:auto minmax(0,1fr) auto}.card-head{flex-wrap:wrap}}
    .ck-text{width:100%;height:84px;resize:vertical;border-radius:12px;padding:12px;margin-top:12px;background:#070914;color:var(--ink);border:1px solid var(--line);font:16px Alexandria,sans-serif;outline:none}
    .ck-text:focus{border-color:var(--a)}