:root{--bg:#04050f;--fg:#f4f4f8;--dim:#a8aed0;--accent:#ffd84a;--danger:#ff6a6a;--hp:#5ad16a;--mp:#5aa8ff;--border:#dcdce8;--win-top:#3c4cc8;--win-bottom:#0e1660;--hand:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 9' shape-rendering='crispEdges'%3E%3Crect x='2' y='0' width='5' height='1' fill='%23101018'/%3E%3Crect x='1' y='1' width='1' height='1' fill='%23101018'/%3E%3Crect x='2' y='1' width='5' height='1' fill='%23f4f4f8'/%3E%3Crect x='7' y='1' width='5' height='1' fill='%23101018'/%3E%3Crect x='0' y='2' width='1' height='1' fill='%23101018'/%3E%3Crect x='1' y='2' width='11' height='1' fill='%23f4f4f8'/%3E%3Crect x='12' y='2' width='1' height='1' fill='%23101018'/%3E%3Crect x='0' y='3' width='1' height='1' fill='%23101018'/%3E%3Crect x='1' y='3' width='6' height='1' fill='%23f4f4f8'/%3E%3Crect x='7' y='3' width='5' height='1' fill='%23101018'/%3E%3Crect x='0' y='4' width='1' height='1' fill='%23101018'/%3E%3Crect x='1' y='4' width='1' height='1' fill='%23f4f4f8'/%3E%3Crect x='2' y='4' width='1' height='1' fill='%23a0a0b8'/%3E%3Crect x='3' y='4' width='6' height='1' fill='%23f4f4f8'/%3E%3Crect x='9' y='4' width='1' height='1' fill='%23101018'/%3E%3Crect x='0' y='5' width='1' height='1' fill='%23101018'/%3E%3Crect x='1' y='5' width='1' height='1' fill='%23f4f4f8'/%3E%3Crect x='2' y='5' width='1' height='1' fill='%23a0a0b8'/%3E%3Crect x='3' y='5' width='4' height='1' fill='%23f4f4f8'/%3E%3Crect x='7' y='5' width='2' height='1' fill='%23101018'/%3E%3Crect x='0' y='6' width='1' height='1' fill='%23101018'/%3E%3Crect x='1' y='6' width='2' height='1' fill='%23a0a0b8'/%3E%3Crect x='3' y='6' width='5' height='1' fill='%23f4f4f8'/%3E%3Crect x='8' y='6' width='1' height='1' fill='%23101018'/%3E%3Crect x='1' y='7' width='1' height='1' fill='%23101018'/%3E%3Crect x='2' y='7' width='5' height='1' fill='%23a0a0b8'/%3E%3Crect x='7' y='7' width='1' height='1' fill='%23101018'/%3E%3Crect x='2' y='8' width='5' height='1' fill='%23101018'/%3E%3C/svg%3E");color:var(--fg);background:var(--bg);-webkit-font-smoothing:none;font-family:DotGothic16,monospace}*{box-sizing:border-box}body{background:var(--bg);min-height:100dvh;margin:0}#root{flex-direction:column;gap:10px;max-width:520px;min-height:100dvh;margin:0 auto;padding:12px 16px 24px;display:flex}button{font:inherit;color:inherit;cursor:pointer;text-align:left;background:0 0;border:none;padding:0}.window{border:2px solid var(--border);background:linear-gradient(180deg, var(--win-top), var(--win-bottom));text-shadow:1px 1px #000a;border-radius:6px;padding:10px 12px;box-shadow:0 0 0 1px #000,inset 0 0 0 1px #20286a,inset 0 2px 0 1px #ffffff1f}.window-title{color:var(--accent);margin:0 0 6px;font-size:14px}.pixel-art{image-rendering:pixelated}.title-screen{text-align:center;flex-direction:column;flex:1;justify-content:center;gap:24px;display:flex}.title-page{flex-direction:column;flex:1;justify-content:center;gap:28px;display:flex}.title-page .title-screen{flex:none}.title-screen h1{color:var(--accent);text-shadow:3px 3px #a33;margin:0;font-size:30px;line-height:1.4}.title-screen h1.logo{color:#0000;text-shadow:none;filter:drop-shadow(1px 1px #3a0a10)drop-shadow(-1px -1px #3a0a10)drop-shadow(3px 3px #a33);background:linear-gradient(#fffbe0 10%,#ffd84a 45%,#e8901a 55%,#fff0a0 90%);-webkit-background-clip:text;background-clip:text;font-size:36px}.title-screen .sub{color:var(--dim);font-size:14px}.title-screen .actions{flex-direction:column;align-items:center;gap:12px;display:flex}.big-button{border:2px solid var(--border);text-align:center;background:linear-gradient(180deg, var(--win-top), var(--win-bottom));text-shadow:1px 1px #000a;border-radius:6px;padding:10px 28px;font-size:18px;box-shadow:0 0 0 1px #000,inset 0 0 0 1px #20286a}.big-button:hover,.big-button:focus-visible{color:var(--accent);border-color:var(--accent);outline:none}.topbar{text-shadow:1px 1px #000,2px 2px #0008;justify-content:space-between;font-size:15px;display:flex}.deadline.urgent{color:var(--danger)}.stage{aspect-ratio:256/128;border:2px solid var(--border);border-radius:6px;width:100%;position:relative;overflow:hidden;box-shadow:0 0 0 1px #000}.backdrop{width:100%;height:100%;image-rendering:pixelated;position:absolute;inset:0}.stage .topbar{position:absolute;top:6px;left:8px;right:8px}.stage-sprite{position:absolute}.stage-sprite canvas{width:100%;height:auto;display:block}.battle{flex-direction:column;gap:10px;display:flex}.screen-flash{z-index:10;opacity:0;pointer-events:none;position:fixed;inset:0}.card-flash{opacity:0;pointer-events:none;border-radius:4px;position:absolute;inset:0}.stage-sprite canvas.spark{opacity:0;width:55%;animation:.4s steps(4,end) spark;position:absolute;top:45%;left:50%;translate:-50% -50%}.stage-sprite canvas.spark.big{width:90%}@keyframes spark{0%{opacity:1;rotate:0deg;scale:.3}50%{opacity:1;rotate:20deg;scale:1.1}to{opacity:0;rotate:30deg;scale:1.4}}.popup{z-index:2;white-space:nowrap;pointer-events:none;color:#fff;text-shadow:-2px 0 #000,2px 0 #000,0 -2px #000,0 2px #000,2px 2px #000,-2px 2px #000,2px -2px #000,-2px -2px #000;opacity:0;width:max-content;font-size:22px;animation:1.1s forwards bounce;position:absolute;top:25%;left:50%;translate:-50%}.popup.progress{color:#ffe860}.popup.progress.big{color:#fff4b0;font-size:32px}.popup.miss{color:#c8ccdc;font-size:22px}.popup.setback{color:#ff6a6a;font-size:26px}.popup.ally-pop{font-size:20px;top:34%}.popup.ally-pop.mp{color:#e0a8ff}.popup.ally-pop.heal{color:#7aff9a}@keyframes bounce{0%{opacity:1;transform:translateY(10px)}12%{transform:translateY(-16px)}26%{transform:translateY(0)}36%{transform:translateY(-6px)}46%{transform:translateY(0)}85%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(0)}}.enemy{flex-direction:column;gap:4px;padding:6px 12px 8px;display:flex}.enemy-name{color:var(--danger);font-size:14px}.progress-row{align-items:center;gap:8px;width:100%;font-size:15px;display:flex}.bar{border:2px solid var(--border);background:#06082a;border-radius:2px;flex:1;height:12px;position:relative;box-shadow:0 0 0 1px #000}.bar>span{background:linear-gradient(180deg, #fff2a8, var(--accent) 45%, #c8901a);transition:width .3s steps(6,end);position:absolute;inset:0 auto 0 0}.bar.hp>span{background:linear-gradient(180deg, #b8f8c0, var(--hp) 45%, #2a8a3a)}.bar.mp>span{background:linear-gradient(180deg, #c0e0ff, var(--mp) 45%, #2a5ab0)}.bar.small{border-width:1px;height:8px}.restriction{color:var(--danger);font-size:13px}.party{grid-template-columns:1fr 1fr;gap:8px;display:grid}.ally{flex-direction:column;gap:3px;padding:8px 10px;font-size:13px;display:flex;position:relative}.ally.current{border-color:var(--accent);box-shadow:0 0 0 1px #000,0 0 8px 1px #ffd84a80,inset 0 0 0 1px #20286a}.ally.out{color:var(--dim);background:linear-gradient(#3a3a50,#14141e);border-color:#6a6a80}.ally-head{align-items:center;gap:6px;margin-bottom:2px;display:flex}.ally .face{flex:none;width:48px;height:48px}.ally.out .face{filter:grayscale()brightness(.6)}.ally .name{font-size:15px}.ally .title{color:var(--dim);font-size:11px}.ally .stat{white-space:nowrap;grid-template-columns:5.5em 1fr 2.2em;align-items:center;gap:4px;font-size:11px;display:grid}.ally .stat .num{text-align:right}.badges{flex-wrap:wrap;gap:4px;min-height:1.2em;display:flex}.badge{color:var(--accent);background:#0008;border:1px solid;border-radius:2px;padding:0 4px;font-size:11px}.badge.bad{color:var(--danger)}.bottom{min-height:190px}.message-window{cursor:pointer;-webkit-user-select:none;user-select:none;flex-direction:column;justify-content:space-between;min-height:190px;display:flex}.message-window p{margin:0 0 4px;line-height:1.6}.next-mark{align-self:center;animation:.8s step-end infinite blink}@keyframes blink{50%{opacity:0}}.menu{flex-direction:column;gap:2px;display:flex}.menu-item{justify-content:space-between;gap:8px;padding:6px 4px 6px 30px;line-height:1.3;display:flex;position:relative}.menu-item:before{content:"";background:var(--hand) no-repeat center / contain;width:26px;height:18px;image-rendering:pixelated;filter:drop-shadow(1px 1px #000a);visibility:hidden;position:absolute;top:8px;left:0}.menu-item:hover:not(:disabled):before,.menu-item:focus-visible:before{visibility:visible;animation:.6s steps(2,end) infinite point}@keyframes point{50%{transform:translate(-2px)}}.menu-item:focus-visible{outline:none}.menu-item:disabled{color:var(--dim);cursor:default}.menu-item .side{color:var(--dim);white-space:nowrap;font-size:12px}.menu-item .desc{color:var(--dim);font-size:11px;display:block}.notice{color:var(--accent);margin-bottom:6px;font-size:13px}.notice p{margin:0}.menu-back{color:var(--dim)}.story{flex-direction:column;flex:1;gap:10px;display:flex}.skip{font-size:13px}.story .stage{animation:.5s steps(5,end) dawn}@keyframes dawn{0%{filter:brightness(0)}}.silhouette{filter:brightness(0)drop-shadow(0 0 4px #f44)}@keyframes fadein{0%{opacity:0}to{opacity:1}}.story .window p{margin:0;line-height:1.6}