:root{color-scheme:dark;--bg:#15101d;--surface:#211827;--text:#fff1ef;--muted:#c4afbf;--pink:#f4abc3;--line:#ffffff24;--green:#c0dac6}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--bg);color:var(--text);font:16px/1.6 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button,input,a{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button{cursor:pointer;min-height:44px;padding:10px 18px;border:1px solid var(--line);border-radius:8px;color:var(--text);background:#ffffff07;transition:background .2s,transform .2s,border-color .2s}button:hover{background:#ffffff14;border-color:#e6a3bc88}button:active{transform:scale(.97)}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--pink);outline-offset:4px}button:disabled{opacity:.5;cursor:not-allowed}.ambient{position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 20% 20%,#6c344c35,transparent 55%),radial-gradient(ellipse at 90% 70%,#4d2c5f25,transparent 60%)}header{max-width:1280px;margin:auto;padding:28px 5%;display:flex;justify-content:space-between;align-items:center;gap:16px}.brand{color:var(--text);font:bold 34px/1 Georgia,serif;text-decoration:none;letter-spacing:-2px}.brand span{display:block;font:10px/1.8 system-ui,sans-serif;text-transform:uppercase;letter-spacing:2px;color:var(--muted);margin-top:7px}.head-controls{display:flex;gap:10px;align-items:center;font-size:12px;color:var(--muted)}.head-controls button{font-size:12px;margin-left:10px}.live-dot{height:6px;width:6px;background:var(--green);border-radius:50%;box-shadow:0 0 14px #b9ddba80}main{max-width:1160px;margin:auto;padding:0 32px}.stage{display:grid;grid-template-columns:.88fr 1.12fr;gap:70px;align-items:center;min-height:650px;padding:40px 0 70px}.portrait-wrap{position:relative;isolation:isolate}.portrait-wrap img{position:relative;display:block;width:100%;height:500px;object-fit:cover;object-position:50% 25%;border-radius:180px 180px 16px 16px;box-shadow:0 30px 90px #0006;border:1px solid #f7c1d530;transition:opacity .25s}.halo{position:absolute;inset:-40px -30px;border-radius:50%;z-index:-1;background:radial-gradient(ellipse,#c3769745,transparent 68%);animation:glow 7s ease-in-out infinite alternate}.portrait-caption{font-size:9px;letter-spacing:2px;display:block;text-align:center;color:var(--muted);margin-top:16px}.eyebrow{font-size:10px;font-weight:600;letter-spacing:2.3px;color:var(--pink);margin-bottom:22px}h1,h2,h3{font-family:Georgia,"Times New Roman",serif;font-weight:400;line-height:1.12}h1{font-size:clamp(38px,4.6vw,62px);letter-spacing:-2px;margin:20px 0 28px}h1 em{color:var(--pink);font-weight:400}h2{font-size:34px;letter-spacing:-1px;margin:0 0 28px}h3{font-size:30px;margin:20px 0}#dialogue{font-size:18px;color:#dfc8d7;max-width:440px;min-height:90px;line-height:1.7}.reactions{display:flex;gap:12px;flex-wrap:wrap}.reactions button{background:linear-gradient(130deg,#683e55,#3d2a42);border-color:#d38da55c}.reactions span{padding-left:12px;color:var(--pink)}.energy{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:28px;font-size:12px}.energy>span{color:var(--muted);margin-right:5px}.energy button{padding:6px 12px;min-height:40px}.text-button{border:0;color:var(--muted)}button.selected{background:#f2b0c51c;border-color:#e7a6bc;color:#ffd1e2}.jump{display:inline-block;margin-top:30px;padding:8px 0;color:var(--pink);text-decoration:none;font-size:13px}.jump span{margin-left:18px}.sparks{position:absolute;inset:0;pointer-events:none}.sparks i{width:4px;height:4px;background:#f5b9ce;position:absolute;bottom:8%;border-radius:50%;opacity:0;animation:rise 7s infinite ease-in-out}.sparks i:nth-child(1){left:10%;animation-delay:1s}.sparks i:nth-child(2){left:24%;animation-delay:3s}.sparks i:nth-child(3){left:48%;animation-delay:5s}.sparks i:nth-child(4){left:65%;animation-delay:2s}.sparks i:nth-child(5){left:86%;animation-delay:4s}.sparks i:nth-child(6){left:94%;animation-delay:6s}#workspace{border-top:1px solid var(--line)}nav{display:flex;gap:36px;border-bottom:1px solid var(--line)}nav button{border:0;border-radius:0;padding:22px 0;color:var(--muted);background:none}nav button[aria-current]{color:var(--pink);box-shadow:inset 0 -2px var(--pink)}.panel{padding:44px 0 50px}.panel[hidden]{display:none}#focus{display:grid;grid-template-columns:1.2fr .8fr;gap:70px}.focus-main>label,label{display:block;font-size:12px;color:var(--muted);margin:12px 0 9px}input{width:100%;min-height:48px;border:1px solid var(--line);border-radius:6px;background:#ffffff05;padding:12px 14px;color:var(--text)}input::placeholder{color:#a493a6;font-size:13px}.timer{font-size:clamp(70px,9vw,112px);line-height:1.2;letter-spacing:-5px;font-weight:250;font-variant-numeric:tabular-nums;margin:20px 0 0}#timer-state{font-size:12px;color:var(--muted);margin:4px 0 26px}.lengths,.actions{display:flex;flex-wrap:wrap;gap:9px}.lengths button{padding:8px 14px;font-size:12px}.actions{margin:26px 0 12px}.primary{background:linear-gradient(125deg,#efb2c6,#d78cab);color:#241725;border-color:transparent;font-weight:600;min-width:140px}.primary:hover{background:#ffc9df;border-color:#ffc9df}.primary span{padding-left:18px}.subtle{font-size:12px;line-height:1.8;color:var(--muted)}aside{border-left:1px solid var(--line);padding:15px 0 0 36px}.outline-heart{font-size:56px;line-height:1;color:var(--pink)}aside p{color:var(--muted);font-size:14px;line-height:1.8}aside button{margin-top:18px;font-size:12px}.notice{margin-top:40px;border-top:1px solid var(--line);padding-top:22px;font-size:12px}.notice p{font-size:12px}.notice strong{font-weight:500}form{display:grid;grid-template-columns:1fr 160px auto;gap:15px;align-items:end;margin:28px 0}form button{min-height:48px}.routine{display:flex;align-items:center;gap:14px;padding:20px 0;border-top:1px solid var(--line)}.routine .check{min-width:44px;border-radius:50%;padding:7px;font-size:22px}.routine.done .check{color:var(--green);border-color:var(--green)}.routine-name{flex:1;overflow-wrap:anywhere;min-width:0}.routine-name strong{font-weight:500;display:block}.routine-name span{font-size:12px;color:var(--muted)}.remove{font-size:12px;background:none;border:0;color:var(--muted)}.empty{padding:32px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);color:var(--muted)}#routine-error{color:#ffb1be;font-size:13px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:40px 0 48px}.stats strong{display:block;font-size:42px;font-weight:400;color:var(--pink)}.stats span{font-size:12px;color:var(--muted)}.history-row{padding:18px 0;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}.history-row strong{font-weight:500;overflow-wrap:anywhere}.history-row span{font-size:12px;color:var(--muted)}footer{border-top:1px solid var(--line);padding:30px 0 45px;color:var(--muted);font-size:11px;max-width:760px}footer p{margin:8px 0}footer span{color:var(--pink)}dialog{max-width:none;max-height:none;width:100%;height:100dvh;margin:0;padding:60px 5%;border:0;background:radial-gradient(ellipse at 25% 40%,#643347,#17101f 70%);color:var(--text);overflow:auto}dialog::backdrop{background:#15101d}.scene-close{position:absolute;right:25px;top:20px;font-size:12px}.scene-close span{margin-left:15px}.scene-content{max-width:1050px;min-height:calc(100dvh - 120px);margin:auto;display:grid;grid-template-columns:.85fr 1.15fr;gap:65px;align-items:center}.scene-content img{width:100%;max-height:72dvh;object-fit:cover;object-position:center 25%;border-radius:160px 160px 14px 14px;box-shadow:0 0 100px #e387a333}.scene-content h2{font-size:38px;overflow-wrap:anywhere}.scene-content .timer{font-size:clamp(80px,10vw,132px)}#scene-state{color:#dec3d2}.running .timer{color:#ffd7e6;animation:breathe 4s infinite ease-in-out}.reacting #portrait,.reacting #scene-portrait{animation:reveal .65s cubic-bezier(.15,.7,.2,1)}.celebrating .scene-content{animation:celebrate .8s ease-out}.celebrating .focus-main{animation:celebrate .8s ease-out}#celebration{position:absolute;inset:0;pointer-events:none;overflow:hidden}#celebration i{position:absolute;top:20%;font-size:26px;color:#f6bdd3;animation:confetti 2s ease-out forwards;left:50%}#celebration i:nth-child(2n){color:#e0cc9a}#storage.warning{color:#ffb1be}@keyframes glow{to{transform:scale(1.12) translateY(-15px);opacity:.6}}@keyframes rise{0%{opacity:0;transform:translateY(0)}20%{opacity:.7}100%{opacity:0;transform:translateY(-330px)}}@keyframes reveal{from{opacity:.25;transform:translateY(8px) scale(.97)}to{opacity:1;transform:none}}@keyframes breathe{50%{text-shadow:0 0 45px #ffbdd44a}}@keyframes celebrate{40%{filter:drop-shadow(0 0 24px #d990b666);transform:scale(1.015)}}@keyframes confetti{to{transform:translate(var(--dx),60vh) rotate(160deg);opacity:0}}.no-motion *,.no-motion *::before,.no-motion *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}@media(max-width:760px){header{padding:22px 24px}.head-controls>span:not(.live-dot){display:none}main{padding:0 24px}.stage{grid-template-columns:1fr;gap:32px;padding:24px 0 40px;min-height:0}.portrait-wrap{max-width:340px;width:100%;margin:auto}.portrait-wrap img{height:360px;object-position:50% 23%}.portrait-caption{font-size:8px}h1{font-size:42px;letter-spacing:-1.5px;margin:20px 0}.eyebrow{font-size:9px;margin-bottom:16px}#dialogue{min-height:0;font-size:16px;margin-bottom:24px}.energy{margin-top:20px}.jump{margin-top:16px}.intro{padding-bottom:10px}#focus{grid-template-columns:1fr;gap:32px}.panel{padding-top:32px}h2{font-size:30px}aside{border-left:0;border-top:1px solid var(--line);padding:26px 0 0}aside h3{font-size:26px}.outline-heart{font-size:40px}nav{gap:30px}form{grid-template-columns:1fr}.stats{gap:14px}.stats strong{font-size:32px}.stats span{font-size:11px}.scene-content{grid-template-columns:1fr;gap:20px;padding-top:24px;text-align:center;min-height:0}.scene-content img{height:31dvh;width:65%;max-width:260px;margin:auto}.scene-content h2{font-size:27px;margin:14px 0}.scene-content .eyebrow{margin:12px 0}.scene-content .timer{font-size:82px;margin:8px 0}.scene-content .actions{justify-content:center}dialog{padding:60px 20px 30px}.scene-close{right:18px;top:14px}.head-controls button{margin:0}.brand{font-size:30px}.brand span{font-size:8px}.routine{gap:10px}.remove{padding:10px 2px}.actions button{font-size:12px;padding:10px 13px}.primary{min-width:125px}.notice{margin-top:28px}.timer{font-size:86px}}@media(max-width:350px){main{padding:0 18px}header{padding:20px 18px}h1{font-size:36px}.portrait-wrap img{height:330px}.reactions{gap:8px}.reactions button{padding:10px 12px;font-size:13px}.energy{gap:5px}.energy button{padding:6px 9px}.head-controls{gap:5px}.head-controls button{padding:8px 10px}.timer{font-size:78px}.lengths{gap:7px}.lengths button{padding:8px 11px}}
.panel[hidden],#focus[hidden]{display:none}
/* 3D-style stage: raised portrait plane, orbital light and pointer perspective. */
.stage{perspective:1200px}.portrait-wrap{transform-style:preserve-3d;transform:rotateY(var(--ry,-6deg)) rotateX(var(--rx,2deg));transition:transform .35s ease-out}.portrait-wrap:before{content:"";position:absolute;inset:22px -12px -14px 14px;border:1px solid #ecacc740;border-radius:180px 180px 16px 16px;background:linear-gradient(130deg,#773c5940,#35253e80);transform:translateZ(-25px);box-shadow:12px 22px 65px #0008;z-index:-1}.portrait-wrap:after{content:"";position:absolute;inset:-18px -23px;border:1px solid #f9b9d03b;border-radius:50%;transform:translateZ(-40px) rotateZ(-12deg);box-shadow:inset 1px 0 22px #f4adc51a,1px 0 26px #d58bbf22;z-index:-1}.portrait-wrap img{transform:translateZ(24px);box-shadow:16px 24px 60px #0007,inset 0 0 30px #fff2}.portrait-caption{transform:translateZ(35px)}.halo{background:radial-gradient(ellipse,#d78aab65,transparent 68%);inset:-65px -55px}.intro{position:relative;transform:translateZ(12px)}.intro:before{content:"";position:absolute;inset:-35px -20px;z-index:-1;border-radius:50%;background:radial-gradient(ellipse,#9e4e7612,transparent 70%)}.reactions button,.primary{box-shadow:0 5px 0 #100b1780,0 12px 24px #0003}.reactions button:hover,.primary:hover{transform:translateY(-2px)}.reactions button:active,.primary:active{transform:translateY(2px)}.scene-content{perspective:1200px}.scene-content img{transform:rotateY(7deg) rotateX(2deg);box-shadow:25px 25px 0 #dd93b110,35px 40px 90px #0007,0 0 120px #e387a322}@media(max-width:760px){.portrait-wrap{max-width:320px;transform:rotateY(-4deg) rotateX(2deg)}.portrait-wrap:after{inset:-12px -8px}.portrait-wrap:before{inset:15px -7px -9px 10px}.scene-content img{transform:rotateY(5deg)}}.no-motion .portrait-wrap,.no-motion .scene-content img{transform:none!important}@media(prefers-reduced-motion:reduce){.portrait-wrap,.scene-content img{transform:none!important}}
main{overflow:clip;overflow-clip-margin:24px}.halo{pointer-events:none}@media(max-width:760px){.halo{inset:-35px -18px}}
html,body{overflow-x:clip}main{overflow-clip-margin:0}