@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700&family=DM+Mono:wght@300;400;500&display=swap');
:root{color-scheme:dark;--bg:#000000;--white:#ffffff;--blue:#00aeef;--muted:#9ba4af}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--white);font-family:Arial,sans-serif}button,a,input,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit;background:none;border:0;font:inherit}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--blue);outline-offset:5px}header{height:84px;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;gap:15px}.wordmark{text-decoration:none;font:600 18px 'Barlow Condensed',sans-serif;letter-spacing:.12em;display:flex;align-items:center;gap:10px}.mark{color:var(--blue);font:32px Arial}nav{display:flex;gap:24px;align-items:center}nav button{font:14px 'Barlow Condensed',sans-serif;letter-spacing:.12em;color:#b5bdc8}#language{border:1px solid #37414b;padding:7px 9px;border-radius:3px}main{position:relative;text-align:center;min-height:650px;height:calc(100svh - 132px);display:flex;align-items:center;flex-direction:column;isolation:isolate}h1{font:500 clamp(18px,2.4vw,28px) 'Barlow Condensed',sans-serif;letter-spacing:.25em;margin:12px 10px 0;z-index:1}.portrait{position:absolute;top:20px;bottom:125px;width:min(560px,90vw);z-index:-1;mask-image:linear-gradient(to bottom,transparent,black 12%,black 48%,transparent 96%)}.portrait img{width:100%;height:100%;object-fit:cover;object-position:center 24%;filter:grayscale(1) brightness(.76);mask-image:linear-gradient(to right,transparent,black 18%,black 82%,transparent)}.counter{margin-top:auto;position:relative;width:100%}.day{font:500 clamp(36px,5vw,66px)/1 'Barlow Condensed',sans-serif;letter-spacing:.035em}#day-label{font-size:.36em;letter-spacing:.16em;color:var(--blue);vertical-align:middle;margin-right:8px}#clock{display:block;font:500 clamp(48px,10vw,116px)/1.2 'DM Mono',monospace;letter-spacing:-.055em;font-variant-numeric:tabular-nums;white-space:nowrap}#clock span{color:#758292;padding:0 .08em}.since{font-size:14px;color:#bdc3cb;margin:10px 0}.zone{font:12px 'DM Mono',monospace;letter-spacing:.16em;color:#8b98a7;margin:14px 0 0}#ritual{position:absolute;bottom:100%;left:0;right:0;color:var(--blue);font:18px 'Barlow Condensed',sans-serif;letter-spacing:.2em;min-height:22px}.celebrate .day{animation:rise 1.8s ease}.moment-button{border:1px solid #4d5c6b;border-radius:30px;font-size:14px;padding:15px 26px;margin:27px 0 26px;background:#10161dc9}.moment-button:hover,.primary:hover{background:#263847}footer{padding:12px 5vw;display:flex;justify-content:space-between;gap:18px;color:#8995a4;font-size:12px;min-height:48px}footer button{font-size:12px}dialog{background:#10161d;color:var(--white);border:1px solid #3d4a58;border-radius:14px;width:min(560px,calc(100vw - 24px));max-height:90svh;padding:36px;overflow:auto}dialog::backdrop{background:#000b;backdrop-filter:blur(8px)}.close{position:absolute;right:12px;top:8px;font-size:30px;padding:6px 12px}.eyebrow{font-size:12px;letter-spacing:.15em;color:var(--blue)}h2{font:500 38px/1.1 'Barlow Condensed',sans-serif;margin:20px 0}dialog p{line-height:1.6;color:#b6c0cb}label{display:block;margin:20px 0 8px;font-size:14px}input,textarea{display:block;width:100%;border:1px solid #455364;border-radius:6px;background:#080e15;color:white;padding:13px;font:16px Arial}textarea{resize:vertical}.primary{background:#21394b;border:1px solid #618399;padding:13px 20px;border-radius:6px;font-size:14px}form>.primary{margin:20px 0;width:100%}canvas{display:block;width:100%;height:auto;border-radius:8px}.actions{display:flex;gap:24px;align-items:center;margin-top:20px}.small{font-size:13px}hr{border:0;border-top:1px solid #334150;margin:25px 0}@keyframes rise{0%{opacity:.4;transform:translateY(8px)}100%{opacity:1;transform:none}}@media(max-width:600px){header{height:72px;padding:0 18px}.wordmark{font-size:15px;letter-spacing:.08em}nav{gap:13px}nav button{font-size:12px}.mark{font-size:25px}main{height:calc(100svh - 135px);min-height:555px}h1{font-size:18px;letter-spacing:.19em}.portrait{top:28px;bottom:155px;width:100%}.day{font-size:48px}#clock{font-size:clamp(42px,11.8vw,70px)}footer{padding:12px 18px;line-height:1.4}.moment-button{margin:24px 0 18px}dialog{padding:28px 22px}}@media(prefers-reduced-motion:reduce){*{animation:none!important}}
#source-video,#export-preview{width:100%;max-height:380px;margin:16px 0;border-radius:8px;background:#000}#remove-media{font-size:14px;text-decoration:underline;color:var(--blue)}#render-video{margin-top:18px;width:100%}button:disabled,input:disabled,textarea:disabled{opacity:.5;cursor:wait}[hidden]{display:none!important}
.header-logo{width:54px;height:54px;object-fit:contain;flex-shrink:0;border-radius:5px}#language{width:auto;background:#10161d;color:#fff;font:14px Arial;cursor:pointer}#clock{direction:ltr;unicode-bidi:isolate}.wordmark{direction:ltr}html[dir=rtl] h1,html[dir=rtl] h2,html[dir=rtl] .eyebrow,html[dir=rtl] nav button,html[dir=rtl] #ritual{font-family:Arial,sans-serif;letter-spacing:0}html[dir=rtl] .close{right:auto;left:12px}html[dir=rtl] #day-label{margin-right:0;margin-left:8px}html[dir=rtl] .zone{letter-spacing:0}html[dir=rtl] dialog{text-align:right}html[dir=rtl] .actions{justify-content:flex-start}html[dir=rtl] h2{font-size:30px}select:focus-visible{outline:2px solid var(--blue);outline-offset:3px}@media(max-width:600px){.header-logo{width:42px;height:42px}.wordmark{font-size:13px;gap:5px}nav{gap:9px}#language{padding:7px 3px;font-size:12px}}@media(max-width:360px){.wordmark{font-size:11px}.header-logo{width:34px;height:34px}header{padding:0 10px}nav{gap:6px}}

footer{flex-wrap:wrap;justify-content:center;text-align:center}.social-links{flex-basis:100%;justify-content:center;flex-wrap:wrap;gap:18px;margin-bottom:6px}.social-links a{font-size:14px;text-decoration:none}.social-links a:hover{color:var(--blue)}.day{font-weight:700}.celebrate .day{animation:blue-pulse 1.8s ease}@keyframes blue-pulse{0%,100%{color:white;text-shadow:none}40%{color:var(--blue);text-shadow:0 0 28px #00aeef66}}@media(min-width:601px){main{height:calc(100svh - 168px)}}

#about .small{font-size:.625rem;line-height:1.5;color:var(--muted);margin:8px 0}

#export-state{margin:18px 0;padding:16px;border:1px solid #37414b;border-radius:8px}#export-progress{display:block;width:100%;height:10px;accent-color:var(--blue);margin:12px 0}#export-progress-label{margin:0;font-size:14px;line-height:1.5}#cancel-export{font-size:14px;text-decoration:underline;padding:10px 0}

#preview-controls{margin:8px 0 16px}#preview-toggle{font-size:14px;border:1px solid #4d5c6b;border-radius:6px;padding:10px 18px}#export-preview::-webkit-media-controls,#export-preview::-webkit-media-controls-start-playback-button{display:none!important;-webkit-appearance:none}