:root{--paper:#fff4d9;--card:#fffdf5;--ink:#203d3b;--muted:#687d70;--green:#00856d;--line:#c6d8ba;--rust:#d84e34;--soft:#d7f0b4;--shadow:0 5px 0 #1d594b18;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}
*{box-sizing:border-box}
body{margin:0}
button,input,select{font:inherit}
button,a,input,select{-webkit-tap-highlight-color:transparent}
button{cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.38}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #b68f42;outline-offset:3px}
button{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:10px;padding:11px 16px;font-size:13px;font-weight:650;transition:background .15s,transform .15s}
button:hover:not(:disabled){background:#ecebdc}
button:active:not(:disabled){filter:brightness(.97)}
a{color:var(--green)}
h1,h2,h3,p{margin-top:0}
h1{font-size:clamp(28px,4vw,44px);line-height:1.4;letter-spacing:-.035em}
h2{font-size:23px;letter-spacing:-.025em}
h3{font-size:16px}
p{line-height:1.9;font-size:14px}
small{font-size:11px}
.muted{color:var(--muted)}
.eyebrow{font-size:10px;font-weight:800;letter-spacing:.17em;color:var(--green);text-transform:uppercase}
.quiet{background:transparent}
.text-button{border:0;background:none;padding:8px 0;color:var(--green)}
.pill{display:inline-flex;align-items:center;padding:5px 9px;border:1px solid var(--line);border-radius:5px;font-size:10px;letter-spacing:.03em;gap:6px}
.pill.soft{background:var(--soft);border:0}
.row{display:flex;align-items:center;gap:10px}
.between{justify-content:space-between}
.wrap{flex-wrap:wrap}
.stack{display:grid;gap:16px}
.topbar{max-width:1120px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:24px 30px}
.brand{border:0;background:none;padding:0;display:flex;align-items:center;gap:9px;text-align:left}
.brand-mark{display:grid;place-items:center;width:34px;height:34px;border:2px solid var(--green);border-radius:50%;font-size:21px;color:var(--green)}
.brand-title{font-size:14px;font-weight:850;letter-spacing:.1em}
.brand-sub{display:block;font-size:8px;color:var(--muted);letter-spacing:.14em;margin-top:2px}
.top-actions{display:flex;align-items:center;gap:12px}
.sound{font-size:11px;padding:8px 10px;background:transparent}
.topnav{display:flex;gap:6px}
.topnav button{border:0;background:none;font-size:12px}
.topnav button.active{color:var(--green);background:#e6e9d8}
.workspace{max-width:1060px;margin:24px auto 70px;padding:0 28px}
.footer{max-width:1060px;margin:32px auto 0;padding:22px 28px;border-top:1px solid var(--line);font-size:10px;color:var(--muted);line-height:1.8}
.scene-frame{position:relative}
.narrow{max-width:660px;margin:24px auto}
.page-heading h1{font-size:30px}
.progress-dots{display:flex;gap:7px;margin-bottom:30px}
.progress-dots span{height:4px;width:40px;border-radius:2px;background:var(--line)}
.progress-dots .done{background:var(--green)}
.choices{display:grid;gap:12px}
.choice{display:flex;gap:18px;align-items:center;padding:20px;text-align:left;border-radius:12px;background:var(--card);min-height:86px}
.choice-icon{color:var(--green);font-size:25px;width:32px;text-align:center}
.choice strong{display:block;font-size:16px;margin-bottom:6px}
.choice small{font-size:12px;font-weight:400;color:var(--muted)}
.choice-arrow{margin-left:auto;color:#9fa58e}
.form-grid{display:grid;gap:20px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:25px}
label{display:block;font-size:12px;font-weight:650;line-height:1.8}
input,select{width:100%;border:1px solid #cfD3be;background:#fffef7;border-radius:8px;padding:11px 12px;color:var(--ink);font-size:14px;margin-top:6px}
.form-actions{display:flex;justify-content:space-between;gap:12px;margin-top:24px}
.recommendation{background:#e9ecd9;border:1px solid #d4dbc0;padding:18px 22px;border-radius:10px;margin-bottom:22px}
.recommendation p{font-size:12px;margin:8px 0 0}
.editor-grid{display:grid;align-items:start}
.editor-panel{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:20px}
.team-name-row{display:flex;align-items:end;gap:8px}
.team-name-row label{flex:1}
.team-name-row button{margin-bottom:0;height:43px}
.role-cards{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:16px 0}
.role-card{padding:14px;text-align:left;min-height:108px;border-radius:10px;background:#f1efdf}
.role-card .eyebrow{font-size:9px}
.role-card strong{display:block;font-size:16px;margin:8px 0}
.role-card small{font-size:10px;line-height:1.7;display:block;color:var(--muted)}
.tabs{display:flex;gap:5px;background:#ebe9dc;padding:4px;border-radius:9px;margin:18px 0}
.tabs button{flex:1;border:0;background:none;padding:10px}
.tabs .active{background:var(--card);box-shadow:0 2px 5px #303d3210}
.field-board{position:relative;height:320px;background:#b7c69c;border:5px solid #e9dfc7;border-radius:85px 85px 10px 10px;overflow:hidden}
.field-board svg{position:absolute;inset:0;width:100%;height:100%}
.position{position:absolute;transform:translate(-50%,-50%);padding:5px 8px;min-width:74px;max-width:100px;background:#fff9e9;border:1px solid #8b9b73;border-radius:6px;box-shadow:0 3px 0 #42603a19;text-align:center}
.position .position-title{font-size:9px;color:#758068;font-weight:400}
.position strong{display:block;font-size:12px;white-space:nowrap}
.position small{display:block;font-size:9px;color:#b27449}
.position.locked{border-color:#3f664b;background:#f4f5dc}
.slots-label{font-size:10px;color:var(--muted);margin:17px 0 6px;font-weight:700}
.slot-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.slot-small{padding:9px 4px;font-size:11px;background:#f0eddf;line-height:1.8}
.slot-small strong{display:block;font-size:12px}
.slot-small small{display:block;font-size:9px}
.order-row{display:flex;gap:12px;align-items:center;border-bottom:1px solid var(--line);padding:10px 0}
.order-number{font-size:19px;width:20px;text-align:center;color:#99a181}
.order-main{flex:1;font-size:13px}
.order-main small{display:block;color:var(--muted);margin-top:4px}
.order-row button{padding:7px 10px}
.tool-card{padding:18px 0;border-bottom:1px solid var(--line)}
.tool-card:last-child{border:0;padding-bottom:0}
.tool-card h3{font-size:13px;margin:0 0 7px}
.tool-card p{font-size:11px;color:var(--muted);line-height:1.8;margin-bottom:12px}
.tool-card .row button{flex:1;padding:10px 8px;font-size:11px}
.undo-tools{margin-top:10px;display:flex;gap:7px}
.undo-tools button{padding:8px 6px;font-size:10px;flex:1}
.save-bar{margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}
.save-bar button{width:100%;padding:14px}
.save-bar p{font-size:10px;line-height:1.7;color:var(--muted);margin:9px 0 0}
.editor-summary{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0;font-size:10px;color:var(--muted)}
dialog{width:540px;max-width:calc(100vw - 24px);max-height:88dvh;border:1px solid #c9cbb4;border-radius:16px;padding:22px;background:var(--paper);color:var(--ink);box-shadow:0 24px 100px #24382340}
dialog::backdrop{background:#26392d77;backdrop-filter:blur(3px)}
.dialog-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;gap:12px}
.dialog-top h2{font-size:20px;margin:0}
.dialog-top button{padding:5px 10px}
.dialog-tools{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:14px}
.dialog-tools button{font-size:11px;padding:8px 10px}
.picker-list{display:grid;gap:8px;margin-top:16px}
.player-option{padding:14px;text-align:left;background:#f8faec;line-height:1.7}
.player-option strong{font-size:14px}
.player-option small{display:block;color:var(--muted);font-weight:400}
.player-option.outside{background:#e8e7df;color:#77796d}
.player-option .pill{float:right;font-size:9px;margin-left:8px}
.match-wrap{max-width:690px;margin:auto}
.match-scene{position:relative}
.match-controls{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:#eae8d8;border:1px solid var(--line);gap:10px}
.speeds{display:flex;gap:4px}
.speeds button{padding:6px 10px;font-size:11px;background:none;border:0}
.speeds button.active{background:var(--green);color:#fff}
.log-heading{padding:19px 2px 10px;display:flex;align-items:center;justify-content:space-between}
.log-heading strong{font-size:12px}
.log-heading button{font-size:11px;padding:5px 10px}
.live-log{height:270px;overflow:auto;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:0 20px;overscroll-behavior:contain}
.log-item{display:grid;grid-template-columns:52px 1fr;gap:14px;padding:17px 0;border-bottom:1px solid #e6e6d6;font-size:12px;line-height:1.8}
.log-item:last-child{border:0}
.log-item time{font-size:10px;color:var(--muted)}
.log-item.scoring{color:var(--rust)}
.log-item small{display:block;color:var(--muted);font-size:10px}
.result-hero .outcome{font-size:11px;letter-spacing:.25em;font-weight:800}
.result-hero h1{font-size:30px}
.result-hero .big-score{font-size:60px;letter-spacing:.03em;font-weight:800;line-height:1.3;font-variant-numeric:tabular-nums}
.result-hero .big-score span{font-size:29px;padding:0 18px;color:#a2aa90}
.result-actions{display:flex;gap:10px;justify-content:center;margin-top:20px}
.result-panel{padding:22px;background:var(--card);border:1px solid var(--line);border-radius:12px;margin:16px 0}
.result-panel h3{margin-bottom:16px}
.table-scroll{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:11px;white-space:nowrap}
th,td{padding:10px 8px;text-align:right;border-bottom:1px solid #e8e7d8;font-variant-numeric:tabular-nums}
th{color:var(--muted);font-size:10px;font-weight:500}
th:first-child,td:first-child{text-align:left}
tbody tr:last-child td{border-bottom:0}
.line-score th,.line-score td{text-align:center;padding:9px 6px}
.line-score td:last-child{font-weight:800;background:#eef0e2}
.mvp-card{display:flex;gap:20px;align-items:center}
.mvp-icon{font-size:35px;color:#a88b4b;background:#f3ecd5;border:1px solid #e2d5b2;width:65px;height:65px;display:grid;place-items:center;border-radius:50%;flex-shrink:0}
.mvp-card h3{margin:7px 0;font-size:20px}
.mvp-card p{font-size:12px;color:var(--muted);margin:0}
.details-log{max-height:420px;overflow:auto}
.rank-row{display:flex;align-items:center;gap:18px;padding:20px 0;border-bottom:1px solid var(--line)}
.rank-place{font-size:20px;width:25px;color:#98a083}
.rank-main{flex:1}
.rank-main strong{font-size:15px}
.rank-main small{display:block;color:var(--muted);font-size:11px;margin-top:6px}
.rank-rating{font-size:17px;font-weight:750}
.history-row{padding:14px 0;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:14px}
.history-row .score{font-weight:800;white-space:nowrap}
.history-row .name{flex:1;font-size:12px}
.history-row small{display:block;color:var(--muted);font-size:10px;margin-top:4px}
.roster-mini{display:grid;grid-template-columns:1fr 1fr;gap:8px;font-size:12px;margin:18px 0}
.roster-mini div{padding:9px;background:#eeedde;border-radius:6px}
.roster-mini small{color:var(--muted);margin-right:8px}
#toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,15px);background:#354e3d;color:#fff8e7;padding:12px 20px;border-radius:9px;box-shadow:0 6px 24px #26392c28;max-width:calc(100vw - 32px);font-size:12px;line-height:1.7;z-index:50;opacity:0;pointer-events:none;transition:.2s}
#toast.show{opacity:1;transform:translate(-50%,0)}
@media(min-width:760px){.editor-tools{position:sticky;top:20px}
}
@media(max-width:760px){.topbar{padding:18px 18px 10px}
.topnav{display:none}
.top-actions{gap:5px}
.workspace{margin:16px auto 35px;padding:0 18px}
.editor-panel{padding:15px}
.field-board{height:310px}
.role-card{padding:12px}
.editor-tools{display:grid;grid-template-columns:1fr;gap:0}
.editor-tools .tool-card:first-child{padding-top:0}
.page-heading h1{font-size:26px}
.footer{padding:20px 18px;margin-top:24px}
.match-controls{padding:10px 8px;gap:5px}
.speeds button{padding:6px 8px}
.live-log{height:260px;padding:0 14px}
.match-wrap{margin:0 -3px}
.result-panel{padding:16px}
.result-hero h1{font-size:24px}
.result-actions button{font-size:11px;flex:1;padding:12px 8px}
.rank-row{gap:11px}
.rank-main strong{font-size:13px}
.rank-row button{padding:9px;font-size:10px}
.brand-title{font-size:12px}
.pill{font-size:9px}
.form-grid{padding:20px}
.mvp-card{gap:15px}
.mvp-card h3{font-size:18px}
}
.brand-mark{background:#ffdc48;color:#203d3b;border-color:#203d3b;box-shadow:2px 2px 0 #203d3b}
.scene-frame{border:3px solid #245b4c;box-shadow:0 5px 0 #245b4c22}



.match-scene{overflow:hidden}
.result-hero .outcome{display:inline-block}
.scene-frame{padding:0;border-width:3px;background:#265d50;border-radius:10px;overflow:hidden}
.scene-frame canvas{display:block;width:100%;height:auto;aspect-ratio:4/3;image-rendering:pixelated}
.uniform-picker{display:flex;align-items:center;gap:18px;padding:12px 0 20px;border-bottom:1px solid var(--line);margin-bottom:18px}.uniform-picker canvas{width:120px;height:75px;flex:none;image-rendering:pixelated;background:#e1ebd8;border-radius:8px}.uniform-picker label{display:grid;gap:8px;font-size:12px;flex:1;min-width:0}.uniform-picker select{width:100%;min-width:0}.uniform-picker small{font-size:10px;color:var(--muted);line-height:1.6}
.match-wrap{max-width:960px;container-type:inline-size}
.match-scene{border-radius:10px;container-type:inline-size}
.match-scene .scene-frame{border-radius:10px}


.broadcast-score{display:grid;grid-template-columns:.65fr 1.3fr 1fr;align-items:center;gap:2cqw;background:#0c1929f2;color:#f9f6e8;border:1px solid #b8d0ce88;border-top:3px solid #efb84e;border-radius:5px;padding:1.1cqw 1.5cqw;font-variant-numeric:tabular-nums}
.bug-inning{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #ffffff30;padding-bottom:.6cqw;margin-bottom:.6cqw}
.bug-inning>strong{font-size:clamp(16px,3.1cqw,30px);line-height:1.1}.bug-inning small{font-size:clamp(10px,1.7cqw,16px);margin-left:.5cqw}.bug-inning>span{font-size:clamp(8px,1.2cqw,12px);color:#b5c5ce}
.bug-team{display:grid;grid-template-columns:1.5cqw 1fr 3cqw;gap:.5cqw;align-items:center;padding:.45cqw 0;font-size:clamp(10px,1.65cqw,16px)}
.bug-team>strong{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.bug-team>b{font-size:2.5cqw;text-align:center;line-height:1}.bug-team>span{color:#ffcd54}.bug-team.batting>strong{color:#ffdc70}
.bug-situation{display:flex;justify-content:space-between;border-top:1px solid #ffffff30;margin-top:.7cqw;padding-top:.8cqw;align-items:center}
.count{display:flex;align-items:center;gap:.7cqw;height:clamp(13px,2cqw,20px);font-size:clamp(10px,1.4cqw,14px)}.count>b{width:clamp(10px,1.6cqw,16px)}.count i{width:clamp(6px,1.15cqw,11px);height:clamp(6px,1.15cqw,11px);border-radius:50%;background:#3d4a56;border:1px solid #a4b1ba66}.count.b .lit{background:#5bd499}.count.s .lit{background:#ffd45d}.count.o .lit{background:#ff6867}
.runner-diamond{position:relative;width:7cqw;height:6.3cqw;margin-right:2cqw}.runner-diamond i{position:absolute;width:1.9cqw;height:1.9cqw;transform:rotate(45deg);background:#344552;border:1px solid #a8bdc4}.runner-diamond .occupied{background:#ffcb4d;border-color:#ffe69b}.base-1{right:0;top:2.2cqw}.base-2{left:2.55cqw;top:0}.base-3{left:0;top:2.2cqw}.runner-diamond small{position:absolute;bottom:-.3cqw;left:1.6cqw;font-size:1cqw;color:#bdc8cd}
.broadcast-players{display:grid;grid-template-columns:1fr 1fr;gap:2%;color:#fff9e8;margin-top:8px}
.broadcast-player{display:flex;flex-direction:column;padding:1cqw 1.8cqw;background:linear-gradient(100deg,#0c1929f5,#0c1929df);border-left:4px solid #ef9a44;box-shadow:0 3px 10px #0003;border-radius:3px;gap:.4cqw}.broadcast-player.pitcher{border-color:#51c6c2}.broadcast-player>small{font-size:clamp(9px,1.4cqw,14px);color:#ecc284}.broadcast-player.pitcher>small{color:#8bddda}.broadcast-player small b{font-weight:400;margin-left:1cqw;color:#fff9e8}.broadcast-player>strong{font-size:clamp(13px,2.5cqw,24px);line-height:1.2}.broadcast-player>span{font-size:clamp(9px,1.4cqw,14px);color:#c4d5dc;white-space:nowrap}
.match-card-button{font-size:11px;padding:7px 12px;margin-left:auto}

.skill-effect{display:grid;gap:3px;padding:7px 10px;background:#e5ede2;border-left:3px solid #387463;font-size:11px;line-height:1.5;flex:1;min-width:180px}.skill-effect.opponent{border-color:#856690;background:#eee7ed}.skill-effect span{color:#55625a}.skill-impact{width:100%;font-size:12px;color:#8d5035}.log-bridge{padding-bottom:5px;color:#7c6843!important}.broadcast-player{min-width:0}.broadcast-player>span{white-space:normal}.bug-inning{border:0;margin:0;padding:0;display:grid;gap:4px}.bug-situation{border:0;margin:0;padding:0}
@media(max-width:500px){.skill-effect{min-width:140px;font-size:10px}.broadcast-score{padding:10px}.bug-team>b{font-size:14px}}
.match-intro{max-width:960px;margin:auto}
.match-intro-heading{text-align:center;padding:10px 0 24px}
.match-intro-heading h1{font-size:clamp(25px,3vw,38px);margin:12px 0 22px}
.matchup-versus{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;padding:22px;background:#fffdf5;border:3px solid #245b4c;border-radius:16px;box-shadow:0 5px #245b4c22}
.matchup-versus strong{font-size:clamp(16px,2.4vw,25px)}
.matchup-versus b{font-size:38px;font-style:italic;color:#d85135;text-shadow:2px 2px #ffdb53;transform:rotate(-9deg)}
.match-intro-heading p{margin:18px 0 0;color:var(--muted);font-size:12px}
.matchup-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.matchup-team{background:#fffdf5;border:2px solid #245b4c;border-radius:16px;overflow:hidden;box-shadow:0 5px #245b4c22}
.matchup-team-top{padding:20px;background:#176c80;color:#fff9df;position:relative}
.matchup-team.home .matchup-team-top{background:#c55135}
.matchup-team-top>span:first-child{font-size:10px;font-weight:800;letter-spacing:.15em;opacity:.85}
.matchup-team-top h2{font-size:22px;margin:10px 0}
.matchup-style{display:inline-block;border:1px solid #ffffff55;border-radius:6px;padding:5px 10px;font-size:12px}
.matchup-leaders{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:20px;border-bottom:1px solid var(--line);padding-bottom:14px}
.matchup-leaders small{color:#66776c;font-size:9px;letter-spacing:.05em}
.matchup-leaders h3{font-size:17px;margin:6px 0}
.matchup-leaders p{font-size:11px;line-height:1.7;margin:0}
.lineup-title{font-size:12px;letter-spacing:.06em;margin:20px 20px 10px;color:#146b63}
.lineup-title span{display:block;font-size:9px;font-weight:400;letter-spacing:0;color:var(--muted);margin-top:4px}
.starting-lineup{padding:0 20px;margin:0;list-style:none}
.starting-lineup li{display:grid;grid-template-columns:22px 36px 1fr;gap:7px;align-items:center;border-bottom:1px solid #e7e7cd;padding:10px 0}
.lineup-number{font-size:20px;font-weight:900;font-style:italic;color:#dc6545;grid-row:span 2}
.lineup-position{font-size:10px;background:#e3eed9;padding:3px;border-radius:3px;text-align:center}
.starting-lineup strong{font-size:14px}
.starting-lineup li>small{grid-column:2/4;font-size:10px;color:var(--muted)}
.matchup-reserves{padding:4px 20px 20px}.matchup-reserves h3{font-size:12px;margin:18px 0 8px;color:#146b63}
.matchup-reserves>div{display:inline-flex;flex-direction:column;margin-right:15px;gap:4px}
.matchup-reserves small{color:var(--muted);font-size:9px}.matchup-reserves strong{font-size:12px}.matchup-reserves p{font-size:12px;margin:0}
.match-start-bar{position:sticky;bottom:12px;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 20px;margin-top:24px;background:#fff9e9ed;border:2px solid #245b4c;border-radius:14px;box-shadow:0 5px 24px #164b4422;backdrop-filter:blur(8px);z-index:4}
.match-start-bar .primary{font-size:18px;padding:14px 38px}
.match-start-bar small{display:block;text-align:center;font-size:10px;margin-top:8px;color:var(--muted)}
/* 編成は名前と短いタグを主役にし、補足説明は開いたときだけ読む。 */
.editor-grid{grid-template-columns:minmax(0,1fr) 290px;gap:20px}
.editor-panel{min-width:0}
.editor-heading{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--paper);border-bottom:1px solid var(--line);padding:12px 0;margin-bottom:16px}.editor-heading>div:first-child{display:flex;align-items:baseline;gap:14px}.editor-heading h1{font-size:24px;margin:0}.editor-heading .muted{font-size:14px;white-space:nowrap}.editor-save{text-align:right}.editor-save small{display:block;margin-top:4px}.editor-save small:empty{display:none}
.editor-tools .profile-heading{display:block}.editor-tools .profile-heading small{display:block;margin-top:5px}.editor-tools .team-profile{padding:12px}.editor-tools .recommendation{padding:12px;margin:12px 0}.editor-tools{align-self:start}
@media(min-width:951px){.editor-tools{position:static}}
@media(max-width:500px){.editor-heading h1{font-size:20px}.editor-heading>div:first-child{display:block}.editor-heading .muted{font-size:12px}.editor-save button{padding:11px 14px}}
.editor-panel label,.dialog-tools button,.undo-tools button,.slots-label,.editor-summary,.save-bar p{font-size:14px}
.editor-panel input,.editor-panel select,#picker input,#picker select{font-size:16px}
.role-card strong{font-size:19px}.role-card .eyebrow{font-size:14px;letter-spacing:0}
.role-card small{font-size:13px;line-height:1.5;margin-top:8px;color:#42594d}
.effect-tag,.ability-tag{display:inline-flex;align-items:center;white-space:nowrap;font-size:14px;font-weight:750;border-radius:6px;padding:3px 8px;background:#e2ebdf;color:#254b3e;line-height:1.5}
.effect-tag{background:#d7ebe5;color:#175c4e}
.ability-power,.ability-discipline,.ability-contact{background:#fff0cf;color:#77500e}
.ability-speed,.ability-smallBall{background:#ddecf5;color:#245576}
.ability-stuff,.ability-control,.ability-strikeout{background:#ece3f4;color:#634080}
.player-tags{display:inline-flex;flex-wrap:wrap;gap:5px;justify-content:flex-end}
.ability-tag{gap:7px;background:transparent;padding:2px 0}
.team-profile{border:1px solid var(--line);border-radius:10px;padding:15px;background:#f7f7ed;margin:18px 0}
.profile-heading{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:14px}.profile-heading h3{margin:0;font-size:17px}.profile-heading small{font-size:12px;color:var(--muted)}
.compact-help{font-size:14px;color:#496052;margin:12px 0}
.compact-help summary{cursor:pointer;width:fit-content;padding:5px 0}
.compact-help p{font-size:14px;line-height:1.6;margin:8px 0}
.field-board{height:370px}.position{min-width:90px;max-width:120px;padding:7px 9px}
.position strong,.slot-small strong{font-size:16px}.position .position-title,.slot-small .position-title{font-size:13px;color:#4c6045}
.position small{font-size:12px}.slot-small{min-height:68px}.order-main{font-size:17px}.order-main small{font-size:13px}
#picker{width:620px}.dialog-tools button{min-height:42px}.picker-note{font-size:14px;margin:8px 0 16px;color:#496052}
.player-option{padding:15px;text-align:left;border-radius:10px;line-height:1.4;background:var(--card)}
.player-option-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
.player-option strong{font-size:19px;white-space:nowrap}
.player-option-meta{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:9px;font-size:14px;font-weight:400;color:#496052}
.position-tags{font-weight:750;letter-spacing:.08em}.swap-tag{margin-left:auto;color:#496052}
.fit-warning{color:#83521c;font-weight:700}.player-option.outside{background:#f0eee5;color:var(--ink);border-style:dashed}
.skill-guide-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:12px;margin:16px 0}
.skill-guide-grid article{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:14px}
.skill-guide-grid h3{margin:0 0 10px}.skill-guide .skill-guide-effect{font-size:15px;font-weight:700;color:var(--ink)}
.skill-guide dl{display:grid;grid-template-columns:max-content 1fr;gap:7px 12px;font-size:14px;line-height:1.6;margin:10px 0}
.skill-guide dt{color:#5d7165}.skill-guide dd{margin:0}.skill-guide .role-key{padding:12px;background:#edf0df;border-radius:8px}
.effect-tag.skill-power{background:#fff0cf;color:#77500e}.effect-tag.skill-contact{background:#e2ebdf;color:#254b3e}
.effect-tag.skill-speed{background:#ddecf5;color:#245576}.effect-tag.skill-defense{background:#d9e9dd;color:#27553b}
.effect-tag.skill-pitching{background:#ece3f4;color:#634080}.effect-tag.skill-small_ball{background:#f4e3d8;color:#795235}
.starting-lineup li{grid-template-columns:24px 38px minmax(0,1fr) auto;gap:8px;padding:12px 0}
.lineup-number{grid-row:auto}.lineup-position{font-size:13px}.starting-lineup strong{font-size:17px}
.matchup-leaders small{font-size:13px;letter-spacing:0;line-height:1.6}.matchup-leaders h3{font-size:19px}.matchup-leaders p.effect-tag{font-size:14px}
.lineup-title,.matchup-reserves h3{font-size:16px}.matchup-reserves strong,.matchup-reserves p{font-size:16px}.matchup-reserves small{font-size:13px}
@media(max-width:950px){.editor-grid{grid-template-columns:1fr}.editor-tools{position:static}.starting-lineup li{grid-template-columns:24px 38px minmax(0,1fr)}.starting-lineup .player-tags{grid-column:3;justify-content:flex-start}.starting-lineup .player-tags:empty{display:none}}
@media(max-width:500px){.workspace{padding:0 12px}.editor-panel{padding:12px}.field-board{height:350px}.position{min-width:78px;max-width:100px;padding:6px}.position strong{font-size:14px}.position .position-title{font-size:12px}.role-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.role-card{min-height:0;padding:10px}.role-card strong{font-size:16px}.slot-small strong{font-size:14px}.slot-small{padding:8px 2px}.player-option{padding:12px}.player-option strong{font-size:18px}.player-option-top{flex-wrap:wrap}.player-option-meta{gap:9px}.ability-tag,.effect-tag{font-size:13px}.uniform-picker canvas{width:90px;height:auto}}
#match-card{width:920px}
@media(max-width:650px){.matchup-grid{grid-template-columns:1fr}.matchup-versus{padding:15px 10px;gap:10px}.matchup-versus b{font-size:28px}.match-start-bar{padding:12px;bottom:8px}.match-start-bar .primary{padding:12px 22px;font-size:16px}.match-start-bar>.quiet{font-size:11px;padding:10px 4px}.matchup-team-top{padding:16px 20px}}

/* 結果はプレー決着後だけ、球場の中央へ大きく表示する。 */
.watch-layout .broadcast-score{padding:6px 10px;border-radius:6px 6px 0 0}
.play-result{position:absolute;z-index:5;top:50%;left:50%;transform:translate(-50%,-50%);width:max-content;max-width:calc(100% - 24px);margin:0;text-align:center;pointer-events:none}
.play-result .result-box{position:relative;display:block;padding:14px 20px;background:#172d3bf5;color:#fff5d6;border:3px solid #ffcf64;border-radius:10px;box-shadow:0 4px 0 #10202d,0 8px 24px #10202d66;font-size:clamp(34px,8.6cqw,68px);font-weight:900;line-height:1.2;overflow-wrap:anywhere}
.play-result:empty{display:none}
.watch-layout .match-scene,.watch-layout .scene-frame{border-radius:0}
.watch-layout .scene-frame{border-width:0;box-shadow:none}
.watch-layout .broadcast-players{margin:0;gap:1px;min-height:126px}
.watch-layout .broadcast-player{border-radius:0;box-shadow:none;padding:10px 12px;gap:4px}
.watch-layout .broadcast-player>small{font-size:clamp(13px,1.7cqw,16px)}
.watch-layout .broadcast-player>strong{font-size:clamp(22px,2.8cqw,28px);line-height:1.3}
.watch-layout .broadcast-player>span{font-size:clamp(14px,1.8cqw,17px);line-height:1.4}
.active-skills{display:grid;grid-template-columns:1fr 1fr;gap:8px;position:absolute;bottom:6px;left:8px;right:8px;margin:0;align-items:end}
.active-skills:empty{display:none}
.atbat-results{display:flex;flex-wrap:wrap;gap:4px;align-content:start}
.atbat-result{font-size:16px;line-height:1.4;font-weight:700;white-space:nowrap;padding:2px 5px;border-radius:3px}
.atbat-result.hit{color:#145333;background:#d9edcc}
.atbat-result.out{color:#833c32;background:#f5dfd4}
.atbat-result.onbase{color:#245671;background:#dcecf2}
.watch-layout .skill-effect{min-width:0;padding:3px 8px;gap:0;font-size:14px;line-height:1.2;border-radius:5px;background:#e5ede2f5;box-shadow:0 1px 4px #142d3c33}
.watch-layout .skill-effect.opponent{background:#eee7edf5}
.watch-layout .skill-effect span{font-size:13px}
.skill-effect.defense{grid-column:1;grid-row:1}.skill-effect.offense{grid-column:2;grid-row:1}
.watch-layout .bug-team{font-size:clamp(13px,1.7cqw,17px)}
.watch-layout .bug-team>b{font-size:clamp(17px,2.6cqw,26px)}
.watch-layout .bug-inning>strong{font-size:clamp(20px,3.1cqw,30px)}
.watch-layout .count{font-size:13px;height:18px}
.watch-layout .speeds button{font-size:13px}
.watch-layout .log-item{font-size:14px}.watch-layout .log-item small,.watch-layout .log-item time{font-size:12px}
@media(max-width:500px){.play-result .result-box{padding:12px 14px}.watch-layout .broadcast-player{padding:9px 10px}}

/* 全打席の簡易進行と、半イニングを続けて見る注目場面。 */
.watch-toolbar{display:flex;align-items:center;gap:12px;margin-bottom:10px;font-size:15px;flex-wrap:wrap}.watch-toolbar>strong{margin-left:auto;color:var(--green)}
.watch-stage{position:relative;background:#dae2c2;overflow:hidden}
.watch-stage [hidden]{display:none!important}
.watch-overlay{position:absolute;inset:0;z-index:8;background:#14392df5;color:#fff8df;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;padding:25px;pointer-events:none}
.watch-overlay:empty{display:none}.watch-overlay small{font-size:18px;color:#cbdaba}.watch-overlay strong{font-size:clamp(26px,5vw,42px);line-height:1.3}.watch-overlay span{font-size:clamp(16px,2.5vw,23px);line-height:1.6;max-width:540px}
.quick-match{display:grid;grid-template-columns:minmax(155px,.8fr) minmax(0,2.6fr) minmax(155px,.8fr);min-height:350px;background:#416e56}
.quick-lineup{min-width:0;padding:10px 6px;background:#e3e8ce}.quick-lineup h3{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0 4px 8px}
.quick-lineup ol{padding:0;margin:0;list-style:none}.quick-lineup li{display:flex;gap:7px;min-height:37px;padding:5px;border-radius:5px;font-size:14px;align-items:center}.quick-lineup li>span{color:#76866c;font-size:16px}.quick-lineup li>div{min-width:0}
.quick-lineup strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:15px}.quick-lineup small{display:flex;gap:3px;flex-wrap:wrap;margin-top:3px}.quick-lineup small:empty{display:none}.quick-lineup small b{font-size:11px;line-height:1.3;font-weight:500;color:#6b6656;background:#f4f0e2;border-radius:2px;padding:1px 3px}.quick-lineup small b.hit{background:#f1d58a;color:#3e542a}
.quick-lineup .at-bat{background:#315d49;color:#fff6d5}.quick-lineup .at-bat>span{color:#e9d894}
.quick-diamond{position:relative;align-self:center;min-width:0;background:#406c53}.quick-diamond canvas{display:block;width:100%;height:auto;image-rendering:pixelated}
.quick-caption{position:absolute;top:8px;left:6%;right:6%;text-align:center;color:#fff5d5;pointer-events:none;text-shadow:0 2px 4px #143b35}.quick-result{display:inline-block;font-size:32px;line-height:1.3;color:#ffe69c;background:#183d3ae6;padding:4px 10px;border:1px solid #e6ca80;border-radius:4px}.quick-result:empty{display:none}
.is-quick .count.b,.is-quick .count.s{display:none}
.watch-layout .speeds>span{font-size:14px;margin-right:5px}
.watch-toolbar .match-card-button{margin-left:0}.watch-layout .match-controls{margin:0 0 10px}.quick-match{padding-bottom:44px}.quick-lineup small{flex-wrap:nowrap;overflow:hidden}.quick-lineup small b{flex-shrink:0}
.is-quick .broadcast-score{display:none}
.quick-lineup{align-self:stretch}.quick-diamond{align-self:start}
.quick-status{background:linear-gradient(#244f47,#163b38);color:#fff9df;text-align:center;padding:0 8px 12px;border-top:1px solid #749579}
.quick-score{display:flex;justify-content:center;align-items:center;gap:22px;font-variant-numeric:tabular-nums;line-height:1.1;padding:6px 0}
.quick-score b{font-size:clamp(38px,5cqw,60px);min-width:1.3em}.quick-score b.batting{color:#ffe39a}.quick-score>span{font-size:28px;color:#a5b6a4}
.quick-situation{display:flex;justify-content:center;align-items:center;gap:24px}.quick-situation>strong{font-size:24px}.quick-situation>span{display:flex;align-items:center;gap:6px;font-size:12px;color:#bacfc0}.quick-situation i{width:10px;height:10px;border-radius:50%;background:#698079}.quick-situation i.lit{background:#ffb467;box-shadow:0 0 4px #ffd37f}
.quick-scoreboard{grid-column:1/-1;background:#183d3a;padding:10px;overflow-x:auto;border-top:2px solid #91a57c}
.quick-scoreboard table{width:100%;border-collapse:collapse;color:#f5f0d9;font-size:16px;table-layout:fixed;font-variant-numeric:tabular-nums}
.quick-scoreboard th,.quick-scoreboard td{padding:7px 2px;text-align:center;border:1px solid #68827766;white-space:nowrap;background:transparent}
.quick-scoreboard thead th{font-size:12px;color:#bac9b3;background:#244d46}.quick-scoreboard tr>th:first-child{width:24%;overflow:hidden;text-overflow:ellipsis;text-align:left;padding-left:8px}
.quick-scoreboard tbody th{font-size:14px;color:#f5f0d9}.quick-scoreboard .total{font-weight:850;color:#ffdf88;background:#2f5447}.quick-scoreboard .current{background:#f0d68e;color:#193a36;font-weight:800}.quick-scoreboard tr.batting>th{color:#ffdf88}
.watch-overlay.is-entry{background:linear-gradient(110deg,#092d3877,transparent 75%);padding:0;overflow:hidden}
.watch-entry{--entry-accent:#ebca79;width:100%;display:flex;align-items:center;justify-content:center;gap:24px;padding:26px 20px;background:repeating-linear-gradient(135deg,#ffffff04 0 2px,transparent 2px 14px),linear-gradient(100deg,#173e43f2,#245650ed 65%,#153a43b8);border-block:2px solid var(--entry-accent);box-shadow:0 12px 36px #09282e66;animation:entry-arrive .28s ease-out both;position:relative}
.watch-entry.defend{--entry-accent:#91c8e1;background-color:#244561}.watch-entry:before{content:'';position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,#fff8c525 48%,transparent 65%);animation:entry-shine 1.1s ease-out both;pointer-events:none}
.entry-diamond{width:130px;flex-shrink:0;color:#b5cbb2;position:relative}.entry-diamond svg{width:100%;display:block;filter:drop-shadow(0 2px 6px #122e36)}.entry-diamond>span{position:absolute;top:43%;left:0;right:0;font-size:16px;font-weight:800;color:#fff4d7}
.entry-copy{text-align:left}.watch-entry .entry-copy>small{display:block;color:var(--entry-accent);font-size:18px;font-weight:800;letter-spacing:.16em}.watch-entry .entry-copy>strong{display:block;font-size:42px;line-height:1.5;white-space:nowrap}.entry-copy em{font-size:20px;font-style:normal;margin-left:14px;color:#c6d5c2}.watch-entry .entry-copy>span{font-size:20px}.entry-score{font-size:44px;font-weight:850;font-variant-numeric:tabular-nums;white-space:nowrap;display:flex;align-items:center;gap:12px;margin-left:16px}.watch-entry .entry-score>small{font-size:20px}
@keyframes entry-arrive{from{transform:translateX(-24px);opacity:0}to{transform:translateX(0);opacity:1}}@keyframes entry-shine{from{transform:translateX(-80%)}to{transform:translateX(80%)}}
@container(max-width:360px){.entry-score{display:none}}
@container(max-width:640px){.quick-match{grid-template-columns:1fr}.quick-diamond{grid-column:1;grid-row:1}.quick-lineup{display:none}.quick-lineup.batting{display:block;grid-column:1;grid-row:2;padding:5px}.quick-lineup.batting h3{display:none}.quick-lineup.batting ol{display:grid;grid-template-columns:1fr 1fr;gap:5px}.quick-lineup li:not(.at-bat):not(.on-deck){display:none}.quick-lineup .at-bat{order:-1}.quick-lineup .on-deck:before{content:'次';font-size:12px}}
@container(max-width:600px){.quick-scoreboard{padding:6px 3px}.quick-scoreboard th,.quick-scoreboard td{padding:6px 1px;font-size:13px}.quick-scoreboard tbody th{font-size:12px}.quick-scoreboard tr>th:first-child{width:22%;padding-left:3px}.watch-entry{gap:8px;padding:18px 10px}.entry-diamond{width:82px}.entry-diamond>span{font-size:12px}.watch-entry .entry-copy>strong{font-size:28px}.entry-copy em{font-size:16px;margin-left:8px}.watch-entry .entry-copy>small{font-size:14px}.watch-entry .entry-copy>span{font-size:16px}.entry-score{font-size:28px;margin-left:0;gap:5px}}
@media(max-width:600px){.quick-scoreboard{padding:6px 3px}.quick-scoreboard th,.quick-scoreboard td{padding:6px 1px;font-size:13px}.quick-scoreboard tbody th{font-size:12px}.quick-scoreboard tr>th:first-child{width:22%;padding-left:3px}.watch-entry{gap:8px;padding:18px 10px}.entry-diamond{width:82px}.entry-diamond>span{font-size:12px}.watch-entry .entry-copy>strong{font-size:28px}.entry-copy em{font-size:16px;margin-left:8px}.watch-entry .entry-copy>small{font-size:14px}.watch-entry .entry-copy>span{font-size:16px}.entry-score{font-size:28px;margin-left:0;gap:5px}}
@media(max-width:760px){.quick-match{grid-template-columns:1fr}.quick-diamond{grid-column:1;grid-row:1}.quick-lineup{display:none}.quick-lineup.batting{display:block;grid-column:1;grid-row:2;padding:5px}.quick-lineup.batting h3{display:none}.quick-lineup.batting ol{display:grid;grid-template-columns:1fr 1fr;gap:5px}.quick-lineup li:not(.at-bat):not(.on-deck){display:none}.quick-lineup .at-bat{order:-1}.quick-lineup strong{font-size:16px}.quick-lineup .on-deck:before{content:'次';font-size:12px}.watch-toolbar{font-size:13px;gap:8px}.quick-result{font-size:28px}.watch-layout .speeds>span{font-size:12px}}
.decision-panel{position:absolute;left:0;right:0;bottom:0;z-index:6;padding:10px 10px 12px;background:linear-gradient(#14211b00,#14211bee 24%);display:flex;justify-content:center}
.decision-panel[hidden]{display:none}
.decision-row{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,104px);gap:8px;width:100%;justify-content:center}
.decision-card{all:unset;cursor:pointer;position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 4px 7px;background:linear-gradient(#3c9a58,#2a7442);box-shadow:inset 0 0 0 3px #12331f,inset 0 0 0 5px #6cc483,0 4px 0 #0007;clip-path:polygon(5px 0,calc(100% - 5px) 0,100% 5px,100% calc(100% - 5px),calc(100% - 5px) 100%,5px 100%,0 calc(100% - 5px),0 5px);transition:transform .08s}
.decision-card:hover,.decision-card:focus-visible{transform:translateY(-4px)}
.decision-card:disabled{cursor:wait;opacity:.7}
.decision-card.level-5{box-shadow:inset 0 0 0 3px #12331f,inset 0 0 0 5px #ffd84a,0 4px 0 #0007}
.decision-icon{width:100%;max-width:64px;aspect-ratio:1;background:#0e2216 center/100% no-repeat;image-rendering:pixelated;box-shadow:inset 0 0 0 2px #0006}
.decision-name{color:#fff;font-weight:900;font-size:clamp(12px,3.4vw,15px);line-height:1.15;text-align:center;text-shadow:2px 2px 0 #0008;word-break:keep-all;min-height:2.3em;display:flex;align-items:center}
.decision-level{position:absolute;top:2px;left:2px;z-index:1;width:20px;height:20px;display:grid;place-items:center;font:900 14px ui-monospace,Menlo,monospace;color:#1d2a33;background:#fff;box-shadow:inset 0 0 0 2px #1d2a33,2px 2px 0 #0006}
.level-1 .decision-level{background:#dfe8f0;color:#5b6b7a}.level-2 .decision-level{background:#eef3ef;color:#46564c}.level-4 .decision-level{background:#b8f0a8}
.level-5 .decision-level{width:24px;height:24px;font-size:17px;top:1px;left:1px;background:#ffd84a;box-shadow:inset 0 0 0 2px #1d2a33,0 0 0 2px #fff6b0,0 0 12px 3px #ffd84acc}
.decision-reward{font-size:10px;font-weight:900;color:#12331f;background:#d9f2df;padding:1px 5px;white-space:nowrap}
@media(max-width:600px){.decision-panel{padding:6px}.decision-row{gap:5px}.decision-card{padding:5px 2px;gap:2px}.decision-icon{max-width:46px;margin-top:6px}.decision-level{width:17px;height:17px;font-size:12px}.level-5 .decision-level{width:20px;height:20px;font-size:14px}.decision-name{min-height:auto;font-size:11px;white-space:nowrap}.decision-reward{display:none}}
.pitch-info{position:absolute;z-index:5;top:50%;left:50%;transform:translate(-50%,calc(clamp(34px,8.6cqw,68px) * .62 + 34px));display:flex;align-items:baseline;gap:8px;width:max-content;max-width:calc(100% - 24px);padding:6px 18px 8px;background:#14211be6;color:#fff;border-radius:999px;box-shadow:0 3px 0 #10202d,inset 0 0 0 2px #ffffff22;line-height:1;pointer-events:none}
.pitch-info[hidden]{display:none}
.pitch-info b{font-size:clamp(26px,5.6cqw,44px);font-weight:900;font-variant-numeric:tabular-nums}
.pitch-info small{font-size:clamp(13px,2.4cqw,18px);font-weight:800;color:#cfe3d4;margin-left:-3px}
.pitch-info span{font-size:clamp(17px,3.6cqw,28px);font-weight:900;color:#ffd84a}

/* 結果の見せ方。自チームに良い結果ほど大きく褒め、悪い結果は小さく沈ませて派手にしない。 */
.result-burst{display:none}
.tone-good .result-burst,.tone-great .result-burst{display:block;position:absolute;left:50%;top:50%;width:170%;aspect-ratio:1;transform:translate(-50%,-50%);background:repeating-conic-gradient(#ffd84acc 0 7deg,transparent 7deg 22deg);-webkit-mask:radial-gradient(circle,#000 16%,transparent 62%);mask:radial-gradient(circle,#000 16%,transparent 62%);animation:result-spin 2.4s linear infinite,result-appear .35s ease-out both}
.tone-good .result-box{background:linear-gradient(#24587a,#163246);color:#fff;border-color:#ffe066;box-shadow:0 4px 0 #10202d,0 0 0 4px #ffe06655,0 0 26px #ffd84a88;animation:result-pop .45s cubic-bezier(.2,1.6,.4,1) both}
.tone-great .result-burst{width:200%;-webkit-mask:radial-gradient(circle,#000 14%,transparent 58%);mask:radial-gradient(circle,#000 14%,transparent 58%);background:repeating-conic-gradient(#fff36bee 0 6deg,#ff8a3daa 6deg 12deg,transparent 12deg 20deg);animation:result-spin 1.3s linear infinite,result-appear .3s ease-out both}
.tone-great .result-box{background:linear-gradient(#ff8a3d,#d8433a);color:#fff;border-color:#fff36b;text-shadow:0 3px 0 #7a1f12;box-shadow:0 5px 0 #7a1f12,0 0 0 5px #fff36b66,0 0 40px #ffd84a;animation:result-pop .5s cubic-bezier(.2,1.8,.4,1) both,result-glow .8s ease-in-out .5s infinite alternate}
.tone-great::after{content:'';position:absolute;left:50%;top:50%;width:8px;height:8px;background:#fff36b;box-shadow:-120px -70px #ff8a3d,110px -80px #7be08a,-150px 20px #9cc4ff,150px 30px #ff8fa3,-80px 80px #fff36b,90px 75px #ff8a3d,-30px -105px #fff,40px 100px #c18bff,-170px -30px #7be08a,170px -20px #fff36b;transform:translate(-50%,-50%) scale(1.25);opacity:0;animation:result-confetti 1.1s cubic-bezier(.1,.8,.3,1) both}
.tone-bad .result-box{background:#2b3640e6;color:#c3ccd3;border-color:#5f6f7a;box-shadow:0 3px 0 #1a222a;animation:result-sink .35s ease-out both}
.quick-result.tone-good{color:#fff36b;border-color:#ffe066;box-shadow:0 0 14px #ffd84a99;animation:result-pop .4s cubic-bezier(.2,1.6,.4,1) both}
.quick-result.tone-great{color:#fff;background:#d8433ae6;border-color:#fff36b;box-shadow:0 0 20px #ffd84a;animation:result-pop .45s cubic-bezier(.2,1.8,.4,1) both}
.quick-result.tone-bad{color:#b8c4cc;background:#26333ad9;border-color:#5f6f7a}
@keyframes result-pop{0%{transform:scale(.4);opacity:0}70%{transform:scale(1.12);opacity:1}100%{transform:scale(1)}}
@keyframes result-sink{from{transform:translateY(-6px);opacity:0}to{transform:none;opacity:1}}
@keyframes result-spin{from{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes result-appear{from{opacity:0}to{opacity:1}}
@keyframes result-glow{to{box-shadow:0 5px 0 #7a1f12,0 0 0 9px #fff36b88,0 0 64px #ffd84a}}
@keyframes result-confetti{from{transform:translate(-50%,-50%) scale(.15);opacity:1}to{transform:translate(-50%,-50%) scale(1.25);opacity:0}}
/* 詳しい観戦の中に打者・投手を重ねる。下に別枠を置かず、球場の画面内で読む。 */
.match-scene .broadcast-players{position:absolute;top:10px;right:10px;z-index:4;display:flex;flex-direction:column;align-items:stretch;gap:6px;width:clamp(150px,30%,270px);margin:0;min-height:0;pointer-events:none}
.match-scene .broadcast-player{position:static;max-width:100%;padding:6px 12px 7px;gap:2px;border-radius:6px;box-shadow:0 3px 0 #0006}
.match-scene .broadcast-player.hitter{order:0}
.match-scene .broadcast-player.pitcher{order:1}
.match-scene .broadcast-player>.card-stat{display:flex;gap:4px;flex-wrap:nowrap;overflow:hidden;min-height:1.6em;align-items:center;font-size:clamp(11px,1.6cqw,15px);font-weight:800;color:#fff9e8;white-space:nowrap}
.match-scene .card-stat .atbat-result{font-size:inherit;padding:0 4px;line-height:1.5}
.match-scene .card-stat .atbat-result.first{color:#c4d5dc;background:#ffffff1a}
.match-scene .broadcast-player>.card-tags{font-size:clamp(10px,1.5cqw,13px);color:#c4d5dc;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-height:1.3em}
.match-scene .broadcast-player>strong{font-size:clamp(15px,3cqw,26px)}
.match-scene .broadcast-player>small,.match-scene .broadcast-player>span{font-size:clamp(10px,1.6cqw,14px)}
.role-badge{position:absolute;top:10px;left:10px;z-index:4;display:flex;align-items:baseline;gap:8px;padding:5px 14px 6px;border-radius:6px;color:#fff;box-shadow:0 3px 0 #0006;pointer-events:none}
.role-badge[hidden]{display:none}
.role-badge b{font-size:clamp(16px,3.2cqw,28px);font-weight:900;letter-spacing:.06em}
.role-badge small{font-size:clamp(11px,1.9cqw,16px);font-weight:800;opacity:.9}
.role-badge.attack{background:linear-gradient(#ef7d3a,#c4472a);box-shadow:0 3px 0 #6e2414,inset 0 0 0 2px #ffd28a66}
.role-badge.defense{background:linear-gradient(#3d7fd6,#285aa8);box-shadow:0 3px 0 #15305e,inset 0 0 0 2px #a8cdff66}
/* 3アウトの締め。チャンスでもピンチでも同じ見せ方にする。 */
.watch-overlay.is-change{display:flex;align-items:center;justify-content:center;background:#0b161299;animation:result-appear .2s ease-out both}
.change-banner{display:flex;flex-direction:column;align-items:center;gap:2px;width:100%;padding:14px 0 16px;background:linear-gradient(90deg,#1d2a3300,#1d2a33f2 18%,#1d2a33f2 82%,#1d2a3300);border-top:3px solid #ffd84a;border-bottom:3px solid #ffd84a;color:#fff;animation:change-slide .35s cubic-bezier(.2,1.4,.4,1) both}
.change-banner b{font-size:clamp(16px,3cqw,26px);color:#ffd84a;letter-spacing:.2em}
.change-banner strong{font-size:clamp(40px,10cqw,84px);font-weight:900;letter-spacing:.12em;text-shadow:0 4px 0 #0008}
@keyframes change-slide{from{transform:translateX(-30%);opacity:0}to{transform:none;opacity:1}}
/* 俯瞰：結果は中央、投手名は左上、3アウトは「チェンジ」をぱっと添える。 */
.quick-caption{top:44%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;gap:6px}
.quick-change{display:inline-block;padding:3px 14px;background:#ffd84a;color:#1d2a33;font-weight:900;font-size:clamp(16px,3.4cqw,24px);letter-spacing:.12em;border-radius:4px;box-shadow:0 3px 0 #0006;text-shadow:none;animation:result-pop .3s cubic-bezier(.2,1.6,.4,1) both}
.quick-pitcher{position:absolute;top:8px;left:8px;display:flex;align-items:baseline;gap:6px;padding:4px 10px 5px;background:#14211bd9;color:#fff;border-radius:5px;border-left:4px solid #51c6c2;pointer-events:none}
.quick-pitcher small{font-size:11px;font-weight:800;color:#8bddda}
.quick-pitcher b{font-size:clamp(13px,2.4cqw,18px)}
@media(max-width:500px){.match-scene .broadcast-players{top:6px;right:6px;gap:4px;width:44%}.match-scene .broadcast-player{padding:4px 8px 5px}.match-scene .broadcast-player>strong{font-size:14px}.role-badge{top:6px;left:6px;padding:3px 9px 4px;gap:5px}}
/* 得点はチーム名のすぐ右に置く。2行の得点は長い方の名前にそろえる。自チーム（後攻）は名前を札にして目立たせる。 */
.bug-teams{display:grid;grid-template-columns:auto minmax(0,max-content) auto;justify-content:start;align-items:center;column-gap:10px;row-gap:4px}
.bug-team{display:contents}
.bug-team>strong{min-width:0}
.bug-team>b{min-width:1.4em}
.bug-team.own>strong{justify-self:start;max-width:100%;padding:1px 8px;border-radius:4px;background:#f6ecd0;color:#14211b}
.bug-team.own.batting>strong{background:#ffdc70;color:#14211b}
.quick-lineup.own{background:#f2ecd2}
.quick-lineup.own h3{display:inline-block;max-width:calc(100% - 8px);padding:2px 8px;border-radius:4px;background:#315d49;color:#fff6d5;box-sizing:border-box}
.quick-score b.own{position:relative}.quick-score b.own::after{content:'';position:absolute;left:15%;right:15%;bottom:-4px;height:4px;border-radius:2px;background:#f6ecd0}
.quick-scoreboard tr.own>th{background:#f6ecd0;color:#14211b!important;font-weight:850}
.quick-scoreboard tr.own.batting>th{background:#ffdc70}
/* 選手交代：札がめくれて新しい選手が出る。画面は切り替えない。 */
.swap-in{animation:card-flip .5s cubic-bezier(.3,1.4,.5,1) both;transform-origin:50% 50%}
.quick-lineup li.swap-in{box-shadow:inset 0 0 0 2px #e0a93a}
@keyframes card-flip{0%{transform:perspective(500px) rotateX(90deg);opacity:.2}60%{opacity:1}100%{transform:none;opacity:1}}
/* 主将スキルは指示カードの横の目立つ1枚。1回目で上に説明、2回目で発動。発動すると数字が上がる。 */
.decision-panel{flex-direction:column;align-items:center;gap:8px}
.decision-card.skill-card{background:linear-gradient(#ffb43a,#e9731e);box-shadow:inset 0 0 0 3px #7a3a08,inset 0 0 0 5px #ffe6a0,0 4px 0 #0007}
.skill-card .decision-icon{background-color:#3a1c06}
.skill-card .decision-reward{background:#3a1c06;color:#ffe6a0}
.skill-card.armed{transform:translateY(-6px);animation:skill-armed .7s ease-in-out infinite alternate}
.skill-badge{position:absolute;top:2px;left:2px;z-index:1;padding:1px 5px;font:900 11px/1.4 sans-serif;color:#3a1c06;background:#fff3c4;box-shadow:inset 0 0 0 2px #3a1c06}
@keyframes skill-armed{to{box-shadow:inset 0 0 0 3px #7a3a08,inset 0 0 0 5px #fff6c8,0 4px 0 #0007,0 0 22px 6px #ffc24acc}}
.skill-tip{display:grid;gap:2px;max-width:min(420px,100%);padding:8px 14px;border-radius:8px;background:#fff6dc;color:#3a1c06;box-shadow:0 0 0 3px #e9731e,0 4px 0 #0007;text-align:center;animation:result-appear .15s ease-out both}
.skill-tip b{font-size:16px}.skill-tip span{font-size:14px;font-weight:700}.skill-tip small{font-size:12px;color:#8a4a12}
.skill-burst{position:absolute;left:0;right:0;bottom:100%;height:clamp(150px,30cqw,240px);z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none;color:#fff;text-shadow:0 3px 0 #7a3a08,0 0 18px #ffb43a;animation:skill-burst 1.2s ease-out forwards}
.skill-burst::before{content:'';position:absolute;left:50%;top:50%;width:140%;aspect-ratio:1;transform:translate(-50%,-50%);background:repeating-conic-gradient(#ffd84a 0 8deg,#ffd84a00 8deg 22deg);opacity:.75;animation:skill-rays 1.2s ease-out forwards}
.skill-burst b{position:relative;font-size:clamp(28px,6cqw,52px);font-weight:900;letter-spacing:.06em}.skill-burst small{position:relative;font-size:clamp(16px,3cqw,26px);font-weight:900;color:#ffe066}
@keyframes skill-burst{0%{transform:scale(.4);opacity:0}15%{transform:scale(1.12);opacity:1}30%{transform:scale(1)}75%{opacity:1}100%{opacity:0}}
@keyframes skill-rays{from{transform:translate(-50%,-50%) rotate(0) scale(.3)}to{transform:translate(-50%,-50%) rotate(40deg) scale(1);opacity:0}}
/* 限界を超えた6・7。発動した時だけ出る。 */
.decision-card.boosted .decision-level{animation:level-up .6s cubic-bezier(.2,1.8,.4,1) .25s both}
.level-6 .decision-level,.level-7 .decision-level{width:26px;height:26px;top:0;left:0;font-size:18px;color:#fff;background:linear-gradient(135deg,#ff4f6d,#ffb43a 50%,#ffe066);box-shadow:inset 0 0 0 2px #3a1c06,0 0 0 2px #fff6b0,0 0 16px 4px #ff7a3acc}
.decision-card.level-6,.decision-card.level-7{box-shadow:inset 0 0 0 3px #12331f,inset 0 0 0 5px #ff8a3d,0 4px 0 #0007,0 0 18px 2px #ffb43a99}
@keyframes level-up{0%{transform:scale(1)}40%{transform:scale(2.1) rotate(-8deg)}100%{transform:none}}
@media(max-width:600px){.skill-badge{font-size:9px;padding:0 3px}.skill-tip{padding:6px 10px}.skill-tip b{font-size:14px}.skill-tip span{font-size:12px}}
/* 相手の主将スキルは球場を覆わず、上の帯で短く知らせる。 */
.watch-overlay.is-skill{background:none;justify-content:flex-start;padding:12% 0 0}
.skill-ribbon{display:flex;align-items:baseline;gap:10px;padding:6px 18px 7px;border-radius:999px;background:#2b2440f2;color:#fff;box-shadow:inset 0 0 0 2px #8f7fd1,0 3px 0 #0007;animation:change-slide .3s cubic-bezier(.2,1.4,.4,1) both}
.watch-overlay .skill-ribbon small{font-size:12px;color:#c3b8f2}.watch-overlay .skill-ribbon b{font-size:clamp(16px,2.6cqw,22px)}.watch-overlay .skill-ribbon span{font-size:13px;color:#e9e2ff;line-height:1.3}
@media(max-width:600px){.watch-overlay .skill-ribbon span{display:none}}
.decision-row{position:relative;z-index:1}.skill-burst{z-index:0}
/* 試合開始。球場の上に大きく「PLAY BALL!」を出して、始まった感を伝える。 */
.watch-overlay.is-opening{background:radial-gradient(circle,#1d2a33cc,#0b1612ee);overflow:hidden}
.playball{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;color:#fff;animation:playball-pop .5s cubic-bezier(.2,1.6,.4,1) both}
.playball::before{content:'';position:absolute;left:50%;top:50%;width:min(160vw,1400px);aspect-ratio:1;transform:translate(-50%,-50%);background:repeating-conic-gradient(#ffd84a55 0 7deg,#ffd84a00 7deg 20deg);animation:playball-rays 6s linear infinite;z-index:-1}
.watch-overlay .playball b{font-size:clamp(44px,11cqw,104px);font-weight:900;font-style:italic;letter-spacing:.04em;line-height:1;color:#ffe066;text-shadow:0 5px 0 #c4472a,0 10px 0 #0008,0 0 30px #ffb43a}
.watch-overlay .playball small{font-size:clamp(16px,3cqw,26px);font-weight:900;letter-spacing:.3em;color:#fff}
@keyframes playball-pop{0%{transform:scale(2.4);opacity:0}60%{transform:scale(.94);opacity:1}100%{transform:none}}
@keyframes playball-rays{to{transform:translate(-50%,-50%) rotate(360deg)}}
/* 自チームの逆転・サヨナラは共通の大きな演出。試合の最後はGAME SETで締める。 */
.watch-overlay.is-climax,.watch-overlay.is-ending{overflow:hidden;background:radial-gradient(circle,#c4472acc,#3a0d06ee)}
.watch-overlay.is-ending{background:radial-gradient(circle,#1d2a33dd,#05090bf2)}
.climax,.gameset{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;animation:playball-pop .5s cubic-bezier(.2,1.6,.4,1) both}
.climax::before,.gameset::before{content:'';position:absolute;left:50%;top:50%;width:min(160vw,1400px);aspect-ratio:1;transform:translate(-50%,-50%);background:repeating-conic-gradient(#ffe06666 0 7deg,#ffe06600 7deg 18deg);animation:playball-rays 5s linear infinite;z-index:-1}
.gameset::before{background:repeating-conic-gradient(#ffffff22 0 6deg,#ffffff00 6deg 20deg)}
.climax::after{content:'';position:absolute;left:50%;top:50%;width:120%;aspect-ratio:1;transform:translate(-50%,-50%);background:radial-gradient(circle,#fff 0 2px,transparent 3px) 0 0/34px 34px,radial-gradient(circle,#ffe066 0 3px,transparent 4px) 17px 17px/34px 34px;animation:climax-confetti 1.8s ease-out both;z-index:-1}
.watch-overlay .climax b{font-size:clamp(64px,16cqw,150px);font-weight:900;font-style:italic;line-height:1;color:#fff;text-shadow:0 6px 0 #c4472a,0 12px 0 #0008,0 0 40px #ffb43a;animation:climax-shake .5s .4s ease-in-out 2}
.watch-overlay .gameset b{font-size:clamp(48px,12cqw,110px);font-weight:900;letter-spacing:.06em;line-height:1;color:#fff;text-shadow:0 5px 0 #4b7fd6,0 10px 0 #0008}
.watch-overlay .gameset span{font-size:clamp(28px,6cqw,52px);font-weight:900;color:#ffe066;font-variant-numeric:tabular-nums}.watch-overlay .gameset small{margin:0 .4em;color:#cbdaba;font-size:.7em}
@keyframes climax-confetti{from{transform:translate(-50%,-50%) scale(.3);opacity:1}to{transform:translate(-50%,-30%) scale(1.3);opacity:0}}
@keyframes climax-shake{25%{transform:rotate(-3deg) scale(1.05)}75%{transform:rotate(3deg) scale(1.05)}}
/* 球団バッジ：略字と球団の色だけ。 */
.club-badge{display:inline-grid;place-items:center;flex:none;width:22px;height:22px;border-radius:5px;font:900 12px/1 system-ui,sans-serif;box-shadow:inset 0 0 0 1.5px #0002;vertical-align:middle}
.club-badge.wide{font-size:8px;letter-spacing:-.03em}
.club-badge.lg{width:30px;height:30px;font-size:15px;border-radius:7px}.club-badge.lg.wide{font-size:10px}
/* チームの持ち味：数字を出さず、↑の数を棒の長さで見せる。 */
.stat-bars{display:grid;gap:6px}
.stat-bar{display:grid;grid-template-columns:22px 3.6em 1fr;align-items:center;gap:6px}
.stat-mark{width:22px;height:22px;border-radius:6px;display:grid;place-items:center;font:900 12px/1 system-ui;color:#fff;background:var(--stat)}
.stat-name{font-size:12px;font-weight:800;white-space:nowrap}
.stat-pips{display:grid;grid-template-columns:repeat(var(--pips),1fr);gap:2px;height:14px}
.stat-pips i{border-radius:2px;background:#e8e1cc}
.stat-pips i.on{background:var(--stat)}
.stat-pips i.gain{background:var(--stat);opacity:.5;animation:stat-gain .6s ease-in-out infinite alternate}
.stat-pips i.loss{background:none;box-shadow:inset 0 0 0 2px #c4472a}
.stat-bars.compact{gap:4px}.stat-bars.compact .stat-pips{height:10px}.stat-bars.compact .stat-mark{width:18px;height:18px;font-size:10px}.stat-bars.compact .stat-bar{grid-template-columns:18px 3.6em 1fr}
@keyframes stat-gain{to{opacity:.95}}
.stat-power{--stat:#e0672d}.stat-contact{--stat:#2a9aa5}.stat-discipline{--stat:#7d4fe0}.stat-speed{--stat:#3c9a58}.stat-smallBall{--stat:#b58a1e}.stat-defense{--stat:#285aa8}.stat-stuff{--stat:#c4472a}.stat-control{--stat:#1d7f8c}.stat-strikeout{--stat:#9c2333}
.picker-profile{position:sticky;top:0;z-index:2;margin:8px 0;padding:8px 10px;border-radius:10px;background:#f6f0de;box-shadow:0 4px 8px #0001}
.club-cell{display:inline-flex;align-items:center;gap:5px}
.position strong .club-badge,.slot-small strong .club-badge,.role-card strong .club-badge,.order-main .club-badge{margin-right:5px}
/* ---- トップ ---- */
.title-hero{position:relative;margin:-16px -18px 0;min-height:min(78vh,620px);display:grid;place-items:center;overflow:hidden;background:#0b1612;color:#fff;text-align:center}
.title-scene{position:absolute;inset:0}.title-scene .scene-frame{border:0;border-radius:0;height:100%;box-shadow:none;background:#0b1612}.title-scene canvas{width:100%;height:100%;object-fit:cover;aspect-ratio:auto}
.title-hero::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 45%,#0b161270,#0b1612e8 72%);pointer-events:none}
.title-copy{position:relative;z-index:1;padding:40px 16px}
.title-logo{font:900 italic clamp(40px,9vw,88px)/1 system-ui,sans-serif;letter-spacing:.02em;color:#ffe066;text-shadow:0 5px 0 #c4472a,0 10px 0 #0009}
.title-tag{margin:14px 0 26px;font-size:clamp(15px,2.4vw,19px);font-weight:800;letter-spacing:.08em}
.entry-choices{display:grid;grid-template-columns:repeat(3,minmax(0,170px));gap:12px;justify-content:center}
.entry-card{all:unset;cursor:pointer;display:grid;justify-items:center;gap:6px;padding:16px 10px 14px;border-radius:16px;background:#ffffffeb;color:#14211b;box-shadow:0 5px 0 #0006;transition:transform .12s}
.entry-card:hover,.entry-card:focus-visible{transform:translateY(-4px)}
.entry-card:disabled{opacity:.6;cursor:wait}
.entry-art svg{width:46px;height:46px;display:block}
.entry-card strong{font-size:17px;font-weight:900;line-height:1.25}.entry-card small{font-size:12px;font-weight:700;opacity:.75}
/* 世界の様子 */
.world{display:grid;grid-template-columns:1fr 1.2fr;gap:14px;margin:22px 0}
.world-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.world-stat{display:grid;place-items:center;align-content:center;padding:14px 6px;border-radius:14px;background:#14211b;color:#fff}
.world-stat b{font-size:clamp(24px,4vw,34px);font-weight:900;color:#ffe066;font-variant-numeric:tabular-nums}.world-stat small{font-size:12px;font-weight:800;opacity:.8}
.world-top{padding:12px 14px;border-radius:14px;background:#fffdf5;box-shadow:inset 0 0 0 2px #14211b14}
.world-top h3{margin:0 0 6px;font-size:14px}.world-top ol{list-style:none;margin:0 0 4px;padding:0;display:grid;gap:6px}
.world-top li{display:grid;grid-template-columns:20px auto 1fr auto;align-items:center;gap:8px}
.world-place{font-weight:900;color:#c4472a;text-align:center}.world-name{font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.world-top li b{font-variant-numeric:tabular-nums}
/* チームの印 */
.team-emblem{display:inline-grid;place-items:center;flex:none;width:34px;height:34px;border-radius:9px;background:linear-gradient(135deg,var(--shirt),var(--cap));color:#fff;font:900 17px/1 system-ui;box-shadow:inset 0 0 0 3px #ffffff40;text-shadow:0 2px 0 #0004}
.team-emblem.sm{width:26px;height:26px;font-size:13px;border-radius:7px}.team-emblem.lg{width:84px;height:84px;font-size:40px;border-radius:20px}
/* チームがある時のトップ：球場の絵の上に、いちばん使うチームと試合へを載せる */
.hero-club{display:grid;justify-items:center;gap:8px}
.hero-club h2{margin:4px 0 0;font:900 clamp(28px,6vw,52px)/1.15 system-ui,sans-serif;color:#fff;text-shadow:0 4px 0 #0008;max-width:90vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hero-leaders,.hero-rec{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:4px 16px;margin:0;font-size:14px;font-weight:700;color:#e9eef2}
.hero-leaders b{color:#fff;font-size:16px}.hero-rec b{color:#ffe066;font-size:17px}
.hero-club .play-button{margin-top:12px}
.hero-links{display:flex;gap:8px}
.ghost{background:#ffffff1a!important;color:#fff!important;border:1px solid #ffffff40!important}
.form-row{display:inline-flex;gap:4px}.form-row i{width:22px;height:22px;border-radius:5px;display:grid;place-items:center;font:800 11px system-ui;font-style:normal}
.form-row .w{background:#ffd84a;color:#2a1a05}.form-row .l{background:#ffffff26;color:#ffffffb0}
.play-button{all:unset;cursor:pointer;padding:15px 54px;border-radius:999px;background:linear-gradient(#ffcf4a,#f29a2e);color:#2a1a05;font-weight:900;font-size:20px;box-shadow:0 5px 0 #7a4a10,0 0 28px #ffb43a88}
.play-button:disabled{opacity:.6;cursor:wait}
.club-home{display:grid;gap:12px;margin-top:16px}
.club-others{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:8px}
.club-mini{all:unset;cursor:pointer;display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:#fffdf5;box-shadow:inset 0 0 0 2px #14211b14}
.club-mini span{display:grid;min-width:0}.club-mini b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.club-mini small{font-size:12px;color:#666}
.club-mini.new{justify-content:center;font-weight:800;color:#14211b99;box-shadow:inset 0 0 0 2px #14211b33}
.club-mini.new[aria-expanded=true]{background:#14211b;color:#fff}
.entry-panel{padding:16px;border-radius:16px;background:radial-gradient(ellipse at 50% 30%,#1d3a2e,#0b1612)}
@media(max-width:640px){.entry-choices{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.entry-card{padding:12px 6px}.entry-card strong{font-size:14px}.entry-art svg{width:36px;height:36px}.world{grid-template-columns:1fr}.title-hero{margin:-16px -12px 0}.team-emblem.lg{width:64px;height:64px;font-size:30px}}
.matchup-stats{margin:4px 0 14px;padding:10px 12px;border-radius:12px;background:#f6f0de}
.starting-lineup strong .club-badge,.matchup-reserves strong .club-badge{margin-right:5px}
/* ==== 共通の見た目：トップ（夜の球場・金のボタン・角の丸いカード）にそろえる ==== */
:root{--night:#0f1d2b;--night-2:#14211b;--gold-a:#ffcf4a;--gold-b:#f29a2e;--gold-ink:#2a1a05}
/* 上の帯：紺の帯を画面の端まで伸ばす */
.topbar{position:relative;z-index:20;background:var(--night);color:#fff;box-shadow:0 0 0 100vmax var(--night);clip-path:inset(0 -100vmax);padding-top:14px;padding-bottom:14px}
.topbar .brand{color:#fff;background:none;border:0}.topbar .brand-title{color:#fff}.topbar .brand-sub{color:#ffffffa0}
.topbar .brand-mark{background:var(--gold-a);color:var(--gold-ink);border-color:var(--gold-ink);box-shadow:2px 2px 0 #0008}
.topbar .topnav button,.topbar .sound{background:none;color:#ffffffcc;border:1px solid transparent}
.topbar .topnav button.active{background:#ffffff1a;color:#fff;border-color:#ffffff33}
.topbar .sound{border-color:#ffffff40;color:#fff}
.topbar button:disabled{opacity:.35}
.workspace{margin-top:20px}
.title-hero{margin-top:-20px}
/* 主なボタンは金のふくらんだ形 */
.primary{background:linear-gradient(var(--gold-a),var(--gold-b))!important;color:var(--gold-ink)!important;border:0!important;border-radius:999px!important;box-shadow:0 4px 0 #7a4a10,0 0 18px #ffb43a55!important;font-weight:900}
.primary:hover:not(:disabled){filter:brightness(1.05)}
.quiet{border-radius:999px}
/* 見出しの帯：夜の球場の色に白い文字 */
.page-heading,.match-intro-heading,.result-hero{position:relative;padding:24px 22px;border-radius:20px;background:radial-gradient(ellipse at 50% 0%,#24493a,var(--night-2) 70%);color:#fff;overflow:hidden;text-align:center;margin-bottom:20px}
.page-heading::before,.match-intro-heading::before,.result-hero::before{content:'';position:absolute;inset:0;background:repeating-conic-gradient(from 0deg at 50% 120%,#ffffff07 0 6deg,#ffffff00 6deg 14deg);pointer-events:none}
.page-heading>*,.match-intro-heading>*,.result-hero>*{position:relative}
.page-heading .eyebrow,.match-intro-heading .eyebrow{color:#ffe066}
.page-heading h1,.match-intro-heading h1,.result-hero h1{color:#fff;margin:6px 0}
.page-heading .muted,.page-heading p{color:#e9eef2cc}
.page-heading .team-emblem{margin:0 auto 6px;display:grid}
.progress-dots span{background:#14211b1f}.progress-dots span.done{background:var(--gold-b)}
/* カード：白に近い面、細い内側の線、大きめの角丸 */
.editor-panel,.result-panel,.matchup-team,.choice,.tool-card{border:0!important;border-radius:18px!important;background:#fffdf5;box-shadow:inset 0 0 0 2px #14211b14,0 3px 0 #14211b0d!important}
.choice{transition:transform .12s}.choice:hover{transform:translateY(-3px)}
.choice-icon{color:#c4472a}
/* 編成 */
.editor-heading{background:var(--paper);border-bottom:0}
.editor-heading>div:first-child{display:flex;align-items:center;gap:10px}
.role-card{border-radius:14px;background:#f6f0de;border:0}
.field-board{border:0;border-radius:90px 90px 18px 18px;background:#5f8f63;box-shadow:inset 0 0 0 4px #ffffff22}
.position{border:0;border-radius:10px;background:#fff;box-shadow:0 3px 0 #0003}
.tabs{border-radius:999px}
/* 対戦カード */
.matchup-versus{border:0;border-radius:16px;background:#ffffff14;box-shadow:none;color:#fff}
.matchup-versus strong{display:flex;flex-direction:column;align-items:center;gap:8px;color:#fff;font-size:clamp(15px,2.6vw,22px)}
.matchup-versus b{color:#ffe066;text-shadow:0 3px 0 #c4472a}
.matchup-team-top{background:var(--night)!important;display:grid;grid-template-columns:auto 1fr;column-gap:12px;align-items:center}
.matchup-team-top>.team-emblem{grid-row:span 3}
.matchup-team.home .matchup-team-top{box-shadow:inset 0 -4px 0 var(--gold-a)}
.match-start-bar{border:0;border-radius:999px;background:#0f1d2bf0;box-shadow:0 6px 24px #0004}
.match-start-bar .quiet{background:#ffffff14;color:#fff;border-color:#ffffff33}
.match-start-bar p{color:#fff}
/* 結果 */
.result-hero .outcome{background:#ffffff1f;color:#fff;border:0;transform:none;border-radius:999px;padding:6px 16px}
.result-hero .outcome.win{background:var(--gold-a);color:var(--gold-ink)}
.result-score{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:14px;margin:10px 0 6px}
.result-side{display:grid;justify-items:center;gap:6px}.result-side small{font-size:12px;font-weight:800;color:#e9eef2;max-width:16em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.result-hero .big-score{color:#fff;text-shadow:0 4px 0 #c4472a}
.result-hero .pill{background:#ffffff1a;color:#ffe066;border:0}
.result-hero .result-actions .quiet,.result-hero .result-actions button:not(.primary){background:#ffffff14;color:#fff;border-color:#ffffff33}
/* ランキング・戦績 */
.rank-row{padding:12px 4px;gap:12px}
.rank-place{font-weight:900;color:#c4472a;min-width:1.6em;text-align:center}
.rank-rating{font-weight:900;font-variant-numeric:tabular-nums}
.history-row .score{font-weight:900}
@media(max-width:640px){.page-heading,.match-intro-heading,.result-hero{padding:18px 14px;border-radius:16px}.match-start-bar{border-radius:18px}.result-score{gap:8px}.team-emblem.lg{width:56px;height:56px;font-size:26px}}
/* 観戦画面の操作帯もトップにそろえる：紺の帯、選んだ速度は金、一時停止は丸いボタン */
.watch-toolbar>strong{color:#c4472a;font-weight:900;letter-spacing:.06em}
.watch-toolbar .match-card-button{border-radius:999px;background:#fffdf5;border:0;box-shadow:inset 0 0 0 2px #14211b1f;font-weight:800}
.watch-layout .match-controls{border:0;border-radius:16px;background:var(--night);color:#fff;padding:10px 14px;box-shadow:0 3px 0 #0f1d2b33}
.speeds>span{color:#ffffffb0;font-weight:800}
.speeds button{border-radius:999px;color:#ffffffcc;font-weight:900}
.speeds button.active{background:linear-gradient(var(--gold-a),var(--gold-b));color:var(--gold-ink);box-shadow:0 2px 0 #7a4a10}
.watch-layout .match-controls #pause-button{width:40px;height:40px;padding:0;border-radius:50%;background:#ffffff1a;color:#fff;border:1px solid #ffffff40;font-weight:900}
.log-heading strong{font-size:14px;font-weight:900}
.log-heading button{border-radius:999px}
.live-log{border:0;border-radius:16px;box-shadow:inset 0 0 0 2px #14211b14}
/* 選手を選ぶ画面などのダイアログ：見出しを紺の帯に、候補は角丸のカードに */
dialog{border:0;border-radius:22px;padding:0 18px 18px;box-shadow:0 24px 100px #0f1d2b66}
dialog::backdrop{background:#0b1612aa}
.dialog-top{position:sticky;top:0;z-index:5;margin:0 -18px 14px;padding:14px 18px;background:var(--night);color:#fff}
.dialog-top h2{color:#fff}
.dialog-top button{border-radius:50%;width:34px;height:34px;padding:0;background:#ffffff1a;color:#fff;border:1px solid #ffffff40}
#match-card .dialog-top button{width:auto;height:auto;min-height:34px;padding:6px 12px;border-radius:999px;white-space:nowrap;font-size:12px}
.dialog-tools button,#picker select,#picker input{border-radius:999px}
.player-option{border:0;border-radius:14px;background:#fffdf5;box-shadow:inset 0 0 0 2px #14211b14;transition:transform .1s}
.player-option:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 2px var(--gold-b)}
.player-option.outside{background:#efece2}
/* 俯瞰の打順欄：ほかの画面のカードと同じ面にし、自チームは名前の札で目立たせる */
.quick-match{border-radius:16px;overflow:hidden}
.quick-lineup{background:#fffdf5}
.quick-lineup.own{background:#fff6dc}
.quick-lineup .at-bat{background:var(--night)}
.quick-lineup .at-bat>span{color:#ffe066}
.quick-lineup.own h3{background:var(--night)}
.quick-match{background:var(--night-2)}
