/* 既存の和風配色を継承し、志士編だけ可変幅にする。 */
#character-entry{position:fixed;top:8px;left:12px;z-index:55;padding:8px 12px;background:#213e37;border:1px solid #b99956;border-radius:4px}
.character-active,.character-active body,html:has(body.character-active){min-width:0!important}
body.character-active{overflow:auto!important;min-height:100vh}
.character-active .game-frame,.character-active #fsGate,.character-active>.fs-toggle,.character-active #character-entry{display:none!important}
#character-game[hidden]{display:none}
#character-game,.character-dialog{--gold:#d3b267;--muted:#b4c3b7;color:#e8e1ce}
body.character-active{background:radial-gradient(ellipse at top,#20372d,#0b1712 65%);color:#e8e1ce}
body.character-active>.history-music,.character-dialog>.history-music{position:static;margin:16px 12px;width:max-content;max-width:calc(100% - 24px)}
@media(max-width:600px){.char-header>div:first-child,.char-header .char-date{width:100%}.char-header .char-hud{flex:1 0 100%}.char-header .char-hud span{flex:1 0 40%}}
/* モバイルでも既存タイトルから新モードへ確実に入れる。 */
@media(max-width:600px){html:has(#start-dialog[open]),body:has(#start-dialog[open]){min-width:0!important;width:100%;overflow-x:hidden!important}}
@media(max-width:600px){#start-dialog{width:calc(100vw - 24px);max-width:calc(100vw - 24px);max-height:90vh;overflow:auto;grid-template-columns:1fr}#start-dialog .title-art{display:none}#start-dialog section{padding:20px}#step-title{padding-top:10px}#start-dialog h1{font-size:30px}#start-dialog .end-turn{width:100%;min-width:0;justify-content:center}}
#character-game{max-width:1640px;margin:0 auto;padding:20px;line-height:1.65;font-family:'Yu Gothic','Hiragino Kaku Gothic ProN',sans-serif}
#character-game button,.character-dialog button{padding:10px 14px;border:1px solid #596557;background:#233831;border-radius:4px;cursor:pointer;line-height:1.5}
#character-game button:hover,.character-dialog button:hover{background:#345047;border-color:var(--gold)}
#character-game button:disabled,.character-dialog button:disabled{opacity:.45;cursor:not-allowed}
#character-game h1,#character-game h2,#character-game h3,.character-dialog h1,.character-dialog h2{font-family:'Yu Mincho',serif;margin:0 0 12px}
#character-game h1{font-size:25px}#character-game h2{font-size:19px}#character-game h3{font-size:15px}
.char-eyebrow{color:var(--gold);font-size:11px;letter-spacing:.14em;margin:0 0 8px}
.char-header{display:flex;gap:20px;align-items:center;flex-wrap:wrap;border-bottom:2px solid #b99956;padding-bottom:16px;margin-bottom:18px}
.char-header h1 small{font-family:sans-serif;font-size:12px;margin-left:12px;color:#aabbae}
.char-date{font-size:17px}.char-date small,.char-footer small{display:block;color:var(--muted);font-size:11px}
.char-hud{display:flex;gap:8px;flex-wrap:wrap;flex:1}.char-hud span{padding:6px 12px;background:#1a2c27;border-radius:4px;font-size:13px}.char-hud b{color:var(--gold)}
.char-layout{display:grid;grid-template-columns:210px minmax(360px,1fr) 350px;gap:18px;align-items:start}
.char-left,.char-right,.char-travel,.char-chronicle{padding:18px;background:#13251fe8;border:1px solid #59655780;border-radius:6px}
.char-unified b{font-size:45px;color:var(--gold)}.char-unified{margin-bottom:12px}
#character-game progress{accent-color:var(--gold);width:100%;height:7px;border:0}
.char-goals{list-style:none;padding:0;font-size:12px;line-height:2.4}
.char-nav{display:grid;gap:8px;margin:25px 0}.char-nav .active{border-color:var(--gold)!important;color:var(--gold)}
.char-abilities label{display:block;font-size:12px;margin:10px 0}.char-abilities b{float:right}.char-abilities p{font-size:12px}
.char-map-heading{display:flex;justify-content:space-between;gap:12px;align-items:center}.char-map-heading span{font-size:11px}.char-map-heading i{font-style:normal}
.char-map{position:relative;width:100%;aspect-ratio:1672/941;border:1px solid #9ca990;border-radius:5px;overflow:hidden;background:#a8bbc0}
#char-map-canvas{display:block;width:100%;height:100%}
#character-game .char-node{position:absolute;transform:translate(-50%,-50%);padding:2px 4px;background:#152922e8;border:1px solid var(--node);border-radius:3px;font-size:11px;white-space:nowrap;line-height:1.5;color:#f4eddb}
.char-node i{display:inline-block;width:6px;height:6px;background:var(--node);border-radius:50%;margin-right:3px}
#character-game .char-node.selected{outline:2px solid #eddca5;z-index:2}
.char-travel{margin-top:12px;padding:12px 16px}.char-travel h3{margin-bottom:5px!important}
.char-buttons{display:flex;gap:8px;flex-wrap:wrap}.char-buttons small{display:block;font-size:10px;color:var(--muted)}
.char-small{font-size:12px;color:#b7c6ba;line-height:1.8}.char-warning{color:#e4b479!important}
#char-notice{background:#2e392a;border-left:3px solid var(--gold);padding:12px 16px;min-height:50px;font-size:13px}
.char-chronicle ol{padding:0;list-style:none;margin:0;font-size:12px}.char-chronicle li{padding:9px 0;border-top:1px solid #59655760}.char-chronicle time{display:block;color:#a7b9a9;font-size:10px}
.char-person{display:flex;gap:10px;align-items:center;padding:13px 0;border-top:1px solid #59655770}.char-person div{flex:1;min-width:0}.char-person strong{font-size:13px}.char-person small{display:block;font-size:11px;color:#aabbae}.char-person button{padding:7px!important;flex-shrink:0;font-size:12px}
.char-portrait{width:42px;height:54px;object-fit:cover;border-radius:3px;border:1px solid #b9995655}
.char-action-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.char-action-grid small{display:block;color:#aabbae;font-size:10px;margin-top:5px}
.char-right label,.character-dialog label{display:block;font-size:13px;margin:15px 0}.char-right select,.character-dialog select{display:block;width:100%;padding:10px;margin-top:5px;border:1px solid #7b876e;background:#182b24;color:#ece4ce;border-radius:4px;font:inherit}
.char-footer{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;border-top:1px solid #596557;padding-top:15px;margin-top:18px;font-size:13px}
#character-game .char-primary,.character-dialog .char-primary{background:#b49a5a;color:#15231a;font-weight:bold}
.character-dialog{width:min(740px,95vw);max-height:90vh;overflow:auto;background:#14251f;color:#e8e1ce;border:1px solid #b99956;border-radius:8px;padding:28px;font-family:'Yu Gothic',sans-serif;line-height:1.8}
.character-dialog::backdrop{background:#04110ded;backdrop-filter:blur(4px)}
.character-dialog h1{font-size:27px}.character-dialog [data-error]{color:#f0bb97;font-size:13px}.character-dialog canvas{display:block;width:100%;height:auto;border:1px solid #596557;border-radius:4px;margin:15px 0}
.char-hero-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.character-dialog .char-hero-choice{border:1px solid #53664c;border-radius:4px;cursor:pointer;padding:10px;margin:0;display:flex;flex-direction:column;gap:5px;font-size:12px}.char-hero-choice:has(input:checked){background:#384833;border-color:var(--gold)}.char-hero-choice .char-portrait{width:100%;height:100px}.char-hero-choice span,.char-hero-choice small{font-size:10px}.char-hero-choice input{accent-color:var(--gold)}
.char-slot-list{display:grid;gap:12px}.char-slot-list small{display:block;font-size:12px;color:#aabbae}
@media(max-width:1250px){.char-layout{grid-template-columns:180px minmax(300px,1fr) 300px}#character-game{padding:12px}.char-right,.char-left{padding:12px}}
@media(max-width:1000px){.char-layout{grid-template-columns:175px minmax(0,1fr)}.char-right{grid-column:1/-1}.char-right .char-person{display:inline-flex;width:49%;vertical-align:top}.char-map-heading h2{font-size:15px!important}}
@media(max-width:600px){.char-layout{display:flex;flex-direction:column}.char-left,.char-center,.char-right{width:100%}.char-left{display:grid;grid-template-columns:1fr 1fr;gap:8px}.char-left .char-eyebrow,.char-left h2,.char-left>progress{grid-column:1/-1}.char-unified b{font-size:30px}.char-nav{margin:0}.char-abilities{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px}.char-abilities h3{width:100%}.char-abilities label{width:21%;margin:0}.char-abilities p{margin:0}.char-goals{margin:0}.char-right .char-person{display:flex;width:100%}.char-header{gap:8px}.char-hud span{padding:5px 8px}.char-hero-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.character-dialog{padding:18px}.character-dialog h1{font-size:22px}.char-map{min-height:245px;aspect-ratio:1672/941}.char-map-heading{flex-wrap:wrap;gap:0}#character-game .char-node{font-size:9px;padding:1px 2px}.char-footer button{font-size:11px;padding:7px!important}}

/* Event illustration and portrait presentation */
.char-scene{position:relative;margin:0 0 18px;overflow:hidden;border:1px solid #a58b50;border-radius:10px;background:#162a23;aspect-ratio:16/7;box-shadow:0 12px 32px #0004}
.char-scene img{display:block;width:100%;height:100%;object-fit:cover}
.char-scene:after{content:'';position:absolute;inset:45% 0 0;background:linear-gradient(transparent,#071810e8);pointer-events:none}
.char-scene figcaption{position:absolute;bottom:14px;left:20px;right:20px;z-index:1;font-family:'Yu Mincho',serif;font-size:22px;color:#fff2d4;text-shadow:0 2px 8px #000}
.char-player{display:flex;align-items:center;gap:16px}.char-player>.char-portrait{width:80px;height:100px;object-fit:cover;border:1px solid var(--gold);border-radius:8px}
.char-person{padding:16px!important;background:linear-gradient(135deg,#294337,#14271f);border:1px solid #64734f!important;border-radius:10px!important;box-shadow:0 5px 16px #0002;align-items:center}
.char-person>.char-portrait{width:64px;height:82px;object-fit:cover;flex-shrink:0;border-radius:6px;border:1px solid #bd9d59}
.char-mon{display:grid;place-items:center;background:radial-gradient(circle,#aa9153,#293d2f);font:32px 'Yu Mincho',serif;color:#fff1cf}
.char-nav button{border-radius:8px!important;text-align:left;padding:14px!important}.char-nav button.active{box-shadow:inset 4px 0 var(--gold);background:#40513a!important}
.char-left,.char-right{background:linear-gradient(160deg,#243c30e8,#10251e)!important;border-radius:12px!important}.char-header{border-bottom:1px solid #a68c50;padding-bottom:20px}
.char-action-grid button{min-height:86px;border-radius:8px!important;background:linear-gradient(135deg,#345241,#1b3027)!important}
.char-map{border-radius:10px;overflow:hidden;border:1px solid #ad955d}.char-unified{color:#e2c47e}.character-dialog .char-scene{max-height:260px;aspect-ratio:16/6}
.char-hero-choice{border-radius:10px!important;overflow:hidden;background:linear-gradient(#375541,#162920)!important}.char-hero-choice .char-portrait{width:100%;height:160px;object-fit:cover;object-position:center 22%}
@media(max-width:600px){.char-player>.char-portrait{width:60px;height:78px}.char-scene figcaption{font-size:17px;bottom:10px;left:12px}.char-scene{aspect-ratio:16/8}.char-person{padding:10px!important}.char-person>.char-portrait{width:48px;height:64px}.character-dialog .char-scene{aspect-ratio:16/8}.char-hero-choice .char-portrait{height:120px}}

/* Each training command has its own scene. */
#character-game .char-illustrated-action{padding:0;overflow:hidden;display:flex;flex-direction:column;text-align:left;align-self:stretch}
.char-action-art{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;display:block;background:#142b21}
.char-action-copy{display:block;padding:11px 10px;width:100%;font-size:13px;line-height:1.6}
.char-illustrated-action:hover .char-action-art{filter:brightness(1.1)}
.char-illustrated-action:focus-visible{outline:3px solid #ead48b;outline-offset:3px}
@media(max-width:600px){.char-action-copy{font-size:12px;padding:10px}.char-action-art{aspect-ratio:16/9}}
.char-history-list{max-height:65vh;overflow:auto}.char-historical-event{border-bottom:1px solid #63725b;padding:12px 0}.char-historical-event summary{cursor:pointer}.char-historical-event summary small{display:block;color:#b6c6b4}.char-historical-event .met{color:#87d2a7}.char-historical-event .unmet{color:#e5ae82}#char-history-settings{display:grid;gap:12px;margin-bottom:18px}#char-history-settings label{display:flex;align-items:center;gap:10px}#char-history-settings input{width:auto}.char-battle-dialog{width:min(1100px,96vw);max-width:1100px}.char-battle-board{position:relative;display:grid;grid-template-columns:repeat(9,1fr);grid-template-rows:repeat(6,1fr);aspect-ratio:3/2;background-size:cover;background-position:center;isolation:isolate}.char-battle-tile{padding:0!important;border:1px solid #d9dfc43a!important;border-radius:0!important;background:#12221920!important;min-width:0;min-height:0;color:#fff!important}.char-battle-tile.reachable{background:#4acec64a!important;box-shadow:inset 0 0 0 2px #81e8d7}.char-battle-tile small{background:#16281b55;float:right}.char-battle-piece{position:absolute;width:11.11%;height:16.666%;padding:0!important;background:transparent!important;border:0!important;z-index:2;min-width:0;min-height:0}.char-battle-piece.selected{filter:drop-shadow(0 0 7px #ffe181)}.char-unit-art{display:block;height:78%;background:url(assets/battle/infantry.webp) 0 0/400% 100% no-repeat}.char-unit-art.frame-1{background-position:33.333% 0}.char-unit-art.frame-2{background-position:66.666% 0}.char-unit-art.frame-3{background-position:100% 0}.char-battle-piece.enemy .char-unit-art{filter:hue-rotate(125deg)}.char-unit-tag{display:block;font:700 clamp(10px,1.2vw,15px) sans-serif;color:#fff;background:#102e28c9;position:absolute;bottom:0;width:100%}.enemy .char-unit-tag{background:#661e22c9}.char-unit-tag small{display:block;font-size:9px}.char-battle-piece.moving{animation:unit-move .55s ease-out}.char-battle-toolbar{display:grid;gap:10px}.char-battle-log{font-size:13px;max-height:140px;overflow:auto}.char-battle-dialog .char-scene{max-height:360px}.char-battle-dialog .char-scene img{height:100%;object-fit:cover}@keyframes unit-move{from{transform:translate(calc(var(--dx)*100%),calc(var(--dy)*100%))}to{transform:translate(0,0)}}@media(prefers-reduced-motion:reduce){.char-battle-piece.moving{animation:none}}@media(max-width:600px){.char-battle-board{aspect-ratio:1}.char-battle-toolbar button{font-size:12px;padding:8px}.char-battle-dialog{padding:12px}.char-unit-tag small{font-size:7px}.char-battle-dialog .char-scene{max-height:180px}}
.char-duel-stage{height:300px;position:relative;overflow:hidden;background:linear-gradient(#15312544,#08231833),url(assets/character-events/training.webp) center/cover}.char-duelist{position:absolute;height:90%;width:35%;bottom:0;background-size:400% 100%;background-repeat:no-repeat;animation:duel-breathe 2s infinite ease-in-out}.char-duelist.player{left:10%;background-image:url(assets/battle/duel-player.webp)}.char-duelist.enemy{right:10%;background-image:url(assets/battle/duel-enemy.webp);transform:scaleX(-1)}.striking .player{animation:duel-strike .65s ease-out}.striking .enemy{animation:duel-counter .65s ease-out}@keyframes duel-breathe{50%{bottom:2%}}@keyframes duel-strike{0%,100%{background-position:0 0;left:10%}30%,65%{background-position:calc(var(--pose)*33.333%) 0;left:20%}}@keyframes duel-counter{0%,100%{background-position:0 0;right:10%}30%,65%{background-position:100% 0;right:15%}}@media(prefers-reduced-motion:reduce){.char-duelist,.striking .player,.striking .enemy{animation:none}}@media(max-width:600px){.char-duel-stage{height:210px}}
.char-history-art{margin:12px 0}.char-history-art img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:8px;border:1px solid #b89755}.char-battle-piece.cannon:after,.char-battle-piece.ship:after{position:absolute;top:15%;left:20%;font-size:clamp(18px,3vw,34px);filter:drop-shadow(0 1px 2px #000)}.char-battle-piece.cannon:after{content:'砲';color:#efd891}.char-battle-piece.ship:after{content:'艦';color:#c7e4ee}
.char-battle-board{aspect-ratio:16/9}.character-dialog a,.char-history-list a{color:#e6ce88}@media(max-width:600px){.char-battle-board{aspect-ratio:1}}
