/* Reading and layout support for U6. All presentation stays opt-in. */
.board.u6-interface .record-visual-panel {
 --seq-bg:#121e2c; --seq-ink:#edf4fb; --seq-muted:#99adbf; --seq-line:#354b60;
 --seq-tool-bg:#1d3043; --seq-active-bg:#c5ecff; --seq-active-ink:#112b3b;
 --seq-red:#ffb4c3; --seq-green:#a7f0d4; --seq-purple:#d5c7ed; --seq-amber:#efc692; --seq-low:#bdccda; --seq-focus:#9edafa; --seq-readout:rgba(201,223,240,.06);
 position:relative; isolation:isolate; overflow:hidden; background:var(--seq-bg)!important; color:var(--seq-ink);
 padding:18px!important; border:1px solid var(--seq-line)!important; border-radius:18px; box-shadow:0 12px 28px #0003; backdrop-filter:none!important;
 font-family:"Segoe UI","Microsoft YaHei",sans-serif;
}
.board.u6-interface .record-visual-panel::before {
 content:""; position:absolute; inset:0; z-index:0; pointer-events:none; background:radial-gradient(ellipse at 35% -15%,#cbeaff18,transparent 60%); opacity:.5; border:0; mask:none; padding:0;
}
.board.u6-interface .record-visual-panel > * { position:relative; z-index:1; }
.board.u6-interface .record-visual-panel .visual-title { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin:0 0 14px!important; color:var(--seq-ink)!important; text-shadow:none!important; }
.board.u6-interface .record-visual-panel .visual-tools { display:flex; flex-wrap:wrap; gap:8px; }
.board.u6-interface .record-visual-panel .visual-tools > button {
 min-height:34px; padding:7px 10px; border:1px solid var(--seq-line)!important; border-radius:7px; background:var(--seq-tool-bg)!important; color:var(--seq-ink)!important; text-shadow:none!important; font-size:12px; font-weight:600; box-shadow:none!important; transition:border-color .16s,transform .16s;
}
.board.u6-interface .record-visual-panel .visual-tools > button.active { background:var(--seq-active-bg)!important; color:var(--seq-active-ink)!important; border-color:var(--seq-active-bg)!important; }
.board.u6-interface .record-visual-panel .marker-container { display:grid!important; grid-template-columns:repeat(auto-fill,minmax(94px,1fr)); align-items:stretch; justify-content:start; gap:10px!important; padding:3px!important; margin:0; }
.board.u6-interface .record-visual-panel .marker-item {
 --card-top:#17354a; --card-bottom:#112332; --card-edge:#45677e; --card-ink:#ecf6ff; --card-shadow:inset 0 1px 0 #ffffff18,0 4px 8px #0003;
 position:relative!important; isolation:isolate; box-sizing:border-box; display:grid!important; grid-template-rows:24px minmax(0,1fr) 28px; grid-template-columns:minmax(0,1fr); justify-content:stretch; align-items:center; justify-items:center;
 flex:unset!important; width:100%!important; min-width:0!important; max-width:none!important; height:128px!important; min-height:128px!important; max-height:128px!important;
 padding:6px!important; margin:0!important; overflow:hidden!important; border-radius:10px; border:1px solid var(--card-edge)!important; background:linear-gradient(155deg,var(--card-top),var(--card-bottom))!important;
 color:var(--card-ink)!important; box-shadow:var(--card-shadow)!important; opacity:1!important; font-family:inherit; font-variant-numeric:tabular-nums lining-nums; text-align:center; text-shadow:none!important;
 filter:none!important; backdrop-filter:none!important; animation:none!important; transform:none; transition:transform .18s ease,border-color .18s ease; cursor:pointer;
}
.board.u6-interface .record-visual-panel .marker-item::before,
.board.u6-interface .record-visual-panel .marker-item::after { content:none; pointer-events:none; padding:0; mask:none; -webkit-mask:none; background:none; border:0; z-index:0; animation:none!important; filter:none!important; }
.board.u6-interface .record-visual-panel .marker-item > * { position:relative; z-index:1; }
.board.u6-interface .record-visual-panel .marker-item:focus-visible,
.board.u6-interface .record-visual-panel button:focus-visible { outline:2px solid var(--seq-focus)!important; outline-offset:2px; }
.board.u6-interface .record-visual-panel .marker-item.marker-latest { outline:2px solid var(--seq-focus); outline-offset:2px; }
.board.u6-interface .record-visual-panel .marker-item.oval-shape { outline:2px dashed var(--card-edge); outline-offset:-4px; }
.board.u6-interface .record-visual-panel .marker-item[aria-disabled="true"] { cursor:default; }
.board.u6-interface .record-visual-panel .marker-yesterday-ghost { border-style:dashed!important; }
.board.u6-interface .record-visual-panel .marker-head { display:flex!important; align-items:center; justify-content:center; width:100%; height:22px; margin:0; min-height:0; }
.board.u6-interface .record-visual-panel .marker-hand-index { display:none!important; }
.board.u6-interface .record-visual-panel .marker-icon-top { display:flex!important; flex:1; flex-wrap:nowrap; align-content:center; justify-content:center; align-items:center; gap:3px; min-width:0; min-height:0; height:22px; margin:0!important; padding:0!important; font-size:12px!important; line-height:1; color:var(--card-ink); text-shadow:none!important; }
.board.u6-interface .record-visual-panel :is(.marker-status-text,.marker-wild-word,.marker-rush-text,.marker-record-burst-icon) { position:static!important; display:inline-flex; flex:0 0 auto; box-sizing:border-box; align-items:center; justify-content:center; min-width:20px; height:22px!important; min-height:0!important; font-family:inherit!important; font-size:12px!important; font-weight:700!important; line-height:1; padding:0 2px!important; background:var(--seq-readout)!important; border:1px solid rgba(205,226,244,.22)!important; border-radius:5px; opacity:1!important; filter:none!important; animation:none!important; text-shadow:none!important; }
.board.u6-interface .record-visual-panel .marker-icon-top:has(> :nth-child(3)) { gap:2px; }
.board.u6-interface .record-visual-panel .marker-icon-top:has(> :nth-child(3)) > :is(.marker-status-text,.marker-wild-word,.marker-rush-text,.marker-record-burst-icon) { min-width:16px; padding:0 1px!important; }
.board.u6-interface .record-visual-panel :is(.marker-record-burst-icon,.marker-record-burst-big,.marker-record-burst-small) { color:var(--seq-red)!important; }
.board.u6-interface .record-visual-panel :is(.marker-status-wild,.marker-wild-word) { color:var(--seq-green)!important; }
.board.u6-interface .record-visual-panel :is(.marker-status-lock,.marker-rush-text) { color:var(--seq-amber)!important; }
.board.u6-interface .record-visual-panel .marker-inherit-hint { position:static!important; display:inline-flex; flex:0 0 auto; width:16px; height:17px; font-size:12px; line-height:17px; padding:0; color:var(--seq-purple)!important; background:var(--seq-readout)!important; box-shadow:none!important; text-shadow:none!important; }
.board.u6-interface .record-visual-panel .marker-burst-hint { position:relative; width:16px!important; height:16px!important; min-width:16px; padding:0!important; font-size:12px!important; line-height:16px!important; box-shadow:none!important; text-shadow:none!important; animation:none!important; }
.board.u6-interface .record-visual-panel .marker-suppression-dot { width:10px!important; height:10px!important; font-size:7px!important; right:-3px; top:-3px; animation:none!important; }
.board.u6-interface .record-visual-panel .marker-number {
 display:flex!important; align-items:center; justify-content:center; width:100%; height:auto!important; min-height:0; margin:0!important; padding:0!important;
 font-size:28px!important; font-weight:600!important; line-height:1!important; letter-spacing:normal; color:var(--card-ink)!important; -webkit-text-fill-color:currentColor!important;
 background:none!important; text-shadow:none!important; filter:none!important; opacity:1!important; transform:none!important;
}
.board.u6-interface .record-visual-panel .marker-number.marker-number-type { font-size:22px!important; }
.board.u6-interface .record-visual-panel .marker-time { display:flex!important; align-items:center; justify-content:center; width:100%; height:28px; min-height:28px; margin:0!important; padding:0 2px!important; box-sizing:border-box; border:1px solid rgba(205,226,244,.16); border-radius:6px; background:var(--seq-readout)!important; color:var(--seq-ink)!important; font-size:17px!important; font-weight:600!important; line-height:1!important; letter-spacing:normal; white-space:nowrap; }
.board.u6-interface .record-visual-panel .marker-time span { display:inline!important; padding:0!important; margin:0!important; border:0!important; border-radius:0!important; background:none!important; font-size:inherit!important; font-weight:inherit!important; line-height:inherit!important; color:var(--seq-ink)!important; -webkit-text-fill-color:currentColor!important; opacity:1!important; text-shadow:none!important; filter:none!important; }
.board.u6-interface .record-visual-panel .marker-time[data-skill-tone="burst"] span { color:var(--seq-red)!important; }
.board.u6-interface .record-visual-panel .marker-time[data-skill-tone="wild"] span { color:var(--seq-green)!important; }
.board.u6-interface .record-visual-panel .marker-time[data-skill-tone="lock"] span { color:var(--seq-amber)!important; }
.board.u6-interface .record-visual-panel .marker-time[data-skill-tone="recover"] span { color:var(--seq-purple)!important; }
.board.u6-interface .record-visual-panel .marker-time[data-skill-tone="low"] span { color:var(--seq-low)!important; }
.board.u6-interface .record-visual-panel .theory-delta { font-size:13px!important; font-weight:700!important; line-height:18px; color:var(--seq-ink)!important; background:var(--seq-readout); padding:0 3px; border-radius:3px; opacity:1!important; text-shadow:none!important; }
.board.u6-interface .record-visual-panel .theory-delta.theory-negative { color:var(--seq-green)!important; }
.board.u6-interface .record-visual-panel .theory-delta.theory-positive { color:var(--seq-red)!important; }
.board.u6-interface .record-visual-panel .visual-legend { color:var(--seq-muted)!important; border-color:var(--seq-line)!important; }
.board.u6-interface .record-visual-panel .theory-delta.theory-even { color:var(--seq-amber)!important; }
.board.u6-interface .record-visual-panel .yesterday-context-note { color:var(--seq-muted)!important; border-color:var(--seq-line)!important; background:var(--seq-tool-bg)!important; }
.board.u6-interface .record-visual-panel .sequence-help-menu summary { color:var(--seq-ink)!important; background:var(--seq-tool-bg)!important; border:1px solid var(--seq-line)!important; box-shadow:none!important; text-shadow:none!important; border-radius:7px; min-height:34px; box-sizing:border-box; }
.board.u6-interface .record-visual-panel:has(.sequence-help-menu[open]) { overflow:visible; }
.board.u6-interface .record-visual-panel .visual-title:has(.sequence-help-menu[open]) { z-index:10; }
.board.u6-interface .record-visual-panel .visual-tools:has(.sequence-help-menu[open]) { overflow:visible!important; }
.board.u6-interface .record-visual-panel .sequence-help-content { color:var(--seq-ink)!important; background:var(--seq-tool-bg)!important; border-color:var(--seq-line)!important; }
.board.u6-interface .record-visual-panel .visual-tools { position:relative; }
.board.u6-interface .record-visual-panel .sequence-help-menu { position:static!important; }
.board.u6-interface .record-visual-panel .sequence-help-content { width:min(280px,calc(100vw - 80px))!important; box-sizing:border-box; }
.board.u6-interface .record-visual-panel .sequence-help-content span { color:var(--seq-ink)!important; background:var(--seq-readout)!important; }
@media(hover:hover) and (prefers-reduced-motion:no-preference) {
 .board.u6-interface .record-visual-panel .marker-item:not([aria-disabled="true"]):hover { transform:translateY(-2px); border-color:var(--seq-focus)!important; }
}
@media(max-width:600px) {
 .board.u6-interface .record-visual-panel { padding:10px!important; }
 .board.u6-interface .record-visual-panel .marker-container { grid-template-columns:repeat(auto-fill,minmax(86px,1fr))!important; gap:8px!important; }
 .board.u6-interface .record-visual-panel .marker-item { height:122px!important; min-height:122px!important; max-height:122px!important; padding:5px!important; }
}
@media(max-width:480px) {
 #app .board.u6-interface .record-visual-panel .marker-container > .marker-item { grid-template-rows:28px minmax(0,1fr) 22px!important; }
 #app .board.u6-interface .record-visual-panel .marker-container .marker-head { height:28px!important; }
 #app .board.u6-interface .record-visual-panel .marker-container .marker-icon-top { height:28px!important; min-height:28px!important; flex-wrap:wrap; align-content:center; gap:0 2px!important; }
 #app .board.u6-interface .record-visual-panel .marker-container :is(.marker-status-text,.marker-wild-word,.marker-rush-text,.marker-record-burst-icon) { min-width:16px; height:14px!important; padding:0 1px!important; font-size:10px!important; line-height:12px!important; border-radius:3px; }
 #app .board.u6-interface .record-visual-panel .marker-container .marker-number { font-size:22px!important; }
 #app .board.u6-interface .record-visual-panel .marker-container .marker-number-type { font-size:17px!important; }
 #app .board.u6-interface .record-visual-panel .marker-container .marker-time { height:22px!important; min-height:22px!important; margin:0!important; padding:0 1px!important; font-size:12px!important; }
 #app .board.u6-interface .record-visual-panel .marker-container .marker-time span { font-size:inherit!important; padding:0!important; max-width:100%; }
}
@media(prefers-reduced-motion:reduce) {
 .board.u6-interface .record-visual-panel *,
 .board.u6-interface .record-visual-panel::before { animation:none!important; transition:none!important; }
}
@media(forced-colors:active) { .board.u6-interface .record-visual-panel .marker-item { border:1px solid CanvasText!important; } }
