:root{--ink:#f4ecdc;--dim:#f4ecdc9e;--gold:#e7c070;--night:#070a1c}*{box-sizing:border-box}html,body{background:var(--night);height:100%;color:var(--ink);-webkit-font-smoothing:antialiased;-webkit-user-select:none;user-select:none;margin:0;font-family:Inter,system-ui,sans-serif;overflow:hidden}#scene{cursor:grab;touch-action:none;width:100%;height:100%;display:block;position:fixed;inset:0}#scene:active{cursor:grabbing}.ml{font-family:Noto Serif Malayalam,serif}.hidden{opacity:0;pointer-events:none}.screen{z-index:10;place-items:center;transition:opacity 1.6s;display:grid;position:fixed;inset:0}#loading{background:radial-gradient(at 50% 70%,#1a1d45 0%,#070a1c 70%)}.load-inner{text-align:center}.big{color:var(--gold);letter-spacing:.02em;font-size:44px}.load-text{color:var(--dim);letter-spacing:.08em;margin-top:14px;font-size:14px}.load-bar{background:#ffffff1f;width:220px;height:2px;margin:18px auto 0;overflow:hidden}#load-fill{background:var(--gold);width:0%;height:100%;transition:width .3s}#title,#ending{background:radial-gradient(at 50% 60%,#070a1c40 0%,#070a1cc7 75%)}.title-inner{text-align:center;max-width:640px;padding:24px}.huge{color:var(--gold);text-shadow:0 0 40px #e7c07059;font-size:clamp(56px,9vw,96px);line-height:1.15}.en-title{letter-spacing:.18em;text-transform:uppercase;margin-top:4px;font-family:Cormorant Garamond,serif;font-size:clamp(26px,3.4vw,36px);font-weight:500}.rule{background:var(--gold);opacity:.7;width:64px;height:1px;margin:22px auto}.sub{letter-spacing:.14em;text-transform:uppercase;color:var(--ink);font-size:15px}.blurb{color:var(--dim);margin:22px 0 30px;font-family:Cormorant Garamond,serif;font-size:21px;font-style:italic;line-height:1.5}button{cursor:pointer;font-family:Inter,sans-serif}#begin,#again{color:var(--ink);letter-spacing:.2em;text-transform:uppercase;background:0 0;border:1px solid #e7c070b3;padding:14px 34px;font-size:14px;transition:background .3s,color .3s}#begin:hover,#again:hover{background:var(--gold);color:var(--night)}.end-buttons{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}#share{background:var(--gold);color:var(--night);border:1px solid var(--gold);letter-spacing:.2em;text-transform:uppercase;padding:14px 34px;font-size:14px;font-weight:600;transition:filter .3s}#share:hover{filter:brightness(1.1)}#share-note:empty,body.film #hud>:not(#card),body.film #credit,body.film-clean #card{display:none}body.film #scene,body.film #scene:active{cursor:none}#begin:disabled{opacity:.4;cursor:wait}.hint{color:var(--dim);letter-spacing:.08em;margin-top:18px;font-size:12px}#hud{pointer-events:none;z-index:5;transition:opacity 1.2s;position:fixed;inset:0}#card{opacity:0;flex-direction:column;align-items:flex-start;gap:8px;transition:opacity .6s steps(4,end);display:flex;position:absolute;top:9vh;left:6vw}#card.show{opacity:1}.cap{color:#1a1424;border:3px solid #14101c;transition:transform .45s cubic-bezier(.2,1.8,.4,1);position:relative;transform:rotate(-1.6deg)scale(.6);box-shadow:7px 7px #0a0814e0}#card.show .cap{transform:rotate(-1.6deg)scale(1)}#card.show .cap-en{transition-delay:.12s;transform:rotate(1.2deg)translate(28px)scale(1)}.cap:after{content:"";pointer-events:none;background:radial-gradient(circle,#14101c29 1.3px,#0000 1.6px) 0 0/7px 7px;position:absolute;inset:0}.cap-ml{background:#f6e7a8;padding:6px 18px 4px}.cap-ml .ml{text-shadow:2px 0 #00aad28c,-2px 0 #eb28788c;font-size:clamp(28px,4vw,48px);font-weight:600}.cap-en{background:#fdfaf1;align-items:baseline;gap:14px;padding:6px 14px;display:flex;transform:rotate(1.2deg)translate(28px)scale(.6)}.cap-en .en{letter-spacing:.14em;text-transform:uppercase;font-family:Inter,sans-serif;font-size:clamp(12px,1.3vw,16px);font-weight:700}.card-time{letter-spacing:.16em;color:#c2185b;font-size:12px;font-weight:600}#clock-box{text-shadow:0 2px 12px #000c;position:absolute;bottom:30px;left:28px}#clock{color:var(--ink);font-family:Cormorant Garamond,serif;font-size:40px;font-weight:600;line-height:1}#clock:after{content:" AM";letter-spacing:.1em;color:var(--dim);font-size:16px}#place{letter-spacing:.22em;text-transform:uppercase;color:var(--gold);margin-top:6px;font-size:12px}#progress{background:#ffffff1f;height:2px;position:absolute;bottom:12px;left:28px;right:28px}#progress-fill{background:linear-gradient(90deg, #e7c07066, var(--gold));width:0;height:100%}#progress-dots span{border:1px solid var(--gold);background:#070a1ce6;border-radius:50%;width:8px;height:8px;margin-left:-4px;position:absolute;top:-3px}#progress-dots span.passed{background:var(--gold)}#controls{pointer-events:auto;align-items:center;gap:6px;display:flex;position:absolute;bottom:28px;right:24px}#controls button{color:var(--dim);letter-spacing:.12em;text-transform:uppercase;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#070a1c73;border:1px solid #f4ecdc2e;padding:7px 12px;font-size:11px}#controls button.active,#controls button:hover{color:var(--ink);border-color:#e7c070b3}.sep{width:10px}#keys{letter-spacing:.1em;color:var(--dim);white-space:nowrap;font-size:11px;transition:opacity 2s;position:absolute;top:18px;left:50%;transform:translate(-50%)}#credit{color:#f4ecdc66;z-index:20;font-size:10px;position:fixed;top:8px;right:10px}#credit a{color:inherit}.turn{display:none}:root{--st:env(safe-area-inset-top,0px);--sr:env(safe-area-inset-right,0px);--sb:env(safe-area-inset-bottom,0px);--sl:env(safe-area-inset-left,0px)}html,body{overscroll-behavior:none;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%}button{touch-action:manipulation}#clock-box{left:calc(28px + var(--sl));bottom:calc(30px + var(--sb))}#progress{left:calc(28px + var(--sl));right:calc(28px + var(--sr));bottom:calc(12px + var(--sb))}#controls{right:calc(24px + var(--sr));bottom:calc(28px + var(--sb))}#credit{top:calc(8px + var(--st));right:calc(10px + var(--sr))}#card{top:calc(9vh + var(--st));left:calc(6vw + var(--sl))}@media (pointer:coarse){#controls button{min-height:40px;padding:10px 14px;font-size:11px}#begin,#again,#share{padding:16px 30px}}@media (width<=720px){#clock-box{left:calc(16px + var(--sl))}#clock{font-size:34px}#progress{left:calc(16px + var(--sl));right:calc(16px + var(--sr))}#controls{right:calc(12px + var(--sr));gap:6px}#keys{display:none}#card{top:calc(7vh + var(--st));left:calc(14px + var(--sl));right:calc(14px + var(--sr))}.cap-ml{padding:5px 12px 3px}.cap-ml .ml{font-size:clamp(22px,7vw,30px)}.cap-en{flex-wrap:wrap;row-gap:2px;max-width:calc(100vw - 56px)}#card.show .cap-en{transform:rotate(1.2deg)translate(12px)scale(1)}.cap{box-shadow:5px 5px #0a0814e0}.title-inner{padding:calc(20px + var(--st)) 22px calc(20px + var(--sb))}.blurb{margin:18px 0 26px;font-size:18px}.sub{font-size:13px}}@media (width<=720px) and (orientation:portrait) and (pointer:coarse){.turn{opacity:.8;margin-top:10px;display:block}}@media (height<=500px){.huge{font-size:44px}.en-title{font-size:22px}.rule{margin:12px auto}.blurb{margin:10px 0 16px;font-size:16px}.hint{margin-top:10px}#card{top:calc(14px + var(--st))}.cap-ml .ml{font-size:26px}#clock{font-size:30px}#clock-box{bottom:calc(24px + var(--sb))}#controls{bottom:calc(20px + var(--sb))}#keys{display:none}}
