*{box-sizing:border-box}html{color-scheme:dark;--bg:#090d0f;--surface:#0e1417;--field:#10171a;--text:#f7f7f0;--muted:#b9bdbd;--line:#41484b;--accent:#edc764;--bright:#fff0b1;--glow:#e7b52e55;--name:linear-gradient(#fffdf0,#f7d578 65%,#d8a63d);--hex:#bda34b10}html[data-theme=red]{--bg:#0e0c0e;--surface:#161216;--field:#1b1519;--text:#f8f4f4;--muted:#c3b9bd;--line:#51454b;--accent:#ff5965;--bright:#ffb9bf;--glow:#ff24323b;--name:linear-gradient(#fff2f3,#ff6e79 65%,#ee2638);--hex:#e4405510}html[data-theme=pearl]{color-scheme:light;--bg:#edeff1;--surface:#fafbfc;--field:#fff;--text:#1b2329;--muted:#535e66;--line:#a7b0b7;--accent:#58636f;--bright:#202b35;--glow:#00000008;--name:linear-gradient(#18222c,#586778);--hex:#293c4f0c}body{margin:0;background:var(--bg);color:var(--text);font-family:Arial,'Segoe UI',sans-serif;line-height:1.5;min-width:280px}button,input,select,a{font:inherit}button,a,input,select{touch-action:manipulation}button,.file-button{cursor:pointer;color:var(--text);background:var(--field);border:1px solid var(--line);border-radius:11px;padding:12px 19px;min-height:46px;font-weight:700}button:hover:not(:disabled),.file-button:hover{filter:brightness(1.15)}button:disabled{opacity:.65;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,.file-button:focus-within{outline:3px solid var(--accent);outline-offset:4px}a{color:var(--text);text-underline-offset:4px;min-height:44px;display:inline-flex;align-items:center}main{max-width:920px;margin:auto;padding:max(14px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left))}[hidden]{display:none!important}.brand-header{position:relative;text-align:center;padding:0 70px 19px}.brand{width:220px;max-width:100%;height:auto;display:block;margin:0 auto}.brand-header h1{font-size:13px;letter-spacing:4px;margin:4px 0 0;color:var(--muted)}.settings-link{position:absolute;top:20px;right:0;font-size:12px;background:transparent;border:0;padding:8px;min-width:64px}.session-frame{border:1px solid var(--line);border-radius:24px;padding:28px 44px 26px;background:linear-gradient(30deg,transparent 24%,var(--hex) 25%,var(--hex) 26%,transparent 27%,transparent 74%,var(--hex) 75%,var(--hex) 76%,transparent 77%) 0 0/85px 148px,linear-gradient(150deg,transparent 24%,var(--hex) 25%,var(--hex) 26%,transparent 27%,transparent 74%,var(--hex) 75%,var(--hex) 76%,transparent 77%) 0 0/85px 148px,var(--surface)}.studio{text-align:center}.studio h2{font-size:clamp(30px,5.4vw,54px);line-height:1.13;font-weight:900;letter-spacing:-1px;margin:0 auto 13px;text-wrap:balance;overflow-wrap:anywhere;background:var(--name);background-clip:text;-webkit-background-clip:text;color:transparent;filter:drop-shadow(0 0 12px var(--glow));max-width:100%}.subtitle{font-size:clamp(11px,1.7vw,16px);font-weight:750;letter-spacing:.5px;margin:0 0 17px}.status{display:inline-block;border:1.5px solid var(--accent);border-radius:28px;padding:9px 28px;min-width:180px;font-size:15px;margin:0}.time-panel{text-align:center;padding:clamp(30px,5.5vh,68px) 0 24px}.time-panel h3,.cost-panel h3{font-size:clamp(17px,2.4vw,23px);letter-spacing:.6px;font-weight:800;margin:0 0 10px}#timer{font-variant-numeric:tabular-nums;font-size:clamp(56px,12vw,112px);font-weight:900;line-height:1.06;letter-spacing:-3px;color:var(--bright);text-shadow:0 0 24px var(--glow);white-space:nowrap}#timer.long-time{font-size:clamp(40px,9vw,88px)}.cost-panel{max-width:650px;margin:auto;border:1.5px solid var(--accent);border-radius:23px;background:var(--surface);text-align:center;padding:22px 20px}.total{color:var(--bright);font-weight:900;font-size:clamp(43px,8vw,76px);line-height:1.15;text-shadow:0 0 20px var(--glow);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.total #cost-currency{font-size:.7em}#rate-caption{font-size:clamp(13px,1.9vw,18px);margin:13px 0 0}.minimum-caption{font-size:12px;color:var(--muted);margin:8px 0 0}.session-controls{display:grid;grid-template-columns:1fr 1fr;gap:13px 16px;margin:clamp(30px,5vh,60px) 0 0}.session-controls button{border:2px solid var(--line);border-radius:14px;font-size:clamp(20px,2.7vw,27px);font-weight:850;min-height:70px;padding:17px 12px;background:var(--surface)}.session-controls .start{border-color:#69d8af}.session-controls .pause{border-color:#d6bd51}.session-controls .stop{border-color:#e76972}.session-controls .reset{border-color:#929da5}html[data-theme=pearl] .session-controls .start{border-color:#19734e}html[data-theme=pearl] .session-controls .pause{border-color:#886600}html[data-theme=pearl] .session-controls .stop{border-color:#b62b3d}html[data-theme=pearl] .session-controls .reset{border-color:#5e6a73}footer{display:flex;justify-content:space-between;gap:12px;font-size:9px;letter-spacing:1px;color:var(--muted);margin:15px 4px}.settings-header{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:28px}.settings-header p{font-size:11px;letter-spacing:2px;color:var(--muted);margin:0}.settings-header h2{font-size:30px;margin:2px 0}#settings-screen{max-width:700px;margin:auto}.settings-header button{font-size:13px}form>label,label{display:grid;gap:8px;font-size:12px;font-weight:650}input,select{width:100%;min-width:0;padding:13px;border:1px solid var(--line);border-radius:9px;background:var(--field);color:var(--text);font-size:16px;min-height:48px}fieldset{margin:0;padding:0;border:0;min-width:0}fieldset:disabled{opacity:.65}.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:22px 0}.checkbox{display:flex;align-items:center;gap:12px;margin:20px 0;font-size:14px}.checkbox input{width:19px;min-height:19px;flex-shrink:0;accent-color:var(--accent)}.save{color:var(--bg);background:var(--accent);border-color:var(--accent)}form>.save{margin-top:10px;min-width:200px}.muted{color:var(--muted);font-size:13px;line-height:1.7}.notice,.warning{border:1px solid var(--accent);border-radius:9px;padding:12px;font-size:13px}.warning{margin:15px 0 0}.settings-section{border-top:1px solid var(--line);padding-top:20px;margin-top:28px}.settings-section h3{font-size:13px;letter-spacing:1px}.settings-section p{font-size:13px}.settings-actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin:15px 0}.settings-actions a,.settings-actions button,.file-button{font-size:13px}dialog{background:var(--surface);color:var(--text);border:1px solid var(--accent);border-radius:18px;width:min(480px,92vw);padding:26px;max-height:90dvh}dialog::backdrop{background:#000b;backdrop-filter:blur(4px)}dialog h2{font-size:23px}dialog p{font-size:14px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}#toast{position:fixed;bottom:max(24px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);background:var(--text);color:var(--bg);border-radius:12px;box-shadow:0 6px 30px #0005;padding:14px 22px;z-index:20;font-size:14px;max-width:92vw}.intro{position:fixed;inset:0;z-index:100;background:#060707;display:flex;align-items:center;justify-content:center;overflow:hidden}.intro video{pointer-events:none}#intro-background{position:absolute;width:115%;height:115%;object-fit:cover;filter:blur(28px) brightness(.5)}#intro-film{width:100%;height:auto;max-height:100%;position:relative;mask-image:linear-gradient(transparent,#000 16%,#000 84%,transparent)}.intro-actions{position:absolute;right:max(20px,env(safe-area-inset-right));bottom:max(24px,env(safe-area-inset-bottom));display:flex;gap:12px}.intro-actions button{background:#111c;border-color:#777;color:#fff;font-size:13px}.intro-playing{overflow:hidden}.landing{max-width:700px;text-align:center;padding-top:38px}.landing h1{font-size:clamp(35px,7vw,60px);letter-spacing:-1px;margin-bottom:10px}.landing h2{font-size:22px}.landing .brand{width:280px}.landing .open-app{background:var(--accent);color:var(--bg);padding:16px 28px;border-radius:12px;text-decoration:none;font-weight:800;margin:20px 0}.landing ol{text-align:left;line-height:1.8;max-width:550px;margin:20px auto}.landing li{margin:12px 0}
@media(max-width:550px){main{padding:10px max(12px,env(safe-area-inset-right)) 15px max(12px,env(safe-area-inset-left))}.brand-header{padding:0 63px 15px}.brand{width:175px}.brand-header h1{font-size:10px;letter-spacing:2px}.settings-link{font-size:11px;top:12px}.session-frame{padding:23px 15px 21px;border-radius:20px}.studio h2{font-size:clamp(27px,7.7vw,40px);letter-spacing:-.6px;margin-bottom:12px}.subtitle{font-size:10px;margin-bottom:15px}.status{font-size:13px;padding:8px 21px;min-width:160px}.time-panel{padding:37px 0 21px}.time-panel h3,.cost-panel h3{font-size:17px}#timer{font-size:clamp(42px,13.8vw,72px);letter-spacing:-2px}.cost-panel{padding:20px 10px;border-radius:19px}.total{font-size:clamp(38px,11.8vw,61px)}#rate-caption{font-size:14px}.minimum-caption{font-size:11px}.session-controls{margin-top:34px;gap:11px}.session-controls button{min-height:61px;padding:15px 8px;font-size:20px;border-radius:12px}footer{font-size:8px;letter-spacing:.2px}.field-grid{gap:13px}.settings-header button{font-size:11px;padding:10px}.settings-header h2{font-size:26px}.settings-actions{gap:12px}.settings-actions a{font-size:12px}}
@media(max-height:750px) and (max-width:550px){.brand{width:140px}.brand-header{padding-bottom:10px}.session-frame{padding-top:17px}.studio h2{font-size:26px}.time-panel{padding-top:22px}.cost-panel{padding-top:15px;padding-bottom:15px}.session-controls{margin-top:24px}.session-controls button{min-height:54px;padding:12px}.subtitle{margin-bottom:12px}}
@media(orientation:landscape) and (max-height:850px) and (min-width:700px){main{max-width:1050px;padding-top:8px}.brand-header{padding-bottom:9px}.brand{width:135px}.brand-header h1{font-size:10px}.session-frame{padding:18px 50px}.studio h2{font-size:32px;margin-bottom:7px}.subtitle{font-size:11px;margin-bottom:9px}.status{font-size:12px;padding:5px 21px}.time-panel{padding:18px 0 14px}.time-panel h3,.cost-panel h3{font-size:17px;margin-bottom:6px}#timer{font-size:72px}.cost-panel{padding:13px 25px;max-width:600px}.total{font-size:46px}#rate-caption{font-size:14px;margin-top:7px}.minimum-caption{font-size:10px;margin-top:4px}.session-controls{margin-top:18px;gap:10px;max-width:700px;margin-left:auto;margin-right:auto}.session-controls button{min-height:49px;font-size:19px;padding:8px}footer{margin-top:8px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

.update-notice{font-size:11px;color:var(--muted);margin:10px 0 0}html[data-theme="pearl"]{--hex:#293c4f06}
/* Subtle, genuine hexagonal cells confined to the edges of the session frame. */
.session-frame{position:relative;isolation:isolate;overflow:hidden;background:var(--surface)}
.session-frame:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.045;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='104' viewBox='0 0 96 104'%3E%3Cpolygon points='48,2 91,27 91,77 48,102 5,77 5,27' fill='none' stroke='%23fff' stroke-width='1'/%3E%3C/svg%3E");background-size:96px 104px;mask-image:linear-gradient(90deg,#000,transparent 30%,transparent 70%,#000)}
html[data-theme="pearl"] .session-frame:before{filter:invert(1);opacity:.035}
/* Client-facing STOP result. No pricing controls or secondary actions. */
.session-result{position:fixed;inset:0;margin:auto;width:min(82vw,780px);min-height:min(44dvh,460px);max-height:calc(100dvh - 32px);padding:32px 36px;text-align:center;border:1.5px solid var(--accent);border-radius:24px;background:var(--surface);box-shadow:0 20px 90px #0008;overflow:auto}
.session-result[open]{display:flex;flex-direction:column;align-items:center;justify-content:center;animation:result-enter 180ms ease-out}
.session-result::backdrop{background:rgba(2,4,6,.96);backdrop-filter:blur(5px)}
.session-result h2{font-size:clamp(18px,2.5vw,28px);font-weight:850;letter-spacing:.7px;color:var(--text);margin:0 0 20px}
.result-time{font-size:clamp(38px,7vw,80px);font-weight:900;line-height:1.08;font-variant-numeric:tabular-nums;letter-spacing:-1.5px;color:var(--bright);margin:0 0 23px;white-space:nowrap;text-shadow:0 0 18px var(--glow)}
.result-total-label{font-size:clamp(14px,1.8vw,19px);font-weight:750;letter-spacing:1px;margin:0 0 7px}
.result-amount{font-size:clamp(40px,7.7vw,88px);font-weight:900;line-height:1.13;font-variant-numeric:tabular-nums;letter-spacing:-1px;color:var(--bright);margin:0 0 27px;overflow-wrap:anywhere;max-width:100%;text-shadow:0 0 18px var(--glow)}
#result-currency{font-size:.75em}#result-reset{width:min(320px,100%);min-height:54px;border:1.5px solid var(--accent);color:var(--text);font-size:19px;background:var(--surface)}
body:has(#session-result[open]){overflow:hidden}
@keyframes result-enter{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:550px){.session-result{width:calc(100vw - 28px);padding:27px 18px;border-radius:20px;min-height:350px}.result-time{font-size:clamp(35px,11.5vw,58px)}.result-amount{font-size:clamp(40px,13vw,62px)}.session-result h2{font-size:20px}#result-reset{font-size:17px}}

.currency-buttons{display:flex;justify-content:center;max-width:390px;margin:18px auto 0;border:1px solid var(--accent);border-radius:14px;overflow:hidden}.currency-buttons button{flex:1;border:0;border-radius:0;min-height:48px;background:transparent;color:inherit;font-weight:800}.currency-buttons button.selected{background:var(--accent);color:var(--bg)}.currency-buttons button:disabled{opacity:.4}.conversion-note{font-size:.76rem;line-height:1.5;margin:10px auto 0;max-width:480px;color:var(--muted)}.currency-settings{margin:24px 0;padding:22px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.currency-settings p{line-height:1.5;font-size:13px}.currency-options{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.currency-choice{display:flex!important;align-items:center;gap:8px;padding:10px;border:1px solid var(--line);border-radius:9px}.currency-choice input{width:20px!important;min-height:20px;height:20px;accent-color:var(--accent)}.fx-rate-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px}.fx-rate-fields label{display:grid;gap:7px}.currency-settings button{margin:12px 8px 0 0;min-height:44px}.fx-rate-fields .muted{font-size:.75rem}@media(max-width:480px){.currency-options{grid-template-columns:repeat(3,1fr)}.currency-choice{padding:8px}.conversion-note{font-size:.68rem}}

.currency-options{max-height:250px;overflow:auto;padding:5px}.fx-rate-fields{display:block}

/* Transparent official lockup, sized for a legible slogan instead of a small label. */
.brand-header{padding:10px 72px 22px;background:transparent}.brand{width:520px;max-width:100%;height:auto;background:transparent}.brand-header h1{font-size:14px;letter-spacing:4px;margin-top:8px}.landing .brand{width:520px}
@media(max-width:550px){.brand-header{padding:36px 0 20px}.brand-header .settings-link{top:0;right:0}.brand-header .brand{width:380px;max-width:100%}.brand-header h1{font-size:12px;letter-spacing:3px}}
@media(orientation:landscape) and (max-height:850px) and (min-width:700px){.brand-header{padding:0 72px 12px}.brand-header .brand{width:360px}.brand-header h1{font-size:12px}}

/* Longer translated labels remain readable on narrow touch screens. */
html:lang(de) .session-controls button,html:lang(fr) .session-controls button{font-size:clamp(14px,3.6vw,24px);overflow-wrap:anywhere}
.settings-header button{flex-shrink:0;max-width:52%;white-space:normal}.settings-link{max-width:110px;overflow-wrap:anywhere}
