@font-face{font-family:Kai;src:url('/assets/font.woff2') format('woff2');font-display:swap}*{box-sizing:border-box}html{background:#111813;color:#eee6ce;font-family:Kai,serif}body{margin:0}button,input,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled{cursor:default;opacity:.4}button:focus-visible,a:focus-visible{outline:2px solid #e7d5a3;outline-offset:5px}button{color:inherit}a{color:inherit;text-decoration:none}#cinema{height:100svh;min-height:620px;max-width:560px;margin:auto;position:relative;isolation:isolate;overflow:hidden;background:#1b201b}.scene,.shade{position:absolute;inset:0;z-index:-2}.scene{background:url('/assets/arrival.webp') center/cover;transition:background-image 1s}.scene.room{background-image:url('/assets/welcome.webp')}.scene video{width:100%;height:100%;object-fit:cover}.shade{z-index:-1;background:linear-gradient(180deg,rgba(7,17,11,.43),transparent 25%,rgba(10,15,10,.05) 48%,rgba(8,14,10,.86));pointer-events:none}header{position:absolute;top:max(22px,env(safe-area-inset-top));left:24px;right:24px;display:flex;justify-content:space-between;align-items:start;z-index:8}.brand{display:flex;align-items:center;gap:11px;text-shadow:0 2px 15px #000}.brand>span:last-child{font-size:22px;letter-spacing:.18em}.brand small{display:block;font:8px/2.4 system-ui;letter-spacing:.38em}.seal{writing-mode:vertical-rl;border:1px solid #c1ae7e;color:#e0cc9c;padding:5px;font-size:14px;line-height:1.1;opacity:.9}nav{display:flex;gap:8px}.icon-button{display:grid;place-items:center;width:38px;height:38px;border:1px solid #bbaa7d66;border-radius:50%;background:#1c231e88;backdrop-filter:blur(12px)}svg{width:19px;height:19px;stroke-width:1.5}.hero{position:absolute;inset:38% 30px 80px;display:flex;flex-direction:column;align-items:center;text-align:center}.eyebrow{font-size:11px;letter-spacing:.32em;color:#ddc697}.hero h1{font-size:clamp(42px,12vw,65px);font-weight:400;letter-spacing:.18em;line-height:1.45;margin:18px -10px 10px}.hero .poem{font-size:18px;line-height:1.9;letter-spacing:.15em;text-shadow:0 2px 12px #000}.hero .primary{margin-top:auto}.primary{min-height:55px;width:100%;border:1px solid #c9b78399;background:linear-gradient(100deg,#22312a9c,#60644344,#22312a9c);backdrop-filter:blur(14px);display:flex;align-items:center;justify-content:center;gap:18px;padding:12px 20px;letter-spacing:.22em;color:#f2e7c7;box-shadow:inset 0 0 22px #ecd3a608;transition:background .2s,opacity .4s}.primary:hover{background:#69765a55}.primary svg{margin-left:auto}.primary span{margin:auto}.small-link{background:none;border:0;border-bottom:1px solid #cbbd8c55;letter-spacing:.12em;font-size:12px;line-height:2;color:#cfc7b2}.hero .small-link{margin-top:12px}.fine{font-size:11px;line-height:1.9;color:#b7b7a0;letter-spacing:.04em}.caption{position:absolute;bottom:17%;left:22px;right:22px;text-align:center;pointer-events:none;z-index:15;font-size:clamp(20px,5.5vw,27px);line-height:1.8;color:#fff8e4;text-shadow:0 2px 4px #000,0 0 18px #000,0 0 40px #000;opacity:0;transition:opacity .7s}.caption.visible{opacity:1}.film-actions{position:absolute;bottom:70px;right:25px}.chapter-film{position:absolute;inset:0;pointer-events:none}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}#cinema:has(.chapter-film) .scene{background:#111813}#cinema:has(.chapter-film) .shade,#cinema:has(.chapter-film) .brand,#cinema:has(.chapter-film) footer{opacity:0;pointer-events:none}#cinema:has(.chapter-film) #load-status{color:#d7d0ac}@keyframes ink{from{opacity:0;filter:blur(8px);transform:translateY(8px)}to{opacity:1;filter:blur(0);transform:translateY(0)}}.panel{position:absolute;left:22px;right:22px;bottom:78px;padding:24px 25px;color:#343c2d;background:linear-gradient(110deg,#f4ecd6f5,#dfd4b9f0);box-shadow:0 18px 45px #0004,inset 0 0 50px #a8925f20;border:1px solid #bbaa7c;max-height:72%;overflow:auto;scrollbar-width:thin}.panel:before{content:'';position:absolute;inset:9px;border:1px solid #8f825c30;pointer-events:none}.panel h2{font-weight:400;font-size:26px;line-height:1.6;margin:10px 0 22px}.panel .eyebrow{color:#7b7755;font-size:10px}.panel label{display:block;font-size:13px;margin:15px 0 8px;color:#626748;letter-spacing:.1em}.panel input,.panel select{width:100%;min-width:0;border:0;border-bottom:1px solid #7e835d88;background:transparent;color:#2b3729;padding:11px 2px;font-size:19px;border-radius:0;outline-offset:3px}.panel input[type=date],.panel input[type=time]{appearance:none;-webkit-appearance:none;max-width:100%;min-height:46px;font-size:18px}.panel input[type=checkbox]{width:17px;height:17px;margin:0;accent-color:#55634b}.panel .checkline{display:flex;align-items:center;gap:9px;font-size:12px;letter-spacing:0}.panel select{font-size:17px}.panel .row{display:grid;grid-template-columns:1fr 1fr;gap:14px}.panel .primary{background:#344b3b;color:#f2ead3;border:1px solid #344b3b;margin-top:22px;backdrop-filter:none}.panel .small-link{color:#596549;border-color:#777c57}.panel .fine{color:#747354}.panel .error{color:#9a3a25;font-size:13px;line-height:1.6;min-height:20px}.name-input{font-size:32px!important;letter-spacing:.18em}.micro{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-top:15px}.name-card{position:absolute;inset:35% 35px 17%;background:#eee3c8ed;border:1px solid #bdad85;box-shadow:0 10px 50px #0005;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#273225}.name-calligraphy{writing-mode:vertical-rl;font-size:48px;letter-spacing:.13em;animation:ink 2s ease both}.name-card .fine{color:#687057}.stamp{border:2px solid #9d4d35;color:#9d4d35;padding:4px 7px;line-height:1.2;font-size:13px;writing-mode:vertical-rl;transform:rotate(-6deg)}.result-panel{top:21%;bottom:75px;max-height:none}.result-panel h2{margin:12px 0 6px}.name-inline{font-size:36px;letter-spacing:.12em}.tabs{display:flex;gap:18px;border-bottom:1px solid #79876544;margin:15px 0}.tabs button{background:none;border:0;color:#74805e;padding:10px 0;letter-spacing:.15em}.tabs button[aria-selected=true]{color:#293e2d;border-bottom:2px solid #66734f}.char-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.char-item{text-align:center;padding:16px 3px;border:1px solid #8b906744}.char-item strong{display:block;font-size:35px;font-weight:400}.char-item small{font-size:11px;line-height:1.7;color:#697350}.reading-text{line-height:1.9;font-size:15px}.pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:24px 0}.pillar{text-align:center;border:1px solid #8b906755;padding:14px 4px}.pillar small{display:block;font-size:11px;color:#7a7d56;letter-spacing:.2em}.pillar strong{display:block;writing-mode:vertical-rl;margin:12px auto;font-size:32px;letter-spacing:.18em;font-weight:400}.pillar em{font-style:normal;font-size:11px;writing-mode:vertical-rl;letter-spacing:.2em}.note{padding:14px 0;border-block:1px solid #8b906733;font-size:12px;line-height:1.8;color:#6f7458}.readiness{display:flex;gap:8px;align-items:center;color:#70775c;font-size:12px;margin:12px 0}.orbit{width:42px;height:42px;margin:30px auto;border:1px solid #ccbb8d66;border-radius:50%;border-top-color:#ead5a0;animation:rotate 2s linear infinite}.study-note{position:absolute;bottom:17%;left:25px;right:25px;text-align:center;line-height:2}@keyframes rotate{to{transform:rotate(360deg)}}footer{position:absolute;bottom:max(18px,env(safe-area-inset-bottom));left:24px;right:24px;display:flex;justify-content:space-between;align-items:center;color:#c9c7b1;font-size:10px;letter-spacing:.14em;z-index:10}footer button{border:0;background:none;padding:4px}#load-status{position:absolute;bottom:50px;left:25px;right:25px;text-align:center;font-size:11px;color:#d7d0ac;z-index:18}dialog{color:#ddd6bf;border:1px solid #b5a27766;background:#202c23;padding:30px;max-width:430px;width:90%;line-height:1.9}dialog::backdrop{background:#07110acc;backdrop-filter:blur(12px)}dialog h2{font-weight:400;font-size:24px}dialog p{font-size:14px}dialog #close-info{float:right;border:0;background:none}.resume{position:absolute;inset:0;background:#0c160ec9;backdrop-filter:blur(12px);display:grid;place-content:center;justify-items:center;gap:24px;z-index:30}.resume .icon-button{width:76px;height:76px}.resume svg{width:27px;height:27px}.resume p{letter-spacing:.2em;font-size:16px}.review-ribbon{font-size:10px;letter-spacing:.12em;color:#c8bea4;margin-bottom:14px}.loader{height:1px;background:#c7bb8b44;width:100%;margin-top:12px}.loader span{display:block;height:1px;background:#e6d7a5}.secondary-action{margin:15px auto;display:block}.purposes{display:grid;gap:8px}.purposes button{padding:15px;text-align:left;border:1px solid #89906a55;background:transparent;color:#3b4c36}.purposes button small{display:block;font-size:11px;margin-top:6px;color:#8a896b}.purposes button[disabled]{opacity:.55}@media(min-width:900px){body{display:grid;place-items:center;min-height:100dvh;background:radial-gradient(ellipse at 50% 40%,#27382b,#101710 70%)}#cinema{width:min(100vw,56.25svh);min-width:390px;box-shadow:0 0 100px #0008}.hero h1{font-size:52px}}@media(max-height:720px){.hero{top:28%;bottom:70px}.panel{bottom:62px;padding:18px 21px;max-height:72%}.panel h2{font-size:23px;margin-bottom:12px}.caption{bottom:18%;font-size:20px}.panel label{margin-top:9px}.result-panel{top:17%}.hero .poem{font-size:15px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

#load-status progress{display:block;width:100%;height:2px;margin-top:12px;border:0;appearance:none;background:#c5b78033}#load-status progress::-webkit-progress-bar{background:#c5b78033}#load-status progress::-webkit-progress-value{background:#dfce99}#load-status progress::-moz-progress-bar{background:#dfce99}#cinema:has(.panel) .caption{top:14%;bottom:auto;font-size:19px;line-height:1.6;left:28px;right:28px}#cinema:has(.panel) .caption:before{content:"";position:absolute;inset:-12px -15px;z-index:-1;background:radial-gradient(ellipse,#10201799,transparent 72%);filter:blur(10px)}

.return-actions{position:absolute;left:28px;right:28px;bottom:80px;display:grid;justify-items:center;gap:16px}
/* Film-to-film dissolves keep the old decoded image beneath the new picture. */
.scene .film-layer{position:absolute;inset:0;opacity:0;transition:opacity .9s cubic-bezier(.4,0,.2,1);will-change:opacity}.scene .film-layer.is-visible{opacity:1}
