/* Standalone replacement for web/styles.css. DESIGN1 mock / 2026-10-22. */
:root{color-scheme:light;--ink:#243448;--muted:#647080;--line:#dce1e6;--blue:#245b9d}
*{box-sizing:border-box}
body{margin:0;background:#f5f6f8;color:var(--ink);font:14px/1.5 -apple-system,BlinkMacSystemFont,'Hiragino Kaku Gothic ProN','Yu Gothic',sans-serif}
button,input,textarea{font:inherit}
button,summary{cursor:pointer}
a{color:var(--blue)}
:focus-visible{outline:3px solid #b77924;outline-offset:2px}
.mock{background:#f4b25b;color:#473114;text-align:center;font-size:12px;padding:4px}
.notice{background:var(--ink);color:#fff;text-align:center;font-size:12px;padding:4px}
main{max-width:860px;margin:auto;padding:10px 12px 36px}
header{margin-bottom:12px}
nav{font-size:12px;margin-bottom:4px}
h1{font-size:21px;margin:0;line-height:1.5}
.edition{float:right;font-size:13px;color:var(--muted)}
.provisional{background:#e9edf1;font-size:12px;padding:3px 8px;margin:7px 0}
.operator{display:flex;align-items:center;gap:10px}
.operator label{white-space:nowrap}
.operator input{min-width:0;width:100%;height:36px;border:1px solid #aeb8c4;border-radius:5px;padding:5px 9px;background:#fff}
small.temp{font-size:9px;font-weight:400;color:var(--muted);margin-left:3px;white-space:nowrap}
h2{font-size:13px;margin:12px 0 5px;color:var(--muted);font-weight:600}
h2 b{font-size:17px;margin-left:8px}
.list{border:1px solid var(--line);border-radius:7px;background:white;overflow:hidden}
.record{border-bottom:1px solid var(--line)}
.record:last-child{border-bottom:0}
.record>summary{list-style:none;display:grid;grid-template-columns:48px minmax(0,1fr) auto 12px;gap:10px;align-items:center;min-height:76px;padding:10px}
.record>summary::-webkit-details-marker{display:none}
.mark{background:var(--ink);color:#fff;border-radius:5px;display:grid;place-items:center;width:48px;height:48px;font-size:18px;font-weight:800;letter-spacing:-.04em}
.mark.long{font-size:15px}
.identity{min-width:0}
.name{font-size:15px;line-height:1.4;display:block;overflow-wrap:anywhere}
.category{font-size:11px;color:var(--muted);font-weight:500;margin-left:5px}
.sub{display:flex;flex-wrap:wrap;gap:2px 7px;margin-top:3px;font-size:11px;color:var(--muted)}
.flag{color:#85501b;font-weight:600}
.flag .temp{color:inherit}
.weight{font-size:25px;font-weight:750;line-height:1.1;font-variant-numeric:tabular-nums;text-align:right}
.weight small{font-size:11px;font-weight:400;margin-left:2px}
.state{display:block;font-size:11px;color:var(--muted);text-align:right;margin-top:5px}
.accepted .state{color:var(--blue)}
.rejected .state{text-decoration:line-through}
.rejected .weight{color:var(--muted);text-decoration:line-through}
.chevron{font-size:15px;color:var(--muted)}
[open] .chevron{transform:rotate(180deg)}
.record[open]>summary{background:#f0f3f7}
.audit,.recalc{display:block;font-size:11px;overflow-wrap:anywhere;color:var(--muted)}
.recalc{margin-top:3px}
.detail{padding:14px;border-top:1px solid var(--line)}
.baseline{font-size:17px;font-weight:650}
.baseline-label{font-size:12px;font-weight:400;color:var(--muted)}
.delta{margin-left:10px}
.holder{margin:3px 0 12px;color:var(--muted);font-size:12px}
.facts{display:grid;grid-template-columns:1fr 1fr;gap:6px 14px;margin-bottom:12px;font-size:12px}
.fact-label{color:var(--muted)}
.reason{font-size:12px;margin:12px 0;overflow-wrap:anywhere}
.question{border-top:1px solid var(--line);padding-top:12px;font-size:13px;margin:12px 0 8px}
.actions{display:flex;gap:8px}
button{min-height:40px;border:1px solid #adb9c8;border-radius:5px;padding:8px 16px;color:var(--ink);background:white}
.actions button{flex:1}
button.primary{background:var(--blue);color:white;border-color:var(--blue)}
button.primary .temp{color:inherit}
button:disabled{opacity:.42;cursor:not-allowed}
.empty{padding:10px;color:var(--muted);font-size:12px}
footer{margin-top:24px}
#copy{width:100%}
#copy-status{font-size:12px}
textarea{width:100%;min-height:160px;margin-top:8px}
#issues{margin-top:16px;font-size:12px}
#issues>summary{padding:12px 0}
#issues li{margin-bottom:8px;overflow-wrap:anywhere}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
[hidden]{display:none!important}
@media(min-width:650px){.record>summary{grid-template-columns:48px minmax(0,1fr) 120px 14px;padding:10px 16px}
.name{font-size:16px}
.sub{font-size:12px}
.detail{padding:18px 26px 20px 74px}
}


.delta{display:block;text-align:right;font-weight:700;font-size:13px;color:var(--blue,#235aa4);line-height:1.2}


button,input,select{min-height:44px}
button{min-width:44px}
.notice,.provisional{padding:8px 12px}
.record>summary{padding:12px}
.operator input{padding:8px 12px}
.empty{padding:12px}
.heading{display:flex;justify-content:space-between;align-items:center;gap:12px}
.toolbar{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
p,button,label,select{overflow-wrap:anywhere}
select,input{max-width:100%}
#upload-items>div{padding:12px 0;border-bottom:1px solid var(--line)}
#login{padding:12px;background:white}
#login label{display:block}
#passphrase{width:100%;margin:8px 0}
#action-status{overflow-wrap:anywhere}
.facts>div{min-width:0;overflow-wrap:anywhere}
.first-guide-target{outline:2px solid var(--blue);outline-offset:2px}
.first-demo-bubble{position:fixed;z-index:1100;width:min(330px,calc(100vw - 16px));padding:16px;border:2px solid var(--blue);border-radius:8px;background:white;box-shadow:0 4px 16px #0002;pointer-events:none}
.first-demo-bubble small{color:var(--blue);font-weight:700}
.first-demo-bubble p{margin:8px 0}
.first-demo-bubble::after{content:"";position:absolute;left:var(--arrow-x);bottom:-9px;width:14px;height:14px;background:white;border-right:2px solid var(--blue);border-bottom:2px solid var(--blue);transform:translateX(-50%) rotate(45deg)}
.first-demo-bubble.points-up::after{top:-9px;bottom:auto;transform:translateX(-50%) rotate(225deg)}

/* FIX7: platform strip and file sheet, matching the selected A mock. */
body{overflow-wrap:anywhere}
main{max-width:1060px}
.strip{display:flex;gap:8px;flex-wrap:wrap;margin:14px 0}
.strip>button{flex:1 1 125px;text-align:left}
.strip span{display:block;font-size:12px}
.strip strong{font-size:17px}
.empty-panel{background:white;border:2px dashed #abb9cb;border-radius:7px;padding:32px 16px;margin:12px 0;text-align:center}
.empty-panel .primary{min-height:60px}
.file{padding:12px 0;border-top:1px solid var(--line)}
.file-name{font-weight:600;overflow-wrap:anywhere}
.file-meta{color:var(--muted);font-size:12px;margin:6px 0}
.file .actions{flex-wrap:wrap}
.file .actions button{font-size:12px;padding:8px;flex:0 1 auto}
.badge{color:var(--blue)}
dialog{width:min(650px,calc(100% - 24px));max-height:85dvh;overflow:auto;border:1px solid var(--line);border-radius:10px;padding:18px;color:var(--ink)}
dialog::backdrop{background:#14233377}
.dialog-head{display:flex;justify-content:space-between;align-items:start;gap:10px}
.dialog-head h2{min-width:0}
#upload-items label{display:block;margin-top:12px}
#upload-items input,#upload-items select{width:100%;padding:9px;border:1px solid #abb9cb;border-radius:5px;background:white;color:var(--ink);font:inherit;min-width:0}
#action-status:not(:empty){background:#e9edf1;border-left:3px solid var(--blue);padding:12px}
#action-status button{margin-left:12px}
.weight{white-space:nowrap}

@media(max-width:600px){.sheet{margin:0;width:100%;max-width:100%;max-height:80dvh;top:auto;bottom:0;border-radius:14px 14px 0 0}
.record>summary{gap:6px;padding:10px;grid-template-columns:38px minmax(0,1fr) auto 10px}
.mark{width:36px;height:40px;font-size:12px;overflow-wrap:anywhere}
.weight{font-size:21px}
.detail{padding:12px}
}

body.dragging #app,body.dragging dialog[open]{outline:3px dashed var(--blue);outline-offset:4px}


.session-progress{display:flex;justify-content:space-between;gap:12px;padding:8px 0;color:var(--muted)}
.session-progress.received,.session-progress.partial{color:var(--blue)}


/* Layout and accessibility shared by all three standalone proposals. */
:root{--surface:#fff;--soft:#edf3fa;--warm:#85501b;--radius:12px;--shadow:0 5px 20px #2434480a}
body{font-size:15px;line-height:1.65}
main{padding:24px 20px 48px}
header{margin-bottom:20px}
h1{font-size:clamp(21px,3vw,28px);letter-spacing:.025em;line-height:1.45}
h2{font-size:14px;margin:24px 0 10px;color:var(--ink)}
h2 b{font-size:22px;color:var(--blue);font-variant-numeric:tabular-nums}
.heading{align-items:center}.heading h1{min-width:0}.heading button{flex-shrink:0}
.notice{font-size:12px;line-height:1.6;padding:10px 16px}
.provisional{padding:12px 16px;border-left:3px solid var(--warm);border-radius:6px;background:#f5efe5;color:#65461f;font-size:13px;margin:0 0 18px}
.operator{gap:12px}.operator label{font-size:14px}
button,input,select,textarea{font:inherit}
button,input,select{min-height:48px}
button{min-width:44px;border:1px solid #8799ae;border-radius:var(--radius);padding:10px 18px;font-weight:650;line-height:1.5;box-shadow:0 1px 2px #24344808}
input,textarea,select{border:1px solid #8799ae;border-radius:8px;padding:10px 12px;background:var(--surface);color:var(--ink)}
.operator input{height:auto;min-height:48px;border-color:#8799ae;border-radius:8px}
button.primary{background:var(--blue);border-color:var(--blue)}
button:disabled{opacity:1;background:#edf0f4;border-color:#bcc6d2;color:#596777;box-shadow:none}
:focus-visible{outline:3px solid #9a5c10;outline-offset:3px}
.record>summary:focus-visible{outline-offset:-4px}
@media(hover:hover){button:not(:disabled):hover{background:var(--soft);border-color:var(--blue)}button.primary:not(:disabled):hover{background:#173f70;border-color:#173f70}.record>summary:hover{background:var(--soft)}}
.toolbar{margin:12px 0 20px}
.strip{gap:10px;margin:20px 0 24px;padding:12px;background:#e9eef5;border:1px solid var(--line);border-radius:calc(var(--radius) + 4px)}
.strip>button{min-width:0;min-height:76px;background:var(--surface);padding:12px 16px}
.strip>button.primary{background:var(--blue);color:#fff;border-color:var(--blue)}
.strip span{font-size:13px;font-weight:500}.strip strong{font-size:20px;font-variant-numeric:tabular-nums}
#upload{flex-grow:1.2;display:flex;align-items:center;justify-content:center;text-align:center;font-size:16px}
.list{border-radius:var(--radius);box-shadow:var(--shadow)}
.record>summary{min-height:94px;gap:14px;padding:18px;grid-template-columns:48px minmax(0,1fr) auto 14px}
.mark{border-radius:10px;background:#344b65;letter-spacing:0}
.name{font-size:17px;font-weight:700;line-height:1.55}.category{font-size:12px}
.sub{font-size:12px;gap:4px 10px}.flag{color:var(--warm)}
.weight{font-size:30px;letter-spacing:-.035em;font-variant-numeric:tabular-nums;white-space:nowrap}
.weight small{font-size:12px;letter-spacing:0}.state{font-size:12px;margin-top:7px}
.delta{font-size:14px;line-height:1.5;font-variant-numeric:tabular-nums}
.record[open]>summary{background:var(--soft);box-shadow:inset 4px 0 var(--blue)}
.accepted .state{color:var(--blue);font-weight:700}
.detail{background:#fff;padding:22px 24px 24px 80px}
.baseline{font-size:19px;font-variant-numeric:tabular-nums}.baseline-label{font-size:13px}
.holder,.facts,.reason,.audit,.recalc{font-size:13px}.facts{gap:12px 20px}
.question{font-size:15px;padding-top:16px;margin-top:18px}
.actions{gap:12px}.actions button{min-width:0;min-height:48px}
.empty{padding:20px;font-size:14px}
.empty-panel{padding:40px 24px;border:2px dashed #8799ae;border-radius:var(--radius);box-shadow:var(--shadow)}
.empty-panel .primary{min-height:60px;max-width:100%}
#login{max-width:560px;margin:32px auto;padding:28px;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
#login p{margin-top:0}#login label{font-weight:650}#passphrase{margin:10px 0 18px}#login button{width:100%}
dialog{padding:24px;border-radius:calc(var(--radius) + 4px);background:var(--surface);box-shadow:0 24px 80px #16263d33;max-height:85dvh}
dialog::backdrop{background:#14233388}.dialog-head{margin-bottom:20px;align-items:center}.dialog-head h2{margin:0;font-size:20px}.dialog-head button{flex-shrink:0}
#choose-files{margin:16px 0 8px}#upload-submit{margin-top:16px}
#upload-items>div{padding:18px 0}#upload-items label{font-size:14px;font-weight:600}
#upload-items input,#upload-items select{min-height:48px;border-color:#8799ae;border-radius:8px}
.file{padding:20px 0}.file-name{font-size:16px}.file-meta{font-size:13px}.file .actions{gap:8px}.file .actions button{font-size:13px;padding:10px 14px;min-height:48px;max-width:100%}
#action-status:not(:empty){background:var(--soft);border-radius:6px;padding:16px;font-size:14px}
#action-status button{margin:8px 0 0 12px;max-width:100%}
.first-demo-bubble{border-radius:var(--radius);padding:18px;line-height:1.7;box-shadow:0 8px 28px #14233322;color:var(--ink)}
.first-demo-bubble p{font-size:14px}.first-demo-bubble small{font-size:13px}
footer{margin-top:32px;border-top:1px solid var(--line);padding-top:24px}
#copy{min-height:52px}#copy-status{font-size:13px}textarea{line-height:1.6;border-radius:8px}
#issues{font-size:13px;color:var(--muted)}#issues>summary{min-height:48px;padding:12px 4px;color:var(--ink);font-weight:650}#issues ul{padding-left:24px}
nav a{display:inline-flex;align-items:center;min-height:44px}
@media(max-width:600px){
 main{padding:18px 12px 32px}.heading{gap:8px}.heading button{padding:10px 12px}h1{font-size:21px}
 .strip{padding:8px;gap:8px}.strip>button{flex-basis:125px;padding:12px;min-height:76px}
 .record>summary{grid-template-columns:36px minmax(0,1fr) auto 10px;gap:6px;padding:14px 10px;min-height:92px}
 .mark{width:36px;height:44px;font-size:13px;border-radius:7px}.mark.long{font-size:12px}
 .name{font-size:15px}.category{display:block;margin:3px 0 0}.sub{font-size:12px}
 .weight{font-size:24px}.weight small{font-size:11px}.state{font-size:12px}.delta{font-size:13px}
 .detail{padding:18px 14px}.facts{gap:10px}.actions{gap:8px}.actions button{padding:10px 8px}
 #login{padding:22px 18px;margin:20px 0}.empty-panel{padding:28px 16px}
 dialog{padding:18px}.sheet{padding-bottom:max(20px,env(safe-area-inset-bottom));border-radius:18px 18px 0 0}
 .operator{gap:8px}.operator label{font-size:13px}.dialog-head h2{font-size:18px}
 #action-status button{margin-left:0}
}
/* These utilities must win over component presentation. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
[hidden]{display:none!important}
/* B — 競技会の公式感: navy bands and scoreboard numerals. */
:root{--ink:#172a43;--muted:#53647a;--line:#ccd5e1;--blue:#1e5598;--soft:#eaf1fa;--warm:#815114;--radius:4px;--shadow:0 3px 0 #172a4310}
body{background:#edf0f4}.notice{background:#101e32}
header{background:#172a43;color:#fff;padding:24px;border-top:4px solid #d6ae6d;border-radius:4px}
header button{background:#233c5c;color:#fff;border-color:#8a9bb1}header button:not(:disabled):hover{background:#314f75;color:#fff}
h1{font-weight:800;letter-spacing:.05em}
.strip{background:#172a43;border-color:#172a43;padding:14px;border-radius:4px;gap:2px}
.strip>button{border-radius:2px;border-color:#d1dae6;box-shadow:none}.strip strong{font-size:24px;font-weight:800}
.strip>button.primary{background:#245fa8;border-color:#88a9d0}#upload{margin-left:8px}
h2{letter-spacing:.04em}.mark{background:#172a43;border-radius:2px;font-weight:850}
.weight{font-size:34px;font-weight:850;letter-spacing:-.045em}.baseline{font-weight:750}
.record[open]>summary{box-shadow:inset 5px 0 var(--blue)}
.detail{border-top:2px solid #bdcde1}.question{font-weight:650}
.empty-panel{border-style:solid;border-top:4px solid #b88c49}
.dialog-head{padding-bottom:16px;border-bottom:3px solid #172a43}
#login{border-top:4px solid #172a43}.first-demo-bubble{border-radius:4px}
footer{border-top:3px solid #172a43}
@media(max-width:600px){header{padding:18px 14px}.strip{padding:8px;gap:8px}#upload{margin-left:0}.weight{font-size:27px}.mark{border-radius:2px}}
/* 面の札: 名前と届いた数を 2 行に分け、各面の背景板の色を上端の帯と印に使う（状態の色には使わない） */
.strip strong{display:block;font-size:15px;line-height:1.3;overflow-wrap:anywhere}.strip b.count{display:block;font-size:24px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1.2}
.strip>button[data-platform]{border-top:5px solid var(--face,#9aa8b8);position:relative}
.strip>button[data-platform]::before{content:"";position:absolute;top:10px;right:10px;width:10px;height:10px;border-radius:50%;background:var(--face-mark,var(--face,#9aa8b8))}
.strip>button[data-platform="世界パワー面"]{--face:#b9bdc4;--face-mark:#c6a34a;border-top-color:#b9bdc4}
.strip>button[data-platform="姫路面"]{--face:#16161a;--face-mark:#c9a24a;border-top-color:#16161a}
.strip>button[data-platform="グランプリ面"]{--face:#d4af5a;--face-mark:#b5121b;border-top-color:#d4af5a}
.strip>button[data-platform="ONI面"]{--face:#2b2b2e;--face-mark:#b5121b;border-top-color:#2b2b2e}
.strip>button[data-platform="SBD面"]{--face:#0f0f12;--face-mark:#d0021b;border-top-color:#d0021b}
.waiting-notice{margin:12px 0;padding:12px 14px;background:#fff7e8;border-left:4px solid #b77924;color:var(--ink);font-size:13px}


/* FIX13: small help dialog, using the existing B palette. */
.heading-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
#help-open{font-size:13px}
/* FIX14: the conversation alone scrolls; composer and heading stay in view. */
#help-dialog{width:min(600px,calc(100% - 24px));height:85dvh;max-height:85dvh;overflow:hidden}
#help-dialog[open]{display:flex;flex-direction:column;gap:12px}
#help-dialog .dialog-head{margin:0;flex-shrink:0}
#help-note{font-size:12px;line-height:1.6;color:var(--muted);margin:0;flex-shrink:0}
#help-conversation{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:4px}
#help-messages{display:flex;flex-direction:column;gap:12px}
.help-message{max-width:85%;padding:12px 14px;border-radius:12px;white-space:pre-wrap;overflow-wrap:anywhere;font-size:15px;line-height:1.7;margin:0}
.help-user{align-self:flex-end;background:var(--soft)}
.help-assistant{align-self:flex-start;background:#fff;border:1px solid var(--line)}
.help-warning{border-left:4px solid var(--warm)}
#help-status:empty{display:none}
#help-form{flex-shrink:0;border-top:1px solid var(--line);padding-top:12px}
#help-input{display:block;min-height:72px;max-height:120px;resize:none;overflow-y:auto;margin:0;font-size:15px;line-height:1.7}
#help-send{display:block;margin:8px 0 0 auto}
#help-examples{display:grid;gap:12px}
#help-examples button{text-align:left;font-size:14px;min-width:0}
/* Visibility is delayed separately from motion, so reduced motion remains static. */
.is-loading::before{content:"";display:inline-block;width:1em;height:1em;margin-right:8px;border:2px solid #b9c8da;border-top-color:var(--blue);border-radius:50%;vertical-align:-.12em;visibility:hidden;animation:loading-reveal 0s .2s forwards,loading-spin .8s .2s linear infinite}
@keyframes loading-reveal{to{visibility:visible}}
@keyframes loading-spin{to{transform:rotate(360deg)}}
.help-thinking{display:flex;gap:5px;min-height:48px;align-items:center}
.typing-dot{width:7px;height:7px;border-radius:50%;background:var(--blue);animation:typing-bounce 1.2s infinite}
.typing-dot:nth-child(2){animation-delay:.15s}.typing-dot:nth-child(3){animation-delay:.3s}
@keyframes typing-bounce{0%,60%,100%{transform:translateY(0)}30%{transform:translateY(-5px)}}
.record-skeleton{height:94px;margin:12px 0;border:1px solid var(--line);border-radius:4px;background:linear-gradient(90deg,#e0e6ee 25%,#f4f6f9 50%,#e0e6ee 75%);background-size:200% 100%;animation:skeleton-sweep 1.6s linear infinite}
@keyframes skeleton-sweep{to{background-position:-200% 0}}
@media(prefers-reduced-motion:reduce){.is-loading::before{animation:loading-reveal 0s .2s forwards}.typing-dot,.record-skeleton{animation:none}}
@media(max-width:600px){.heading{flex-wrap:wrap}.heading-actions{margin-left:auto}}
button.primary.is-loading::before,.strip>button.primary.is-loading::before{border-color:#ffffff66;border-top-color:#fff}

.history-info{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 12px;align-items:center;margin:16px 0}
.history-info input,.history-info select{width:100%;min-width:0}
#history-overseas-field{grid-column:1 / -1}
#history-info-save{grid-column:2;justify-self:start}
#history-info-status{grid-column:1 / -1;margin:0}
#history-excel,#history-pdf{display:block;width:100%;margin:8px 0 0}
@media(max-width:480px){.history-info{grid-template-columns:1fr}#history-info-save{grid-column:1}}
.record.superseded{filter:grayscale(1)}
.record.superseded>summary,.record.superseded .detail>:not(.superseded-note){opacity:.5}
.record.superseded .superseded-note{font-weight:700}