.web-player{margin:0;height:auto;min-height:100vh;overflow:auto;background:#11151d;color:#e5eaf3;font-family:system-ui,"Yu Gothic",sans-serif}
.web-player.player-config-open{overflow:hidden}
.player-shell{--scene-ratio:1.3076923;--scene-aspect:816/624;width:min(960px,calc(100% - 40px),calc((100vh - 225px)*816/624));min-width:min(500px,calc(100% - 40px));margin:24px auto}
.player-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}
.player-header-actions{display:flex;align-items:center;gap:8px;flex:none}
.player-surface{display:contents}
.player-shell:is(:fullscreen,.player-expanded){--fullscreen-stage-width:min(100dvw,calc(100dvh * var(--scene-ratio)));position:relative;width:100%;height:100dvh;max-width:none;min-width:0;box-sizing:border-box;margin:0;padding:0;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#05070b}
.player-shell.player-expanded{position:fixed;inset:0;z-index:100}
.web-player-page.player-expanded-page,.web-player.player-expanded-page{overflow:hidden}
.player-shell:is(:fullscreen,.player-expanded) .player-stage{width:var(--fullscreen-stage-width);max-height:100dvh;flex:none}
.player-shell:is(:fullscreen,.player-expanded) .player-header,.player-shell:is(:fullscreen,.player-expanded) .player-controls,.player-shell:is(:fullscreen,.player-expanded) .player-help,.player-shell:is(:fullscreen,.player-expanded) .player-save-panel,.player-shell:is(:fullscreen,.player-expanded) #openSavesTitle{display:none}
@media(orientation:portrait){
  .player-shell:is(:fullscreen,.player-expanded){--fullscreen-stage-width:min(100dvh,calc(100dvw * var(--scene-ratio)))}
  .player-shell:is(:fullscreen,.player-expanded) .player-surface{position:absolute;top:0;left:100dvw;width:100dvh;height:100dvw;display:flex;align-items:center;justify-content:center;transform:rotate(90deg);transform-origin:top left}
  .player-shell:is(:fullscreen,.player-expanded) .player-stage{max-height:100dvw}
}
.player-label{font-size:11px;letter-spacing:2px;color:#8e9ab0}
.player-header h1{font-size:19px;font-weight:600;margin:5px 0 0}
.demo-badge{font-size:12px;color:#aebbd0;border:1px solid #3a4557;border-radius:5px;padding:5px 9px;white-space:nowrap}
.player-stage{position:relative;width:100%;aspect-ratio:816/624;background:#05070b;overflow:hidden;cursor:pointer;isolation:isolate;outline:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.player-stage *{-webkit-tap-highlight-color:transparent}
.player-stage:focus-visible{outline:2px solid #a4c4e8;outline-offset:3px}
.player-floating-control,.player-dialogue-toggle,.player-skip-toggle{position:absolute;z-index:6;display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid #b7c6df88;border-radius:8px;background:#111827cc;color:#eef3fa;box-shadow:0 2px 12px #0009;opacity:.8;cursor:pointer;touch-action:manipulation}
.player-floating-control{left:8px;top:8px}.player-dialogue-toggle{right:8px;top:8px}.player-skip-toggle{right:8px;top:60px}
.player-floating-control svg,.player-dialogue-toggle svg,.player-skip-toggle svg{width:var(--control-icon-size,22px);height:var(--control-icon-size,22px)}
.player-floating-control span{display:none}
.player-skip-toggle[aria-pressed="true"]{background:#365276;border-color:#c5dcff;opacity:1}
.player-floating-control:hover,.player-floating-control:focus-visible,.player-dialogue-toggle:hover,.player-dialogue-toggle:focus-visible,.player-skip-toggle:hover,.player-skip-toggle:focus-visible{opacity:1}
.player-floating-control:focus-visible,.player-dialogue-toggle:focus-visible,.player-skip-toggle:focus-visible{outline:2px solid #a4c4e8;outline-offset:2px}
.player-floating-control[hidden],.player-dialogue-toggle[hidden],.player-skip-toggle[hidden]{display:none}
.player-dialogue-toggle .player-eye-slash{display:none}
.player-button-preview .player-eye-slash{display:none}
.player-dialogue-toggle[aria-pressed="true"] .player-eye-slash{display:block}
.player-cover{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;padding:24px;box-sizing:border-box;background:#05070b;text-align:center;cursor:default}
.player-cover::before{content:"";position:absolute;inset:7%;border:1px solid #78839966;pointer-events:none}
.player-cover>*{position:relative;max-width:100%}
.player-cover[data-loading] > :not(.player-title-mark):not(#entryStatus){display:none}
.player-title-mark{font-size:clamp(10px,1.6vw,13px);letter-spacing:.32em;color:#9daec6;margin-bottom:18px}
.player-cover h2{font-family:Georgia,"Yu Mincho",serif;font-size:clamp(23px,4vw,38px);font-weight:500;letter-spacing:.12em;line-height:1.3;margin:0 0 10px;text-wrap:balance}
.player-cover #titleSubtitle{font-size:clamp(11px,1.7vw,14px);color:#a9b5c8;line-height:1.5;margin:0 0 28px}
.player-entry-actions{display:grid;grid-template-columns:minmax(160px,230px);gap:9px;justify-content:center;text-align:left}
.player-entry-actions label{font-size:12px;color:#c2cee0;letter-spacing:.08em}
.player-entry-actions select,.player-entry-actions button{width:100%;min-height:39px;box-sizing:border-box;border:1px solid #66748e;border-radius:2px;background:#111928;color:#f0f4fc;font:inherit;font-size:14px;padding:7px 12px}
.player-entry-actions select{cursor:pointer}.player-entry-actions button{margin-top:10px;background:#e1e8f3;border-color:#e1e8f3;color:#101b2b;font-weight:700;cursor:pointer;letter-spacing:.08em}
.player-entry-buttons{display:grid;grid-template-columns:1fr 1fr;gap:8px}.player-entry-actions :is(#playerSettingsToggle,#openSavesTitle){background:#172135;border-color:#66748e;color:#e5eaf3}.player-entry-actions #continuePlayer[hidden]{display:none}
.player-settings-panel{position:fixed;inset:0;z-index:200;box-sizing:border-box;width:100dvw;height:100dvh;padding:clamp(12px,1.5vw,22px);display:flex;flex-direction:column;gap:10px;overflow:hidden;background:#101824;color:#e5eaf3;text-align:left;cursor:default}
.player-settings-panel[hidden]{display:none}.player-settings-head{flex:none;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:38px}.player-settings-head h3{margin:0;font-size:18px}.player-settings-head button,.player-settings-options>button{border:1px solid #66748e;border-radius:3px;background:#243149;color:#eef3fa;padding:5px 10px;cursor:pointer}.player-settings-panel h4{margin:0 0 4px;font-size:13px}.player-settings-panel p{margin:0 0 8px;color:#a9b5c8;font-size:12px}.player-settings-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(215px,290px);gap:16px;flex:1;min-height:0}.player-settings-options{min-width:0;min-height:0;overflow:auto;padding:0 6px 12px 0;scrollbar-width:thin}.player-settings-options>button{font:inherit;font-size:12px}#playerVolumeTitle{margin-top:20px;padding-top:16px;border-top:1px solid #34445e}
.player-volume-grid{display:grid;grid-template-columns:42px minmax(0,1fr) 42px;align-items:center;gap:16px 12px}.player-volume-grid label,.player-volume-grid output{font-size:13px}.player-volume-grid input{min-width:0;width:100%;accent-color:#a4c4e8}.player-volume-grid output{text-align:right;font-variant-numeric:tabular-nums}
.player-button-settings{display:flex;flex-direction:column;min-width:0;min-height:0}.player-button-preview-space{display:flex;align-items:center;justify-content:center;flex:1;min-height:0;overflow:hidden}.player-button-preview{position:relative;flex:none;box-sizing:border-box;border:1px solid #52637b;border-radius:4px;background:linear-gradient(90deg,#25344955 1px,transparent 1px),linear-gradient(#25344955 1px,transparent 1px),#090f19;background-size:25% 25%;overflow:hidden}.player-button-preview button{position:absolute;display:grid;place-items:center;width:38px;height:38px;padding:0;border:1px solid #b7c6df88;border-radius:8px;background:#243149;color:#eef3fa;box-shadow:0 2px 8px #0009;cursor:grab;touch-action:none}.player-button-preview button:active{cursor:grabbing}.player-button-preview button.is-hidden{opacity:.4;border-style:dashed}.player-button-preview button svg{width:20px;height:20px}.player-button-preview button span{display:none}
.player-button-rows{display:grid;gap:8px;margin:0 0 12px}.player-button-row{display:grid;gap:6px;padding:7px 9px;border:1px solid #34445e;border-radius:4px;background:#182235;font-size:12px}.player-button-row label{display:flex;align-items:center;gap:8px;min-width:0}.player-button-row label input{accent-color:#83baff}.player-button-row .size-control{display:grid;grid-template-columns:minmax(0,1fr) 43px;align-items:center;gap:6px}.player-button-row .size-control input{min-width:0;width:100%;accent-color:#83baff}.player-button-row output{text-align:right;font-variant-numeric:tabular-nums;color:#b9cce6}
.player-settings-panel :is(button,input):focus-visible{outline:2px solid #a4c4e8;outline-offset:2px}
.player-entry-actions :is(select,button):focus-visible{outline:2px solid #c8dcff;outline-offset:3px}
.player-entry-actions :is(select,button):disabled{opacity:.52;cursor:default}
.player-entry-status{font-size:12px;color:#b9c6d9;line-height:1.5;min-height:18px;margin:18px 0 0}
.player-cover[hidden]{display:none}
.player-save-panel{position:absolute;z-index:8;inset:6%;display:flex;flex-direction:column;box-sizing:border-box;padding:clamp(10px,2vw,20px);border:1px solid #66748e;border-radius:5px;background:#101824;box-shadow:0 12px 28px #000b;cursor:default}
.player-save-panel[hidden]{display:none}.player-save-head{display:flex;justify-content:space-between;align-items:center;gap:12px}.player-save-head h2{margin:0;font-size:17px}.player-save-head button,.player-save-row button{min-height:30px;padding:4px 10px;border:1px solid #66748e;border-radius:4px;background:#243149;color:#eef3fa;font:inherit;font-size:12px;cursor:pointer}.player-save-head button:focus-visible,.player-save-row button:focus-visible{outline:2px solid #a4c4e8;outline-offset:2px}.player-save-row button:disabled{opacity:.4;cursor:default}
#playerSaveStatus{min-height:18px;margin:7px 0;color:#b9c6d9;font-size:12px}.player-save-slots{min-height:0;min-width:0;overflow-y:auto;overflow-x:hidden;display:grid;grid-template-columns:minmax(0,1fr);align-content:start;gap:6px}.player-save-row{display:flex;align-items:center;gap:10px;min-width:0;min-height:48px;padding:6px 8px;border:1px solid #34445e;border-radius:4px;background:#182235}.player-save-detail{min-width:0;flex:1;overflow:hidden}.player-save-detail strong{display:block;font-size:12px}.player-save-detail small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#aebbd0;font-size:11px}.player-save-actions{display:flex;gap:5px;flex:none}
#playerSaveStatus[data-kind="success"]{color:#9be3b1}#playerSaveStatus[data-kind="error"]{color:#ffaaaa}
.player-save-slots{scrollbar-width:thin;scrollbar-color:#637794 #101824}.player-save-slots::-webkit-scrollbar{width:7px}.player-save-slots::-webkit-scrollbar-thumb{background:#637794;border-radius:4px}
.player-controls{display:flex;align-items:center;gap:10px;margin-top:14px;min-height:34px}
.player-controls[hidden]{display:none}
.player-controls button{font:inherit;font-size:13px;background:#293447;border:1px solid #4a5d79;border-radius:5px;color:#e6eef9;padding:8px 16px;cursor:pointer;white-space:nowrap}
.player-controls button:disabled{opacity:.45;cursor:default}
.player-controls button:focus-visible{outline:2px solid #a4c4e8;outline-offset:3px}
#playerStatus{font-size:12px;color:#b3c0d3;line-height:1.5}
.player-help{color:#8996aa;font-size:12px;line-height:1.9;margin:12px 0 0;white-space:pre-line}
.player-stage .runtime-message-hint{background:#d9e6fa;clip-path:polygon(20% 30%,80% 30%,50% 70%)}
@media(max-width:600px){.player-shell{width:calc(100% - 20px);margin:16px auto}.player-header h1{font-size:15px}.demo-badge{font-size:10px}.player-controls{flex-wrap:wrap}#playerStatus{flex-basis:100%}.player-cover{padding:12px}.player-cover::before{inset:4%}.player-title-mark{margin-bottom:8px}.player-entry-actions{grid-template-columns:minmax(130px,200px);gap:4px}.player-entry-actions select,.player-entry-actions button{min-height:32px;font-size:12px;padding:4px 8px}.player-entry-actions button{margin-top:2px}.player-entry-status{margin-top:8px;font-size:10px}.player-settings-panel{padding:12px}.player-settings-layout{grid-template-columns:minmax(0,1fr) 215px;gap:10px}.player-volume-grid{gap:10px 8px}}
@media(orientation:portrait){.player-settings-panel{inset:auto;top:0;left:100dvw;width:100dvh;height:100dvw;transform:rotate(90deg);transform-origin:top left}}
.web-player-page{height:auto;overflow:auto}
