/* Multi-event UI: event picker, event chips, and the shared analysis panels for every event. */
.event-icon-mark{display:inline-block;flex:0 0 auto;width:1em;height:1em;background:currentColor;-webkit-mask:var(--event-icon) center/contain no-repeat;mask:var(--event-icon) center/contain no-repeat}

/* Event picker (upload step 2). Native radios keep arrow-key and label behaviour. */
.event-picker{border:0;padding:0;margin:0 0 22px;min-width:0}
.event-picker legend{padding:0;margin-bottom:12px;font-size:16px;color:var(--ink)}
.event-picker-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:8px}
#upload-prototype .event-tile{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;min-height:92px;padding:14px 6px 12px;border:1px solid #2b3560;border-radius:12px;background:#0b1022;color:#aab3d6;cursor:pointer;transition:border-color .15s,background .15s,color .15s}
#upload-prototype .event-tile:hover{border-color:#4b5590;color:var(--ink)}
#upload-prototype .event-tile input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer;appearance:none}
#upload-prototype .event-tile .event-icon-mark{font-size:36px}
.event-tile-name{font:13px var(--sans);font-weight:550;letter-spacing:-.1px}
#upload-prototype .event-tile:has(input:checked){border-color:#999bff;background:#343466;color:#fff;box-shadow:inset 0 0 0 1px #999bff55}
#upload-prototype .event-tile:has(input:checked) .event-icon-mark{color:#c7c9ff}
#upload-prototype .event-tile:has(input:checked)::after{content:'';position:absolute;top:8px;right:8px;width:7px;height:7px;border-radius:50%;background:var(--accent)}
#upload-prototype .event-tile:has(input:focus-visible){outline:2px solid #c7d2fe;outline-offset:3px}
.event-picker .field-hint{margin:12px 0 0}
.event-hint{display:flex;gap:12px;align-items:flex-start;margin-top:14px;padding:13px 15px;border:1px solid #8c683680;border-radius:10px;background:#2a2418;color:#f3dfb5;font-size:13px;line-height:1.6}
.event-hint svg{flex:0 0 18px;width:18px;height:18px;margin-top:2px;fill:none;stroke:#f0c674;stroke-width:2;stroke-linecap:round}
.event-hint strong{color:#ffe7b3;font-weight:600}
#scramble-modes[hidden]{display:none}
@media(max-width:520px){.event-picker-grid{grid-template-columns:repeat(3,minmax(0,1fr))}#upload-prototype .event-tile{min-height:84px}#upload-prototype .event-tile .event-icon-mark{font-size:32px}}

/* Event chip (home list rows, report header). */
.event-chip{display:inline-flex;align-items:center;gap:6px;font:11px var(--sans);color:#b8c0e3;white-space:nowrap}
.event-chip .event-icon-mark{font-size:15px;color:var(--accent)}
.row-name .row-meta{display:flex;align-items:center;flex-wrap:wrap;gap:4px 10px}
.row-name .row-meta>.event-chip{display:inline-flex;padding:2px 8px 2px 5px;border:1px solid #2b3560;border-radius:999px;background:#0b1022}

/* Report header event line, scramble and move-tape copy controls (all events). */
.report-event{display:flex;align-items:center;flex-wrap:wrap;gap:8px 10px;margin-bottom:10px}
.report-event .event-chip{font-size:12px;color:var(--ink);padding:4px 10px 4px 7px;border:1px solid #2b3560;border-radius:999px;background:#0b1022}
.report-event .event-chip .event-icon-mark{font-size:17px}
.report-event .brand-preview{margin:0}
.report-scramble-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:6px}
.solve-report .report-scramble-heading h3{margin:0}
.report-scramble-heading .report-copy-button{width:auto;min-width:78px;height:30px}
.inspector-timing>div:first-child{align-items:center;gap:10px}
.inspector-timing>div:first-child>#inspector-clock{min-width:56px;text-align:right}
.report-copy-moves{width:auto;margin-left:auto;height:28px;border-color:#ffffff10}
/* Narrow report: the stats grid has 2 full-width rows + turns/TPS; a 3-column grid left a blank third column. */
@media(max-width:1050px){.solve-report .inspector-metrics{grid-template-columns:1fr 1fr}.solve-report .replay-numbers{flex-direction:column}.solve-report .replay-speed{flex-direction:row;justify-content:space-between;padding:0 4px}.solve-report .replay-speed>span{display:inline}}

/* Shared analysis (all events): step groups, skipped steps, method / pauses tiles. */
.report-phase-table tr.report-step-row th{padding:16px 12px 6px;text-align:left;font:500 11px var(--sans);color:#dfe4f7;border-bottom:1px solid #ffffff10}
.report-phase-table tr.report-step-row small{margin-left:10px;color:#8f9ab8;font:11px var(--sans)}
.report-phase-table tr.report-step-child td:first-child{padding-left:26px}
.report-phase-table tr.report-skipped-row td{text-align:left;color:#8f9ab8;font:12px var(--sans)}
.report-phase-table tr.report-skipped-row small{margin-left:10px;color:#6f7a98;font-size:11px}
.report-extra-metrics .report-method-value{font:600 17px var(--sans);letter-spacing:-.2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.report-extra-metrics>div[hidden]{display:none}
/* Home preview: non-3x3 stages show the event icon in the stage colour where a 3x3 shows its cube snapshot. */
.preview-stage-detail .preview-stage-event{flex:0 0 58px;width:58px;height:34px;align-self:center;color:var(--stage-color)}
/* Phone: the phase table keeps Phase / Time / Turns / TPS so it fits 390 px without sideways scrolling; the
   recognition / execution split is summarised in the bar above the table. */
@media(max-width:520px){.report-phase-table th:nth-child(3),.report-phase-table th:nth-child(4),.report-phase-table tr:not(.report-step-row):not(.report-skipped-row) td:nth-child(3),.report-phase-table tr:not(.report-step-row):not(.report-skipped-row) td:nth-child(4){display:none}.report-phase-table td,.report-phase-table th{padding-inline:8px}.report-phase-table{white-space:normal}.report-phase-table td:not(:first-child){white-space:nowrap}}
/* Home rows: keep the upload date on phones (workspace.css hides spans in .row-name small), compact long stage groups. */
.row-name .row-meta>.row-date{display:inline}
/* Without :has() support the checked tile still reads as selected (outline on the focused/checked radio fallback). */
@supports not selector(:has(*)){#upload-prototype .event-tile input{opacity:1;position:static;width:16px;height:16px;appearance:auto;accent-color:#a5a7ff}}