:root{--ink:#07060a;--ember:#ff7a2f;--gold:#ffd27a;--bone:#e9dfd0;--mist:#e9dfd0cc;--serif:"Cormorant Garamond", "Iowan Old Style", Georgia, serif;--display:"Cinzel", "Trajan Pro", Georgia, serif}*{box-sizing:border-box}html,body{background:var(--ink);height:100%;color:var(--bone);margin:0;overflow:hidden}#app,#app canvas{width:100%;height:100%;display:block;position:fixed;inset:0}#hud{pointer-events:none;font-family:var(--display);z-index:2;transition:opacity .6s;position:fixed;inset:0}#hud.hidden,.capture #hud{opacity:0}#hp{gap:8px;display:flex;position:absolute;top:28px;left:32px}#hp i{background:#beaaffd9;border:1px solid #c8b9ffb3;width:12px;height:12px;transition:all .25s;transform:rotate(45deg);box-shadow:0 0 10px #aa96ffb3}#hp i.gone{box-shadow:none;background:0 0;border-color:#c8b9ff40}#clock{text-align:center;position:absolute;top:20px;left:50%;transform:translate(-50%)}#clock-roman{letter-spacing:.18em;color:var(--bone);text-shadow:0 0 18px #ffaa5a59;font-size:30px}#clock-bar{background:#e9dfd02e;width:180px;height:2px;margin:6px auto 4px}#clock-bar i{transform-origin:0;background:linear-gradient(90deg, var(--ember), var(--gold));width:100%;height:100%;box-shadow:0 0 8px var(--ember);display:block;transform:scaleX(0)}#clock-label{font-family:var(--serif);color:var(--mist);letter-spacing:.08em;font-size:15px;font-style:italic}#hearth{text-align:center;position:absolute;bottom:30px;left:50%;transform:translate(-50%)}#hearth-label{letter-spacing:.4em;text-transform:uppercase;color:var(--mist);text-shadow:0 0 8px #000,0 1px 2px #000;margin-bottom:8px;font-size:12px}#hearth-bar{background:#ff7a2f1f;border-radius:2px;width:320px;height:4px;overflow:hidden}#hearth-bar i{background:linear-gradient(90deg, #a6340f, var(--ember), var(--gold));width:100%;height:100%;box-shadow:0 0 12px var(--ember);transform-origin:0;transition:transform .2s;display:block}#hearth.low #hearth-bar i{animation:.6s infinite alternate pulse}@keyframes pulse{0%{opacity:1}to{opacity:.35}}#fps{color:#9f9;font:12px ui-monospace,monospace;position:absolute;bottom:10px;right:12px}#flash{pointer-events:none;opacity:0;mix-blend-mode:screen;position:fixed;inset:0}#title{justify-content:flex-start!important;padding-top:9vh!important}#card,#title{text-align:center;pointer-events:none;flex-direction:column;justify-content:center;align-items:center;padding:0 16px;transition:opacity 1.1s;display:flex;position:fixed;inset:0}#card.hidden,#title.hidden{opacity:0}#card.dim{background:#060409cc}#card{background:radial-gradient(#07060ac7,#07060a59 55%,#07060a00 85%)}#card-roman{font-family:var(--display);letter-spacing:.2em;color:var(--bone);text-shadow:0 0 40px #ff8c3c73;font-size:clamp(56px,9vw,120px);line-height:1}#card-title{font-family:var(--display);letter-spacing:.45em;text-transform:uppercase;color:var(--gold);margin-top:18px;font-size:clamp(16px,2vw,24px)}#card-line{font-family:var(--serif);max-width:760px;color:var(--bone);opacity:.9;margin-top:22px;font-size:clamp(18px,2.2vw,28px);font-style:italic}#card-hint{font-family:var(--display);letter-spacing:.4em;text-transform:uppercase;color:var(--mist);margin-top:40px;font-size:12px}#title h1{font-family:var(--display);letter-spacing:.16em;color:var(--bone);text-shadow:0 0 50px #ff82328c;margin:0;font-size:clamp(44px,8vw,112px);font-weight:400}#title .sub{font-family:var(--serif);color:var(--bone);opacity:.85;margin:14px 0 0;font-size:clamp(18px,2.2vw,26px);font-style:italic}#title .hint{font-family:var(--display);letter-spacing:.5em;text-transform:uppercase;color:var(--gold);margin-top:18px;font-size:13px;animation:2.4s ease-in-out infinite breathe;position:absolute;bottom:72px}#title .controls{font-family:var(--serif);color:var(--mist);letter-spacing:.04em;font-size:15px;position:absolute;bottom:34px}@keyframes breathe{0%,to{opacity:.35}50%{opacity:1}}#choice{font-family:var(--display);letter-spacing:.35em;text-transform:uppercase;color:var(--bone);pointer-events:none;text-shadow:0 0 18px #000000e6;justify-content:space-between;padding:0 9vw;font-size:14px;transition:opacity 1.5s;display:flex;position:fixed;bottom:64px;left:0;right:0}#choice span:last-child{color:#fff2d6;text-shadow:0 0 22px #ffc88ce6}#choice.hidden{opacity:0}#card-roman:empty,#card-title:empty,#card-hint:empty,#card-eyebrow:empty,#card-stats:empty,#card-levels:empty{display:none}#card-eyebrow{font-family:var(--display);letter-spacing:.55em;text-transform:uppercase;color:var(--mist);margin-bottom:14px;font-size:clamp(11px,1.1vw,14px)}#card-eyebrow b{color:var(--gold);font-weight:600}#card-stats{flex-wrap:wrap;justify-content:center;gap:14px 46px;max-width:90vw;margin-top:34px;display:flex}#card-stats div{flex-direction:column;align-items:center;animation:.5s both stat-in;display:flex}#card-stats div:nth-child(2){animation-delay:.12s}#card-stats div:nth-child(3){animation-delay:.24s}#card-stats div:nth-child(4){animation-delay:.36s}#card-stats div:nth-child(5){animation-delay:.48s}#card-stats div{text-shadow:0 0 14px #000,0 0 4px #000}#card-stats b{font-family:var(--display);color:var(--bone);font-size:clamp(24px,2.6vw,36px);font-weight:500}#card-stats span{font-family:var(--display);letter-spacing:.4em;text-transform:uppercase;color:var(--mist);margin-top:4px;font-size:11px}.grade{font-size:1.35em;font-style:normal;line-height:.9}.grade.gS{color:#ffd98a;text-shadow:0 0 18px #ffbe5af2}.grade.gA{color:#d9ccff;text-shadow:0 0 14px #a082ffe6}.grade.gB{color:#bfe0c8}.grade.gC{color:#c9b6a8}@keyframes stat-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}#card-levels{align-items:center;gap:18px;margin-top:30px;display:flex}#card-levels i{border:1px solid #dccdff80;width:10px;height:10px;transform:rotate(45deg)}#card-levels i.done{background:#a28cff;border-color:#d9d0ff;box-shadow:0 0 10px #a08cffe6}#card-levels i.now{border-color:#ffd9a8;width:14px;height:14px;animation:.8s infinite alternate low-pulse;box-shadow:0 0 14px #ffbe78e6}#letterbox i{z-index:4;pointer-events:none;background:#000;height:11vh;transition:transform .9s cubic-bezier(.2,.8,.2,1);position:fixed;left:0;right:0}#letterbox i:first-child{top:0;transform:translateY(-100%)}#letterbox i:last-child{bottom:0;transform:translateY(100%)}#letterbox.on i{transform:none}#memline{z-index:5;text-align:center;opacity:0;pointer-events:none;transition:opacity 1.2s;position:fixed;bottom:3.2vh;left:0;right:0}#memline.on{opacity:1}#mem-eyebrow{font-family:var(--display);letter-spacing:.55em;text-transform:uppercase;color:#c9a777;margin-bottom:8px;font-size:11px}#mem-text{font-family:var(--serif);color:#f4e6d0;text-shadow:0 0 18px #000;font-size:clamp(17px,2vw,26px);font-style:italic}#hp{gap:7px;margin-left:6px;display:flex;position:static}#vit-row{align-items:center;gap:12px;margin-top:10px;display:flex}#vit-bar{background:#06040ad9;border:1px solid #dcd2ff66;width:min(300px,34vw);height:12px;position:relative;box-shadow:0 0 14px #000000d9,inset 0 0 6px #000000e6}#hp-num{min-width:3ch}#vitals{position:absolute;top:24px;left:30px}#vit-head{font-family:var(--display);align-items:center;gap:10px;display:flex}#vit-crest{border:1px solid #c8b9ffcc;width:14px;height:14px;transform:rotate(45deg);box-shadow:0 0 12px #aa96ffcc,inset 0 0 6px #aa96ffe6}#vit-label{letter-spacing:.42em;text-transform:uppercase;color:var(--bone);font-size:12px}#hp-num{font-family:var(--display);color:var(--bone);text-shadow:0 0 10px #000000e6;font-size:17px}#hp i{clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);width:13px;height:13px;box-shadow:none;filter:drop-shadow(0 0 6px #a08cffe6);background:linear-gradient(160deg,#e4dcff,#8b74ff 55%,#4c2fb8);border:0;transition:opacity .3s,filter .3s;transform:none}#hp i.gone{filter:none;background:#a08cff24}#hp i.shatter{animation:.55s ease-out shatter}@keyframes shatter{0%{filter:drop-shadow(0 0 14px #ff6b4a)brightness(2);background:#ffd2c4;transform:scale(1.6)}40%{transform:scale(.8)rotate(25deg)translateY(4px)}to{transform:none}}#vitals.hurt{animation:.35s vit-shake}@keyframes vit-shake{25%{transform:translate(-5px)}50%{transform:translate(4px)}75%{transform:translate(-2px)}}#vitals.lastlife #hp i:not(.gone){animation:.7s infinite alternate low-pulse}#vitals.low #hp-num,#vitals.low #vit-label{color:#ff8a7a}@keyframes low-pulse{0%{opacity:1}to{opacity:.5}}#combo{opacity:0;font-family:var(--display);flex-direction:column;align-items:center;transition:opacity .4s;display:flex;position:absolute;top:40%;right:7vw}#combo.on{opacity:1}#combo-n{color:#e9e0ff;text-shadow:0 0 22px #9678ffe6;font-size:54px;line-height:1}#combo-label{letter-spacing:.5em;text-transform:uppercase;color:var(--mist);text-shadow:0 0 8px #000;margin-top:4px;font-size:12px}#combo.hot #combo-n{color:#ffd9a8;text-shadow:0 0 26px #ff8c3cf2}#combo.pulse #combo-n{animation:.25s ease-out combo-pulse}@keyframes combo-pulse{0%{transform:scale(1.45)}to{transform:scale(1)}}#bossbar{text-align:center;opacity:0;width:min(620px,80vw);transition:opacity .8s;position:absolute;bottom:92px;left:50%;transform:translate(-50%)}#bossbar.on{opacity:1}#boss-name{font-family:var(--display);letter-spacing:.4em;text-transform:uppercase;color:#ffcfb8;text-shadow:0 0 18px #ff502899;font-size:18px}#boss-sub{font-family:var(--serif);color:var(--mist);margin:2px 0 8px;font-size:14px;font-style:italic}#boss-track{background:#14080cd9;border:1px solid #ff8c6e59;height:8px;position:relative;box-shadow:0 0 16px #000c}#bossbar.struck #boss-track{box-shadow:0 0 22px #ffc8a0e6}#worldui{pointer-events:none;z-index:1;position:fixed;inset:0;overflow:hidden}.capture #worldui{display:none}.ebar{will-change:transform, opacity;background:#08040cd9;border:1px solid #be96ff59;width:84px;height:7px;position:absolute;top:0;left:0;box-shadow:0 0 8px #000000e6}.ebar.burning{border-color:#ff9646d9;box-shadow:0 0 9px #ff7828b3}.ebar.struck{border-color:#fff;box-shadow:0 0 12px #fffc}.hbar{overflow:hidden}.hbar .chip,.hbar .fill{transform-origin:0;width:100%;position:absolute;top:0;bottom:0;left:0}.hbar .chip{background:linear-gradient(#fffaf2,#e9dccd)}.hbar.blink .fill{background:#fff!important;box-shadow:0 0 12px #fff!important}.hbar.blink{border-color:#fff!important}.hbar.low .fill{animation:.55s infinite alternate hbar-low}@keyframes hbar-low{0%{opacity:1}to{opacity:.55}}.pop{font-family:var(--display);white-space:nowrap;will-change:transform, opacity;font-weight:600;animation:.95s cubic-bezier(.2,.9,.3,1) forwards pop-up;position:absolute;transform:translate(-50%,-50%)}.pop.light{color:#efe6ff;text-shadow:0 0 10px #966efff2,0 2px 2px #000;font-size:22px}.pop.heavy{color:#ffe2b0;text-shadow:0 0 14px #ffaa46f2,0 2px 3px #000;font-size:34px}.pop.fire{color:#ffd28a;text-shadow:0 0 16px #ff6a1a,0 0 30px #ff3d00,0 2px 3px #000;font-size:36px}.pop.hurt{color:#ff8a7a;text-shadow:0 0 12px #ff281ee6,0 2px 2px #000;font-size:26px}.pop.soul{font-family:var(--serif);color:#dfe6ff;letter-spacing:.05em;text-shadow:0 0 14px #96aaffe6;font-size:20px;font-style:italic;font-weight:400;animation:2.6s ease-out forwards soul-up}.pop.soul.big{color:#fff0dc;text-shadow:0 0 20px #ffbe78e6;font-size:28px}.pop.burn{font-family:var(--serif);color:#ffb27a;font-size:14px;font-style:italic;animation:1.6s ease-out forwards soul-up}@keyframes pop-up{0%{opacity:0;transform:translate(-50%,-50%)scale(.4)}15%{transform:translate(calc(-50% + var(--drift) * .2), -90%) scale(1.25);opacity:1}to{transform:translate(calc(-50% + var(--drift)), -260%) scale(.85);opacity:0}}@keyframes soul-up{0%{opacity:0;letter-spacing:.3em;transform:translate(-50%,-30%)}25%{opacity:1;letter-spacing:.06em}to{opacity:0;transform:translate(-50%,-320%)}}.pop i{letter-spacing:.35em;text-transform:uppercase;opacity:.95;margin-top:-2px;font-size:11px;font-style:normal;font-weight:400;display:block}.pop.light i{color:#c9b8ff}.pop.heavy i,.pop.fire i{color:#ffc27a;font-size:11px}.pop.skill{color:#d9f0ff;text-shadow:0 0 12px #78befff2,0 2px 2px #000;font-size:26px}.pop.skill i{color:#9fd6ff}.pop.callout{letter-spacing:.4em;text-transform:uppercase;color:#f3eaff;text-shadow:0 0 16px #966efff2,0 0 2px #000;font-size:16px;font-weight:400;animation:1.3s ease-out forwards callout}@keyframes callout{0%{opacity:0;letter-spacing:.9em;transform:translate(-50%,-50%)scale(1.6)}18%{opacity:1;letter-spacing:.4em;transform:translate(-50%,-60%)scale(1)}to{opacity:0;transform:translate(-50%,-160%)scale(1)}}#toast{font-family:var(--serif);color:var(--bone);letter-spacing:.04em;text-shadow:0 0 14px #000000e6,0 0 18px #ff965059;opacity:0;text-align:center;width:max-content;max-width:min(92vw,720px);font-size:18px;font-style:italic;transition:opacity .6s;position:absolute;top:108px;left:50%;transform:translate(-50%)}#toast.on{opacity:1}#ember-tag{font-family:var(--display);letter-spacing:.3em;text-transform:uppercase;color:#ffc27a;text-shadow:0 0 10px #ff7a2f;opacity:0;margin-left:6px;font-size:11px;transition:opacity .4s}#ember-tag.on{opacity:1;animation:.9s infinite alternate low-pulse}#hearth-marker{font-family:var(--display);letter-spacing:.3em;text-transform:uppercase;color:#ffd2a0;opacity:0;text-shadow:0 0 10px #000;align-items:center;gap:8px;font-size:11px;transition:opacity .4s;display:flex;position:absolute;top:50%}#hearth-marker.on{opacity:1}#hearth-marker .arrow{border-top:9px solid #0000;border-bottom:9px solid #0000;width:0;height:0}#hearth-marker.left{left:18px}#hearth-marker.left .arrow{filter:drop-shadow(0 0 8px #ff6a1a);border-right:14px solid #ff8a3d}#hearth-marker.right{flex-direction:row-reverse;right:18px}#hearth-marker.right .arrow{filter:drop-shadow(0 0 8px #ff6a1a);border-left:14px solid #ff8a3d}#hearth-marker .hp{font-family:var(--serif);letter-spacing:.05em;color:var(--mist);font-size:14px;font-style:italic}#hearth-marker.struck{animation:.5s 3 marker-pulse}@keyframes marker-pulse{50%{color:#ff5a3a;transform:scale(1.25)}}#place{text-align:center;opacity:0;pointer-events:none;position:absolute;top:24%;left:50%;transform:translate(-50%)}#place.on{animation:4.2s ease-in-out forwards place-in}#place-name{font-family:var(--display);letter-spacing:.32em;text-transform:uppercase;color:var(--bone);text-shadow:0 0 30px #000000f2,0 0 24px #ff96504d;white-space:nowrap;font-size:clamp(26px,3vw,42px)}#place-sub{font-family:var(--serif);color:var(--mist);text-shadow:0 0 16px #000;margin-top:8px;font-size:clamp(15px,1.5vw,20px);font-style:italic}@keyframes place-in{0%{opacity:0;letter-spacing:.6em}20%{opacity:1;letter-spacing:.32em}75%{opacity:1}to{opacity:0}}#menu{z-index:8;font-family:var(--display);color:var(--bone);background:radial-gradient(#08060ce0,#040307f2);justify-content:center;align-items:center;padding:16px;display:none;position:fixed;inset:0}#menu.on{display:flex}#menu.title{background:linear-gradient(#05030800 74%,#050308cc);align-items:flex-end;padding-bottom:78px}#menu.title .box{width:auto}#menu.title .list{flex-flow:wrap;justify-content:center;align-items:flex-start;gap:6px 18px}#menu.title .list button{text-shadow:0 0 10px #000,0 0 22px #000}.capture #menu{display:none!important}#menu .box{flex-direction:column;align-items:center;gap:14px;width:min(620px,100%);max-height:92vh;animation:.35s ease-out menu-in;display:flex;overflow-y:auto}@keyframes menu-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}#menu h2{letter-spacing:.45em;text-transform:uppercase;color:var(--gold);margin:0;font-size:clamp(22px,2.6vw,32px);font-weight:400}#menu h3{letter-spacing:.5em;text-transform:uppercase;color:var(--mist);align-self:flex-start;margin:14px 0 2px;font-size:11px;font-weight:400}#menu .ctx{letter-spacing:.4em;text-transform:uppercase;color:var(--mist);margin:-4px 0 6px;font-size:12px}#menu .ctx b{color:var(--gold);font-weight:600}#menu .list{flex-direction:column;align-items:stretch;gap:4px;min-width:min(340px,100%);display:flex}#menu button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0;outline:none}#menu .list button{letter-spacing:.32em;text-transform:uppercase;color:#ece2d2b8;text-shadow:0 0 14px #000;padding:10px 26px;font-size:15px;transition:color .15s,letter-spacing .2s;position:relative}#menu .list button small{font-family:var(--serif);letter-spacing:.04em;text-transform:none;color:var(--mist);margin-top:4px;font-size:14px;font-style:italic;display:block}#menu .list button:focus{color:#fff3dc;letter-spacing:.38em}#menu .list button:focus:before,#menu .list button:focus:after{content:"";background:#ffcf8a;width:8px;height:8px;margin-top:-4px;position:absolute;top:50%;transform:rotate(45deg);box-shadow:0 0 12px #ffb45ae6}#menu .list button:focus:before{left:2px}#menu .list button:focus:after{right:2px}#menu .panel{background:#140e1a8c;border:1px solid #c8b4ff24;flex-direction:column;gap:4px;width:100%;padding:10px 22px 16px;display:flex;box-shadow:0 0 40px #0009}#menu .row{letter-spacing:.18em;text-transform:uppercase;color:#ece2d2cc;text-align:left;border-left:2px solid #0000;grid-template-columns:1fr minmax(120px,210px) 3.4em;align-items:center;gap:14px;width:100%;padding:7px 8px;font-size:13px;display:grid}#menu button.row{grid-template-columns:1fr auto}#menu .row b{color:#ffd9a8;letter-spacing:.2em;font-weight:500}#menu .row output{text-align:right;color:#ffd9a8;font-variant-numeric:tabular-nums}#menu .row:focus-within,#menu button.row:focus{color:#fff3dc;background:#ffc88c0f;border-left-color:#ffcf8a}#menu input[type=range]{appearance:none;cursor:pointer;background:0 0;outline:none;width:100%;height:22px}#menu input[type=range]::-webkit-slider-runnable-track{background:linear-gradient(90deg, #ffb35e var(--v), #dcc8ff2e var(--v));height:4px}#menu input[type=range]::-moz-range-track{background:#dcc8ff2e;height:4px}#menu input[type=range]::-moz-range-progress{background:#ffb35e;height:4px}#menu input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:#ffe2b8;width:14px;height:14px;margin-top:-5px;transform:rotate(45deg);box-shadow:0 0 10px #ffaa50e6}#menu input[type=range]::-moz-range-thumb{background:#ffe2b8;border:0;border-radius:0;width:12px;height:12px;transform:rotate(45deg)}#menu input[type=range]:focus::-webkit-slider-thumb{background:#fff;box-shadow:0 0 16px #ffc878}#menu .levels{flex-direction:column;gap:6px;width:100%;display:flex}#menu .level{text-align:left;background:#140e1a8c;border:1px solid #c8b4ff24;grid-template-columns:4.2em 1fr 4em;align-items:center;gap:14px;width:100%;padding:10px 16px;transition:border-color .15s,background .15s;display:grid}#menu .level:focus{background:#ffc88c14;border-color:#ffcf8a;box-shadow:0 0 20px #ffaa5040}#menu .level .roman{color:var(--bone);text-align:center;letter-spacing:.1em;font-size:26px}#menu .level .what b{letter-spacing:.24em;text-transform:uppercase;color:#f2e6d2;font-size:13px;font-weight:500;display:block}#menu .level .what small{font-family:var(--serif);color:var(--mist);margin-top:3px;font-size:14px;font-style:italic;display:block}#menu .level .best{text-align:center;font-size:26px}#menu .level .best small{font-family:var(--serif);color:var(--mist);font-size:12px;font-style:italic}#menu .level.locked{opacity:.38;cursor:default}#menu .lock{border:1px solid var(--mist);width:12px;height:12px;display:inline-block;transform:rotate(45deg)}#menu .keys .row{text-transform:none;letter-spacing:.04em;font-family:var(--serif);grid-template-columns:minmax(150px,40%) 1fr;font-size:16px}#menu kbd{font-family:var(--display);letter-spacing:.15em;color:#ffd9a8;font-size:12px}@media (width<=560px){#menu .row{grid-template-columns:1fr}#menu.title .list{flex-direction:column}}
