/* FiveMRides Studio — local workspace refresh. Keep the same canvas and controls. */
#fro-debadger {
    --frd-pink: #f04c98; --frd-cyan: #51ddd7; --frd-edge: #2a3544;
    --frd-ink: #edf2f9; --frd-muted: #9caec1;
}
#fro-debadger .fro-step { scroll-margin-top: 125px; overflow-anchor: none; }
#frd-step-picker { color: var(--frd-ink) !important; }
#fro-debadger .frd-workspace-toolbar {
    display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap;
    gap:20px; padding:22px 4px !important; margin:0;
}
.frd-workspace-eyebrow { display:flex; align-items:center; gap:10px; font:700 10px/1.5 Inter,sans-serif !important; letter-spacing:.2em !important; color:var(--frd-cyan) !important; }
.frd-workspace-beta { border:1px solid #f04c9855 !important; background:#f04c9812 !important; padding:2px 7px !important; border-radius:5px !important; color:#ff87bd !important; font-size:9px !important; letter-spacing:.1em !important; }
#fro-debadger .frd-workspace-brand h2 { color:var(--frd-ink) !important; font:650 clamp(23px,2.5vw,32px)/1.2 Inter,sans-serif !important; letter-spacing:-.045em !important; text-transform:none !important; margin:8px 0 4px; }
#fro-debadger .frd-workspace-brand p { color:var(--frd-muted) !important; font-size:12px !important; margin:0; }
.frd-workspace-actions { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
#frd-step-picker .fro-btn, #frd-step-picker .frd-vp-btn, #frd-step-picker .frd-mini-btn, #frd-step-picker .frd-edit-pill {
    display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:38px !important;
    border:1px solid var(--frd-edge) !important; border-radius:9px !important; background:#141c27 !important;
    color:#dce7f3 !important; font:550 12px/1.25 Inter,sans-serif !important; letter-spacing:0 !important; text-transform:none !important;
    padding:9px 13px !important; box-shadow:0 1px 0 #ffffff05 inset !important;
    transition:background .15s,border-color .15s,color .15s !important; cursor:pointer;
}
#frd-step-picker button:not(:disabled):hover { background-color:#202c3b !important; border-color:#698096 !important; color:#fff !important; transform:none !important; }
#frd-step-picker button:focus-visible { outline:2px solid var(--frd-cyan); outline-offset:3px; }
#frd-step-picker button:disabled { opacity:.4; cursor:not-allowed; }
#frd-step-picker button[aria-pressed="true"], #frd-step-picker .frd-vp-btn--active, #frd-step-picker .frd-edit-pill--on {
    color:#86f7ee !important; background:#123031 !important; border-color:#348b87 !important;
}
#frd-step-picker #frd-fullscreen { background:#f04c98 !important; border-color:#f04c98 !important; color:#140913 !important; font-weight:750 !important; }
#frd-step-picker #frd-fullscreen:hover { background:#ff77b3 !important; border-color:#ff77b3 !important; color:#140913 !important; }
#frd-step-picker #frd-fullscreen::before { content:'⛶'; font-size:20px !important; line-height:14px !important; }
#frd-step-picker #frd-focus-view::before { content:'◧'; color:var(--frd-cyan) !important; font-size:17px !important; }
#frd-step-picker #frd-wide-view::before { content:'↔'; font-size:18px !important; }
#frd-step-picker.frd-workspace-wide { width:min(1920px,calc(100vw - 48px)); max-width:none; position:relative; left:50%; transform:translateX(-50%) !important; }
#frd-step-picker .frd-picker-grid { grid-template-columns:minmax(0,1fr) 330px; gap:14px; align-items:stretch; }
#frd-step-picker .frd-viewer-wrap { border:1px solid var(--frd-edge) !important; border-radius:16px !important; background:#101720 !important; min-width:0; min-height:0 !important; }
#frd-step-picker .frd-viewer-hud { gap:6px; padding:13px !important; background:linear-gradient(115deg,#192330,#111923) !important; border-bottom:1px solid #ffffff07; }
#frd-step-picker .frd-viewer-hud .fro-btn { padding:8px 11px !important; min-height:36px !important; font-size:11px !important; }
#frd-step-picker .frd-kbd { font:9px/1.2 ui-monospace,monospace !important; background:#ffffff05 !important; border-color:#435369 !important; opacity:.7; }
#frd-step-picker .frd-view-presets { padding:10px 13px !important; gap:4px; background:#0f1721 !important; border-bottom:1px solid var(--frd-edge); }
#frd-step-picker .frd-view-presets .frd-vp-btn { background:transparent !important; border-color:transparent !important; min-height:32px !important; padding:7px 10px !important; font-size:11px !important; color:#a9bbcf !important; }
#frd-step-picker .frd-view-presets button:hover { background:#20313f !important; color:#80f0e9 !important; }
#frd-step-picker .frd-stage { height:clamp(430px,64vh,860px); background:#080d15 !important; }
#frd-step-picker .frd-stage .frd-canvas { min-height:0 !important; width:100%; height:100%; }
#frd-step-picker .frd-viewer-hint { background:#0e1620 !important; color:#92a6bc !important; font-size:10px !important; line-height:1.8 !important; padding:10px 14px !important; border-color:var(--frd-edge) !important; }
#frd-step-picker .frd-hint-key { border-color:#36485a !important; color:#d5e0ed !important; }
#frd-step-picker .frd-zoom-stack { gap:0; overflow:hidden; border:1px solid #3c5067 !important; border-radius:12px !important; right:18px; background:#111c2ae8 !important; }
#frd-step-picker .frd-zoom-fab { width:42px; height:42px; min-height:42px !important; border:0 !important; border-radius:0 !important; background:transparent !important; font:300 24px/1 Inter,sans-serif !important; box-shadow:none !important; }
#frd-step-picker .frd-zoom-fab + .frd-zoom-fab { border-top:1px solid #3c5067; }
#frd-step-picker .frd-side { background:linear-gradient(160deg,#182330,#101720 55%) !important; border:1px solid var(--frd-edge) !important; border-radius:16px !important; padding:17px !important; gap:14px; height:clamp(640px,calc(64vh + 160px),1020px); max-height:none; }
#frd-step-picker .frd-side-scroll { scrollbar-width:thin; scrollbar-color:#3a5065 transparent !important; padding-right:5px; }
#frd-step-picker .frd-model-select { width:100%; min-width:0; height:43px; border-radius:9px !important; background:#0c141f !important; border-color:#3b4e62 !important; color:#eff6ff !important; font:550 12px Inter,sans-serif !important; }
#frd-step-picker .frd-summary { border:0 !important; border-radius:10px !important; background:#0c141f !important; padding:13px !important; gap:9px; margin-top:14px; }
#frd-step-picker .frd-summary-label { color:#a9b9ca !important; font-size:11px !important; }
#frd-step-picker .frd-summary-value { color:var(--frd-cyan) !important; font:650 15px/1 Inter,sans-serif !important; }
#frd-step-picker .frd-section-title { color:#dae6f3 !important; font:650 11px/1.5 Inter,sans-serif !important; letter-spacing:.03em !important; }
#frd-step-picker .frd-other { border-color:#293849 !important; }
#frd-step-picker .frd-other summary { color:#adbed1 !important; padding-top:18px; padding-bottom:18px; font:550 11px/1.5 Inter,sans-serif !important; letter-spacing:.01em !important; text-transform:none !important; }
#frd-step-picker .frd-other summary::after { color:var(--frd-cyan) !important; }
#frd-step-picker .frd-removed-section { border-color:#f04c9840 !important; border-radius:10px !important; background:#f04c9809 !important; }
#frd-step-picker .frd-removed-chip { border:1px solid #f04c9860 !important; color:#ff9bca !important; background:#f04c9814 !important; font-size:10px !important; padding:6px 9px !important; }
#frd-step-picker .frd-removed-restore { min-height:27px !important; border-color:#43586b !important; font-size:10px !important; }
#frd-step-picker .frd-candidate-hint { color:#a8b7c7 !important; font-size:11px !important; line-height:1.7 !important; }
#frd-step-picker .frd-texact-opt { font-size:11px !important; }
#frd-step-picker .frd-texact-opt:has(input:checked) { background:#173c3c !important; color:#98faf2 !important; }
#frd-step-picker .frd-side-footer { padding-top:14px; border-color:#324153 !important; }
#frd-step-picker #frd-submit { min-height:47px !important; border:1px solid var(--frd-pink) !important; background:var(--frd-pink) !important; color:#170b14 !important; font-weight:750 !important; border-radius:10px !important; }
#frd-step-picker #frd-submit:hover { background:#ff77b3 !important; border-color:#ff77b3 !important; }
#frd-step-picker .frd-cost-note { font-size:11px !important; color:#a8b9cb !important; margin:10px 0 0; }
#frd-step-picker.frd-workspace-focus .frd-picker-grid { grid-template-columns:minmax(0,1fr); }
#frd-step-picker.frd-workspace-focus .frd-side { display:none; }
html.frd-workspace-open, html.frd-workspace-open body { overflow:hidden !important; }
#frd-step-picker.frd-workspace-expanded {
    position:fixed; inset:0; z-index:2147483000; box-sizing:border-box;
    left:0; transform:none !important; width:100%; max-width:none; height:100dvh;
    margin:0; padding:0 20px 18px !important; background:radial-gradient(ellipse at 0 0,#162937 0,transparent 45%),#090f18 !important;
    display:flex; flex-direction:column; overflow:auto;
}
#frd-step-picker[hidden] { display:none !important; }
#frd-step-picker.frd-workspace-expanded .frd-workspace-toolbar { flex:0 0 auto; padding:17px 2px !important; }
#frd-step-picker.frd-workspace-expanded .frd-workspace-brand h2 { font-size:24px !important; }
#frd-step-picker.frd-workspace-expanded .frd-workspace-brand p { display:none; }
#frd-step-picker.frd-workspace-expanded .frd-picker-grid { flex:1 1 auto; min-height:0 !important; }
#frd-step-picker.frd-workspace-expanded .frd-stage { height:auto; flex:1 1 200px; min-height:200px !important; }
#frd-step-picker.frd-workspace-expanded .frd-side { height:100%; min-height:0 !important; max-height:none; }
@media (max-width:1050px) {
    #frd-step-picker .frd-picker-grid { grid-template-columns:minmax(0,1fr) 290px; }
    #frd-step-picker .frd-side { padding:12px !important; }
    #frd-step-picker .frd-viewer-hud .frd-kbd { display:none; }
}
@media (max-width:800px) {
    #frd-step-picker .frd-picker-grid { grid-template-columns:minmax(0,1fr); }
    #frd-step-picker.frd-workspace-wide:not(.frd-workspace-expanded) { width:calc(100vw - 24px); }
    #frd-step-picker .frd-workspace-toolbar { gap:14px; }
    .frd-workspace-actions { width:100%; }
    #frd-step-picker .frd-workspace-actions button { flex:1; font-size:11px !important; padding:9px !important; }
    #frd-step-picker .frd-stage { height:55dvh; min-height:320px !important; }
    #frd-step-picker .frd-side { height:540px; }
    #frd-step-picker.frd-workspace-expanded { padding:0 10px 12px !important; }
    #frd-step-picker.frd-workspace-expanded .frd-picker-grid { flex:0 0 auto; }
    #frd-step-picker.frd-workspace-expanded .frd-stage { height:55dvh; flex:none; min-height:300px !important; }
    #frd-step-picker.frd-workspace-expanded .frd-side { height:540px; }
    #frd-step-picker.frd-workspace-focus .frd-viewer-hint { display:none; }
    #frd-step-picker .frd-viewer-hint { font-size:9px !important; }
}
@media (prefers-reduced-motion:reduce) { #frd-step-picker * { scroll-behavior:auto !important; transition:none !important !important; } }
