:root{color-scheme:dark;--cyan:#7eeaf4;--muted:#9cb6c4}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% 30%,#103444 0,#061721 45%,#030c13 90%);color:#edfaff;font-family:Calibri,'Segoe UI',sans-serif;min-height:100vh}header{max-width:1200px;margin:auto;padding:28px 34px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #78e9f417}.brand{text-decoration:none;color:var(--cyan);font-size:24px;font-weight:700;letter-spacing:4px}.brand span{display:block;font-size:9px;letter-spacing:2px;margin-top:5px;font-weight:400}.session{font-size:11px;letter-spacing:2px;color:var(--muted)}main{max-width:670px;margin:auto;padding:32px 24px 24px;text-align:center}.eyebrow{font-size:10px;letter-spacing:3px;color:var(--cyan)}h1{font-size:clamp(32px,7vw,48px);letter-spacing:5px;margin:10px 0 6px;font-weight:400}.intro>p:last-child{color:var(--muted);font-size:17px;margin:0 0 26px}.timer-card{position:relative;height:350px;border:1px solid #7eeaf44d;border-radius:26px;overflow:hidden;box-shadow:0 16px 80px #0005,0 0 35px #39dce412}.hero{width:100%;height:100%;object-fit:cover;object-position:center 45%;position:absolute;inset:0}.shade{position:absolute;inset:0;background:linear-gradient(#020e1580,#03121bc9 45%,#021018e6)}.timer-content{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;padding:30px}.pill{font-size:10px;letter-spacing:2px;border:1px solid #b6f6ff40;border-radius:30px;padding:9px 15px;background:#06212a80;color:#b4f6ff}#time{font-size:clamp(80px,18vw,126px);font-weight:300;font-variant-numeric:tabular-nums;letter-spacing:-4px;line-height:1.25;text-shadow:0 0 40px #81ecf44d}#message{margin:5px 0 25px;color:#c8e0e8;font-size:17px}.track{height:3px;background:#d3f5ff29;width:75%;border-radius:5px;overflow:hidden}#progress{width:0;height:100%;background:var(--cyan)}.controls{display:flex;justify-content:center;gap:12px;margin:23px 0 17px}button{border:1px solid #a0d3dd38;background:#112a36;color:#daf3f7;padding:13px 24px;border-radius:12px;font:inherit;font-size:16px;cursor:pointer;min-height:46px}.primary{background:var(--cyan);color:#05212b;font-weight:700;min-width:160px;border-color:var(--cyan);box-shadow:0 0 22px #7eeaf41a}button:hover{filter:brightness(1.12)}button:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid #e6b3ff;outline-offset:4px}.sound{display:flex;align-items:center;justify-content:center;gap:12px;color:var(--muted);font-size:13px}.sound button{font-size:13px;background:none;border:none;padding:8px}.sound input{width:90px;accent-color:var(--cyan)}.hint{font-size:12px;color:var(--muted);margin:10px 0 24px}details{text-align:left;background:#0b202a88;border:1px solid #72d4e11a;border-radius:12px;font-size:14px}summary{cursor:pointer;padding:16px;color:#cae8f0}summary span{float:right;font-size:11px;color:var(--cyan)}.notes{display:grid;grid-template-columns:1fr 1fr;padding:0 18px 14px;gap:8px 20px}.notes p{margin:4px 0;color:var(--muted);font-size:13px}.notes b{color:var(--cyan);display:inline-block;width:42px}footer{max-width:1200px;margin:0 auto;padding:20px 34px;display:flex;align-items:center;gap:20px;border-top:1px solid #78e9f417}.watermark{width:76px;height:80px;object-fit:contain;opacity:.7}footer p{font-size:13px;color:var(--muted);line-height:1.7}footer p span{display:block;font-size:10px;letter-spacing:2px}.footer-note{margin-left:auto;color:var(--cyan);font-size:34px;opacity:.5}@media(max-width:520px){header{padding:20px}.session{display:none}main{padding:24px 18px}.timer-card{height:320px}summary span{display:none}.notes{grid-template-columns:1fr}footer{padding:18px;gap:12px}.watermark{width:60px}.sound{gap:7px}.sound input{width:65px}}@media(prefers-reduced-motion:no-preference){button{transition:filter .15s}#progress{transition:width .2s}}
.watermark{position:fixed;left:max(16px,env(safe-area-inset-left));bottom:max(12px,env(safe-area-inset-bottom));width:116px;height:120px;object-fit:contain;opacity:.95;z-index:10;pointer-events:none;border-radius:16px;box-shadow:0 4px 24px #0009;background:#020a10}footer{min-height:156px;padding-left:156px}body{padding-bottom:env(safe-area-inset-bottom)}@media(max-width:520px){.watermark{left:10px;width:84px;height:88px;border-radius:12px}footer{min-height:118px;padding-left:108px}footer p{font-size:12px}.footer-note{display:none}}
