#game-dialog.campaign-dialog { width:min(520px,calc(100vw - 24px)); height:min(900px,calc(100dvh - 24px)); max-width:100vw; max-height:100dvh; margin:auto; padding:0; border:0; border-radius:16px; overflow:hidden; background:#102d28; color:#fff8e5; }
.campaign-dialog::backdrop { background:#0b221feb; backdrop-filter:blur(5px); }
.campaign-shell,.campaign-stage { position:relative; width:100%; height:100%; overflow:hidden; }
.campaign-stage { display:flex; align-items:center; justify-content:center; }
.campaign-stage::before { content:''; position:absolute; inset:0; background:linear-gradient(#091e1bd9,#091e1bd9),var(--game-backdrop) center/cover; pointer-events:none; }
.campaign-screen { position:relative; flex:none; overflow:hidden; border-radius:10px; isolation:isolate; }
.campaign-screen > canvas { display:block; width:100%; height:100%; image-rendering:pixelated; touch-action:none; outline-offset:-3px; user-select:none; -webkit-user-select:none; }
.campaign-header { position:absolute; z-index:4; inset:0 0 auto; min-height:58px; display:flex; align-items:flex-start; gap:5px; padding:6px; background:linear-gradient(#112c29e8,#112c2980,transparent); pointer-events:none; }
.campaign-header h2 { flex:1; min-width:0; margin:10px 0 0; font:500 13px/1.25 'Fraunces',Georgia,serif; color:#fff3d4; overflow-wrap:anywhere; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; text-shadow:0 1px 2px #0d2924; }
.campaign-header-actions { display:flex; gap:2px; }
.campaign-header button { pointer-events:auto; flex:none; width:44px; height:44px; min-width:44px; display:grid; place-items:center; border:1px solid #d3dfc440; border-radius:50%; color:#f8eaca; background:#163d32b8; }
.campaign-header button:hover { background:#335543; }
.campaign-header svg { width:20px; height:20px; }
.campaign-overlay { position:absolute; z-index:5; inset:0; display:flex; align-items:center; justify-content:center; padding:60px 16px 16px; background:#0b292482; backdrop-filter:blur(3px); }
.campaign-overlay[hidden] { display:none; }
.campaign-dialog[data-modal=true] .campaign-header { z-index:6; background:transparent; }
.campaign-dialog[data-modal=true] .campaign-header h2 { visibility:hidden; }
.campaign-card { width:min(100%,360px); max-height:100%; padding:24px; border:1px solid #c0ac72; border-radius:14px; background:#fcf6e8; color:#264a39; box-shadow:0 10px 40px #0004; text-align:center; display:flex; flex-direction:column; overflow:hidden; }
.campaign-card-body { min-height:0; overflow:auto; scrollbar-width:thin; overscroll-behavior:contain; }
.campaign-card h3 { font:500 26px/1.15 'Fraunces',Georgia,serif; letter-spacing:-.5px; margin:8px 0 18px; overflow-wrap:anywhere; }
.campaign-copy { margin:0 0 22px; font:400 14px/1.65 'DM Sans',sans-serif; white-space:pre-line; color:#526651; overflow-wrap:anywhere; }
.campaign-speaker { display:flex; align-items:center; justify-content:center; gap:7px; margin:-8px 0 7px; font:500 13px 'DM Sans',sans-serif; color:#6c7151; }
.campaign-speaker canvas { width:36px; height:48px; image-rendering:pixelated; }
.campaign-card-actions { display:flex; flex-direction:column; gap:10px; flex:none; margin-top:18px; }
.campaign-card-actions:empty { display:none; }
.campaign-button { min-height:48px; padding:12px 16px; border:1px solid #284e3b; border-radius:9px; background:#284e3b; color:#fff4d7; font:500 14px/1.3 'DM Sans',sans-serif; cursor:pointer; touch-action:manipulation; }
.campaign-button:hover { background:#3c6548; }
.campaign-button.secondary { color:#37553d; border-color:#aab79b; background:transparent; }
.campaign-button.secondary:hover { background:#e8ecdc; }
.campaign-button:disabled { opacity:.4; cursor:default; }
.campaign-button:focus-visible,.campaign-tree-choice:focus-visible { outline:3px solid #bc8c37; outline-offset:3px; }
.campaign-controls,.campaign-rope-buttons,.world-objects { position:absolute; z-index:2; inset:0; padding:0; border:0; background:none; pointer-events:none; }
.campaign-controls:empty { display:none; }
.campaign-dialog[data-modal=true] .campaign-controls { display:none; }
.campaign-platform-controls { position:absolute; left:0; right:0; bottom:14px; display:flex; align-items:center; gap:12px; padding:0 14px; touch-action:none; }
.campaign-platform-controls .campaign-button { pointer-events:auto; width:54px; height:54px; min-height:54px; padding:0; display:grid; place-items:center; border-radius:50%; border:1px solid #f5e5b980; color:#fff4d7; background:#163d32c9; font:500 27px/1 'DM Sans',sans-serif; touch-action:none; user-select:none; -webkit-user-select:none; }
.campaign-platform-controls .campaign-button:last-child { margin-left:auto; width:64px; height:64px; color:#193f32; background:#f2dfb5e8; }
.campaign-platform-controls button:active { transform:scale(.95); }
.rope-object { position:absolute; width:44px; height:44px; min-height:44px; padding:0; transform:translate(-50%,-50%); border:0; border-radius:50%; background:transparent; pointer-events:auto; }
.rope-object:focus-visible { outline:3px solid #ffe1a0; outline-offset:0; }
.rope-object:disabled { pointer-events:none; }
.world-object { position:absolute; padding:0; min-width:44px; min-height:44px; border:0; border-radius:10px; background:transparent; pointer-events:none; }
.world-object:focus-visible { outline:3px solid #ffe1a0; outline-offset:-3px; background:#fce4a622; }
.world-object:focus-visible::after { content:attr(aria-label); position:absolute; top:0; left:0; padding:5px; border-radius:5px; background:#173d33; color:#fff3cd; font:500 12px/1.4 'DM Sans',sans-serif; }
.campaign-tree-choices { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; margin:12px 0 4px; }
.campaign-tree-choice { min-width:0; padding:10px 4px; border:1px solid #aebc9e; border-radius:10px; background:#f1efdf; cursor:pointer; }
.campaign-tree-choice:hover { background:#e1e9d1; border-color:#637c50; }
.campaign-tree-choice img { display:block; width:100%; height:128px; object-fit:contain; image-rendering:pixelated; }
.campaign-tree-choice span { display:block; margin-top:10px; font:500 12px 'DM Sans',sans-serif; }
.campaign-memory img { display:block; width:auto; max-width:100%; max-height:200px; object-fit:contain; margin:12px auto 20px; border:5px solid white; border-radius:4px; box-shadow:0 3px 16px #25482d1a; }
.campaign-memory-caption { overflow-wrap:anywhere; margin:12px 0; color:#806b43; font:500 15px 'Fraunces',Georgia,serif; }
.campaign-letter { text-align:left; padding:0 0 16px; }
.campaign-letter p { font:400 15px/1.8 'DM Sans',sans-serif; white-space:pre-wrap; overflow-wrap:anywhere; margin:0 0 18px; }
.campaign-letter .campaign-wish { color:#8c6a2f; font:500 19px/1.4 'Fraunces',Georgia,serif; text-align:center; }
.campaign-signature { text-align:right; color:#7a734e; }
.campaign-chapters { display:grid; gap:9px; margin:0 0 20px; }
.campaign-chapters .campaign-button { text-align:left; }
.campaign-pause-options { display:flex; flex-direction:column; gap:14px; margin-bottom:22px; text-align:left; font:400 14px/1.65 'DM Sans',sans-serif; }
.campaign-pause-options label { min-height:44px; flex-direction:row; align-items:center; gap:12px; font-size:14px; }
.campaign-pause-options input { width:18px; height:18px; min-height:18px; padding:0; margin:0; accent-color:#35583d; flex:none; }
.campaign-pause-options details { border-top:1px solid #cbd1b9; }
.campaign-pause-options summary { min-height:44px; display:flex; align-items:center; justify-content:space-between; cursor:pointer; }
.campaign-pause-options summary::after { content:'+'; font-size:21px; }
.campaign-pause-options details[open] summary::after { content:'−'; }
.campaign-pause-options p { font-size:13px; color:#697052; margin:4px 0 14px; }
.campaign-pause-options details .campaign-button { width:100%; }
.campaign-toast { position:absolute; bottom:18px; left:16px; right:16px; z-index:7; padding:10px 13px; border:1px solid #bbbe86; border-radius:10px; color:#fff3d0; background:#224d3cf0; text-align:center; font:400 13px/1.5 'DM Sans',sans-serif; pointer-events:none; }
@media(max-width:520px) { #game-dialog.campaign-dialog { width:100vw; height:100dvh; margin:0; border-radius:0; } }
@media(max-width:350px),(max-height:520px) { .campaign-overlay { padding:56px 12px 12px; } .campaign-card { padding:16px; } .campaign-card h3 { font-size:22px; margin:7px 0 14px; } .campaign-copy { font-size:13px; line-height:1.55; margin-bottom:12px; } .campaign-card-actions { margin-top:12px; gap:8px; } .campaign-tree-choice img { height:90px; } .campaign-tree-choice span { font-size:10px; } .campaign-letter p { font-size:13px; line-height:1.65; } .campaign-speaker { margin:0 0 6px; } .campaign-memory img { max-height:145px; } }
@media(max-height:520px) and (orientation:landscape) { #game-dialog.campaign-dialog { width:min(900px,100vw); height:100dvh; margin:auto; border-radius:0; } .campaign-speaker { display:none; } .campaign-memory img { max-height:110px; margin:6px auto; } }
@media(prefers-reduced-motion:reduce) { .campaign-overlay { backdrop-filter:none; } }

.campaign-card[data-settling=true] .campaign-button:disabled { opacity:1; }