:root { --lime:#cce677; --rose:#b95558; --sand:#e4ecf2; }
    * { box-sizing:border-box; }

    .key { color:var(--blue); font-weight:600; }
    .workspace-nav { display:flex; gap:8px; margin:0; }
    .workspace-tab { border:1px solid var(--line); border-radius:5px; background:var(--panel); color:var(--muted); padding:8px 13px; cursor:pointer; }
    .workspace-tab.active { background:var(--blue); border-color:var(--blue); color:#fff; font-weight:600; }
    .workspace-view { display:none; } .workspace-view.active { display:block; }
    .tabs { display:flex; gap:18px; flex-wrap:wrap; border-bottom:1px solid var(--line); margin-bottom:26px; }
    .tab { color:var(--muted); border:0; border-bottom:2px solid transparent; padding:0 0 10px; background:transparent; cursor:pointer; }
    .tab.active { color:var(--ink); border-color:var(--blue); font-weight:600; }
    .view { display:none; } .view.active { display:block; }
    .process-map { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:18px; }
    .process-lane { min-height:214px; border:1px solid var(--line); border-top:4px solid var(--blue); background:var(--panel); padding:16px; }
    .process-lane.parts { border-top-color:var(--blue); } .process-lane.rma { border-top-color:#9a7020; } .process-lane.materials { border-top-color:var(--rose); }
    .lane-kicker { color:var(--blue); font-weight:700; font-size:12px; margin-bottom:12px; } .parts .lane-kicker { color:var(--blue); } .rma .lane-kicker { color:#8a6a2d; } .materials .lane-kicker { color:var(--rose); }
    .process-lane h3 { margin-bottom:7px; }
    .process-lane { cursor:pointer; transition:border-color .15s,box-shadow .15s; }
    .process-lane:hover { border-color:var(--blue); box-shadow:0 0 0 3px #dce4f0; }
    .process-lane.active { border-color:var(--blue); background:#f4f7fc; }
    .lane-panels { margin-bottom:18px; }
    .lane-panel { display:none; }
    .lane-panel.active { display:block; }
 .process-lane p { color:var(--muted); font-size:13px; }
    .lane-steps { display:grid; gap:7px; margin-top:15px; }
    .lane-step { border-left:2px solid var(--line); padding:2px 0 2px 9px; color:#3a4d58; font-size:13px; }
    .process-link { display:flex; align-items:center; gap:10px; margin:0 0 29px; color:var(--muted); font-size:13px; }
    .process-link::before,.process-link::after { content:""; height:1px; background:var(--line); flex:1; } .process-link b { color:var(--blue); font-weight:600; white-space:nowrap; }
    .rma-flow { display:grid; grid-template-columns:repeat(8,minmax(0,1fr)); gap:10px; margin-bottom:26px; }
    .flow-step { min-height:142px; border:1px solid var(--line); background:var(--panel); padding:13px; position:relative; }
    .flow-step:not(:last-child)::after { content:"→"; position:absolute; right:-16px; top:55px; color:var(--blue); background:var(--paper); width:20px; text-align:center; z-index:1; }
    .number { color:var(--blue); font-weight:700; font-size:12px; margin-bottom:18px; }
    .flow-step p { color:var(--muted); font-size:13px; }
    .flow-step { cursor:pointer; transition:border-color .15s,box-shadow .15s; }
    .flow-step:hover { border-color:var(--blue); box-shadow:0 0 0 3px #dce4f0; }
    .flow-step.active { border-color:var(--blue); background:#f4f7fc; }
    .flow-detail { display:none; margin-top:10px; margin-bottom:26px; border:1px solid var(--blue); border-radius:7px; background:var(--panel); overflow:hidden; }
    .flow-detail.open { display:block; }
    .flow-detail-header { display:flex; justify-content:space-between; align-items:center; padding:14px 18px; background:#f4f7fc; border-bottom:1px solid var(--line); }
    .flow-detail-header h3 { font-size:17px; margin:0; }
    .flow-detail-header button { border:none; background:transparent; font-size:22px; color:var(--muted); cursor:pointer; padding:0 4px; line-height:1; }
    .flow-detail-body { padding:18px; }
    .flow-detail-meta { margin-bottom:16px; font-size:14px; }
    .flow-detail-meta span { color:var(--muted); margin-right:12px; }
    .flow-detail-meta b { color:var(--ink); }
    .flow-detail-help { margin-top:16px; padding:13px 14px; border-left:3px solid var(--lime); background:#f0f4f0; color:#2d4a5a; font-size:14px; }
    .flow-detail video { width:100%; max-width:640px; border:1px solid var(--line); border-radius:5px; }

    .grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
    .card { background:var(--panel); border:1px solid var(--line); border-radius:7px; padding:17px; min-height:172px; }
    .card p { color:var(--muted); font-size:14px; }
    .badge { display:inline-block; margin-top:13px; padding:3px 7px; border-radius:4px; font-size:12px; background:var(--sand); color:var(--blue); font-weight:600; }
    .badge.wait { background:#f3efdf; color:#8a6a30; }
    dl { display:grid; grid-template-columns:120px 1fr; gap:9px 16px; margin:0; } dt { color:var(--muted); } dd { margin:0; }
    .quote { margin-top:16px; padding:13px 14px; border-left:3px solid var(--lime); background:#f0f4f0; color:#2d4a5a; }
    .rules { display:grid; grid-template-columns:1fr 1fr; gap:13px; }
    .rule { padding:15px; border:1px solid var(--line); background:var(--panel); border-radius:7px; }
    code { background:#edf1f4; padding:2px 5px; border-radius:3px; color:#1a5c7a; }
    .split { display:grid; grid-template-columns:1.1fr .9fr; gap:24px; }
    .stage { padding:15px 0; border-bottom:1px solid var(--line); display:grid; grid-template-columns:28px 1fr; gap:11px; }
    .stage:last-child { border-bottom:0; } .stage b { color:var(--blue); }
    .note { padding:18px; border-radius:7px; background:#e7f0ed; }
    .note p { color:#456057; margin-top:7px; }

    .lang-switch { display:flex; align-items:center; gap:6px; }
    .lang-switch select { border:1px solid var(--line); border-radius:5px; background:var(--panel); color:var(--ink); padding:5px 8px; font:13px/1 inherit; cursor:pointer; outline:none; }
    .lang-switch select:focus { border-color:var(--blue); }
    .account-actions { display:flex; align-items:center; gap:8px; font-size:13px; }
    .account-avatar { width:26px; height:26px; display:grid; place-items:center; flex:0 0 26px; overflow:hidden; border-radius:50%; background:#e7edf8; color:var(--blue); font-size:11px; font-weight:700; }
    .account-avatar img { width:100%; height:100%; display:block; object-fit:cover; }
    .account-name { color:var(--muted); max-width:160px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .account-logout { border:0; background:transparent; color:var(--blue); cursor:pointer; padding:4px; font-size:13px; }
    .account-logout:hover { text-decoration:underline; }
    .account-visitors { border:0; background:transparent; color:var(--muted); cursor:pointer; padding:4px; font-size:13px; display:inline-flex; align-items:center; gap:3px; }
    .account-visitors:hover { color:var(--blue); }
    .visitor-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.35); z-index:9998; display:none; }
    .visitor-overlay.active { display:block; }
    .visitor-modal { position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); background:#fff; border-radius:12px; box-shadow:0 8px 32px rgba(0,0,0,0.18); z-index:9999; width:min(560px,92vw); max-height:70vh; display:none; flex-direction:column; overflow:hidden; }
    .visitor-modal.active { display:flex; }
    .visitor-modal-head { display:flex; align-items:center; justify-content:space-between; padding:16px 20px; border-bottom:1px solid #e5e7eb; }
    .visitor-modal-head h3 { margin:0; font-size:15px; font-weight:600; color:#111827; }
    .visitor-modal-close { border:0; background:transparent; font-size:20px; cursor:pointer; color:#9ca3af; padding:0; line-height:1; }
    .visitor-modal-close:hover { color:#374151; }
    .visitor-modal-body { overflow-y:auto; flex:1; padding:8px 0; }
    .visitor-row { display:flex; align-items:center; justify-content:space-between; padding:8px 20px; font-size:13px; }
    .visitor-row:hover { background:#f9fafb; }
    .visitor-row .v-name { font-weight:500; color:#111827; }
    .visitor-row .v-meta { color:#9ca3af; font-size:12px; }
    .visitor-empty { text-align:center; color:#9ca3af; padding:40px 20px; font-size:13px; }
    .access-gate { position:fixed; inset:0; background:#f8fafc; z-index:9990; display:none; align-items:center; justify-content:center; }
    .access-gate.active { display:flex; }
    .access-gate-card { background:#fff; border-radius:16px; box-shadow:0 4px 24px rgba(0,0,0,0.08); padding:40px 48px; max-width:420px; text-align:center; }
    .access-gate-card h2 { margin:0 0 8px; font-size:18px; font-weight:600; color:#111827; }
    .access-gate-card p { margin:0 0 20px; font-size:14px; color:#6b7280; line-height:1.6; }
    .access-gate-card .gate-icon { width:48px; height:48px; margin:0 auto 16px; color:#2563eb; }
    .access-gate-btn { display:inline-flex; align-items:center; gap:6px; padding:10px 24px; background:#2563eb; color:#fff; border:0; border-radius:8px; font-size:14px; font-weight:500; cursor:pointer; transition:background .2s; }
    .access-gate-btn:hover { background:#1d4ed8; }
    .access-gate-btn:disabled { background:#9ca3af; cursor:not-allowed; }
    .gate-status { margin-top:12px; font-size:13px; color:#6b7280; }
    .gate-status.success { color:#059669; }
    .account-access { border:0; background:transparent; color:var(--muted); cursor:pointer; padding:4px; font-size:13px; display:inline-flex; align-items:center; gap:3px; }
    .account-access:hover { color:var(--blue); }
    .access-modal-body { overflow-y:auto; flex:1; padding:8px 0; }
    .access-section-head { padding:8px 20px 4px; font-size:12px; font-weight:600; color:#9ca3af; text-transform:uppercase; letter-spacing:.5px; }
    .access-row { display:flex; align-items:center; justify-content:space-between; padding:8px 20px; font-size:13px; }
    .access-row:hover { background:#f9fafb; }
    .access-row .a-name { font-weight:500; color:#111827; }
    .access-row .a-meta { color:#9ca3af; font-size:12px; }
    .access-row .a-actions { display:flex; gap:6px; }
    .a-btn { border:1px solid #e5e7eb; background:#fff; color:#374151; border-radius:6px; padding:3px 10px; font-size:12px; cursor:pointer; transition:all .15s; }
    .a-btn:hover { border-color:#d1d5db; background:#f9fafb; }
    .a-btn.approve { color:#059669; border-color:#a7f3d0; }
    .a-btn.approve:hover { background:#ecfdf5; }
    .a-btn.revoke { color:#dc2626; border-color:#fecaca; }
    .a-btn.revoke:hover { background:#fef2f2; }
    .badge-pending { display:inline-block; padding:1px 8px; border-radius:99px; font-size:11px; background:#fef3c7; color:#92400e; }
    .badge-approved { display:inline-block; padding:1px 8px; border-radius:99px; font-size:11px; background:#d1fae5; color:#065f46; }
    .source { margin-top:28px; color:var(--muted); font-size:12px; border-top:1px solid var(--line); padding-top:14px; }
    .tutorial-video { width:100%; max-width:840px; display:block; margin-top:22px; border:1px solid var(--line); border-radius:7px; background:#101714; }
    .form-layout { display:block; }
    .form-guidance { margin:8px 0 18px; color:var(--muted); font-size:13px; line-height:1.5; }
    .form-guidance strong { color:var(--rose); font-weight:500; }
    .form-card { background:var(--panel); border:1px solid var(--line); border-radius:7px; padding:22px; }
    .form-card h2 { margin-bottom:4px; } .form-intro { color:var(--muted); margin-bottom:20px; }
    .form-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
    .field { display:grid; gap:6px; min-width:0; } .field.full { grid-column:1 / -1; }
    .rma-basic-row { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:14px; grid-column:1 / -1; align-items:start; }
    .rma-basic-field { grid-template-rows:20px 42px; align-content:start; }
    .rma-contact-row { display:grid; grid-template-columns:minmax(0,0.6fr) minmax(0,1.4fr); gap:14px; grid-column:1 / -1; align-items:start; }
    .rma-contact-field { grid-template-rows:20px 42px; align-content:start; }
    .rma-contact-addr-field { display:grid; gap:6px; min-width:0; }
    .rma-pi-field { position:relative; }
    .rma-pi-field .pi-lookup-status { position:absolute; top:68px; left:0; right:0; }
    label { font-size:13px; color:var(--muted); } label strong { color:var(--rose); font-weight:500; }
    input, textarea, select { box-sizing:border-box; width:100%; height:42px; min-height:42px; border:1px solid var(--line); border-radius:5px; background:#fff; padding:9px 10px; color:var(--ink); font:inherit; outline:none; }
    #contact:disabled, #address:disabled { color:#9ca3af; opacity:1; }
    input:focus, textarea:focus, select:focus { border-color:var(--blue); box-shadow:0 0 0 3px #dce4f0; } textarea { resize:vertical; }
    .pi-lookup-status { min-height:18px; margin:0; font-size:12px; line-height:1.45; }
    .pi-lookup-status[data-tone="success"] { color:#28634e; }
    .pi-lookup-status[data-tone="warning"] { color:#8a6425; }
    .pi-lookup-status[data-tone="error"] { color:var(--rose); }
    .pi-validation-icon { display:inline-block; width:18px; height:18px; font-size:16px; line-height:18px; text-align:center; vertical-align:middle; margin-left:6px; }
    .pi-validation-icon[data-tone="success"] { color:#28634e; }
    .pi-validation-icon[data-tone="warning"] { color:#b45309; }
    .pi-validation-icon[data-tone="error"] { color:var(--rose); }
    .pi-validation-icon[data-tone="loading"] { color:#b45309; }
    .pi-validation-icon:empty { display:none; }
    .ticket-inline-error { display:flex; align-items:center; justify-content:space-between; gap:10px; background:#fef2f2; color:#991b1b; border-left:3px solid #ef4444; padding:8px 12px; margin-bottom:8px; font-size:13px; border-radius:4px; grid-column:1 / -1; }
    .ticket-inline-retry { flex:0 0 auto; border:1px solid #fecaca; border-radius:5px; background:#fff; color:#991b1b; padding:5px 8px; font:inherit; font-size:12px; cursor:pointer; }
    .ticket-inline-retry:hover { background:#fff7f7; border-color:#ef4444; }
    .item-row:only-child .remove-item { display:none; }
    .choice-row { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; } .choice-row select { min-width:0; }
    .actions { display:flex; justify-content:flex-end; gap:10px; margin-top:20px; }
    .btn { border:1px solid var(--line); background:var(--panel); color:var(--ink); padding:9px 13px; border-radius:5px; cursor:pointer; }
    .btn.primary { background:var(--blue); border-color:var(--blue); color:white; } .btn:hover { filter:brightness(.97); }
    .preview { white-space:pre-wrap; background:#132d3d; color:#eef3f5; padding:16px; border-radius:5px; min-height:360px; font:13px/1.6 ui-monospace,SFMono-Regular,Menlo,monospace; }
    .help { margin-top:12px; color:var(--muted); font-size:13px; }
    .line-items { display:grid; gap:10px; } .item-row { display:grid; grid-template-columns:minmax(0,1.4fr) 110px 36px; gap:9px; align-items:end; padding:11px; background:#f6f8fa; border:1px solid var(--line); border-radius:6px; }
    .ticket-row { grid-template-columns:minmax(140px,.65fr) minmax(0,1fr) minmax(120px,.4fr) minmax(120px,.4fr) 36px; }
    .item-row .field { gap:4px; } 
    .ticket-input-wrap { display:flex; gap:0; }
    .ticket-input-wrap input { border-top-right-radius:0; border-bottom-right-radius:0; border-right:0; flex:1; }
    .ticket-input-wrap input.invalid { border-color:var(--rose) !important; box-shadow:0 0 0 2px rgba(185,85,88,.15); }
    .lookup-ticket { height:42px; width:42px; border:1px solid var(--line); border-left:0; background:var(--panel); color:var(--muted); border-radius:0 5px 5px 0; cursor:pointer; font-size:16px; padding:0; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
    .lookup-ticket:hover { background:#f0f4f8; color:var(--blue); border-color:var(--blue); }
    .lookup-ticket:focus { border-color:var(--blue); box-shadow:0 0 0 3px #dce4f0; }
    .lookup-ticket.loading { opacity:.5; pointer-events:none; animation:pulse .8s infinite; }
    .lookup-ticket:disabled { cursor:wait; }
    @keyframes pulse { 0%,100% { opacity:.5; } 50% { opacity:1; } }
.remove-item { height:38px; border:1px solid var(--line); background:var(--panel); color:var(--rose); border-radius:5px; cursor:pointer; font-size:18px; }
    .add-line { margin-top:11px; color:var(--blue); border:1px dashed var(--blue); background:transparent; padding:8px 10px; border-radius:5px; cursor:pointer; }
    .request-stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:18px; }
    .stat { border:1px solid var(--line); background:var(--panel); padding:15px; border-radius:7px; }
    .stat b { display:block; color:var(--blue); font-size:25px; line-height:1.1; margin-bottom:5px; }
    .stat span { color:var(--muted); font-size:13px; }
    .request-toolbar { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)) minmax(33.333%, 2fr) auto; gap:10px; margin-bottom:14px; }
    .request-actions { display:flex; justify-content:space-between; align-items:center; gap:10px; margin:0 0 14px; }
    .request-sync-status { color:var(--muted); font-size:13px; }
    .request-sync-copy { display:flex; align-items:center; gap:8px; min-width:0; }
    .request-sync-retry { border:0; background:transparent; color:var(--blue); padding:3px 0; font:inherit; font-size:12px; font-weight:600; cursor:pointer; white-space:nowrap; }
    .request-sync-retry:hover { color:var(--blue-strong); text-decoration:underline; }
    .error-code-copy { border:0; background:transparent; color:inherit; padding:0; font:inherit; font-weight:700; text-decoration:underline; cursor:pointer; white-space:nowrap; }
    .error-code-copy:hover { color:#7f1d1d; }
    .request-list { width:100%; border-collapse:collapse; background:var(--panel); border:1px solid var(--line); }
    .request-list th, .request-list td { padding:12px; text-align:left; border-bottom:1px solid var(--line); vertical-align:top; }
    .request-list th { color:var(--muted); font-size:12px; font-weight:600; background:#f6f8fa; }
    .request-list tr { cursor:pointer; } .request-list tbody tr:hover { background:#f5f8fb; }
    .request-list tr:last-child td { border-bottom:0; }
    .rma-dashboard-toolbar { display:grid; grid-template-columns:minmax(140px,1fr) minmax(140px,1fr) auto auto auto; gap:10px; margin-bottom:14px; align-items:center; }
    .rma-dashboard-toolbar input, .rma-dashboard-toolbar select { padding:8px 10px; border:1px solid var(--line); border-radius:5px; font-size:14px; }
    .rma-dashboard-toolbar input:focus, .rma-dashboard-toolbar select:focus { outline:none; border-color:var(--blue); box-shadow:0 0 0 2px rgba(36,109,142,0.15); }
    .country-combobox { position:relative; min-width:0; }
    .country-combobox input { padding-right:34px; }
    .country-combobox::after { content:'⌄'; position:absolute; right:12px; top:50%; color:var(--muted); font-size:16px; line-height:1; pointer-events:none; transform:translateY(-55%); }
    .country-option-list { position:absolute; z-index:30; top:calc(100% + 6px); left:0; right:0; max-height:248px; overflow:auto; padding:6px; border:1px solid var(--line); border-radius:8px; background:var(--panel); box-shadow:0 12px 24px rgba(15,23,42,.12); }
    .country-option-list[hidden] { display:none; }
    .country-option { display:block; width:100%; border:0; border-radius:5px; background:transparent; color:var(--ink); padding:9px 10px; text-align:left; cursor:pointer; font:inherit; font-size:14px; }
    .country-option:hover, .country-option:focus { background:var(--blue-soft); color:var(--blue-strong); outline:none; }
    .country-option-empty { padding:9px 10px; color:var(--muted); font-size:13px; }
    #rma-dashboard-workspace .request-table-wrap,
    #information-query-workspace .request-table-wrap { overflow-x:auto; border:1px solid var(--line); border-radius:7px; background:var(--panel); }
   #rma-dashboard-table { min-width:1120px; border:0; }
   #rma-dashboard-table th, #rma-dashboard-table td { padding:13px 14px; vertical-align:middle; }
   #rma-dashboard-table th { position:sticky; top:0; z-index:1; background:#f2f6fa; }
   #rma-dashboard-table th:nth-child(2), #rma-dashboard-table td:nth-child(2) { white-space:normal; overflow-wrap:break-word; word-break:break-word; line-height:1.45; }
   #rma-dashboard-table td:nth-child(1) { color:var(--blue); font-weight:600; }
   #rma-dashboard-table td:nth-child(5), #rma-dashboard-table td:nth-child(6) { color:#34515f; }
    #rma-dashboard-table td:nth-child(7) { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:13px; }

    .rma-dashboard-pagination { display:flex; align-items:center; justify-content:flex-end; gap:10px; margin-top:14px; font-size:13px; color:var(--muted); }
    .rma-dashboard-pagination .btn { min-width:32px; padding:6px 10px; }
   .dashboard-tabs { display:flex; gap:8px; margin:16px 0; }
   .dashboard-tab { appearance:none; border:0; background:transparent; color:var(--muted); cursor:pointer; font:inherit; padding:9px 14px; }
   .dashboard-tab.active { color:var(--blue); font-weight:600; }
    .dashboard-panel { display:none; }
	   .dashboard-panel.active { display:block; }
	   #pre-orders-table { min-width:1060px; border:0; }
	   #pre-orders-table th, #pre-orders-table td { padding:13px 14px; vertical-align:middle; }
	   #pre-orders-table th { position:sticky; top:0; z-index:1; background:#f2f6fa; }
	   #pre-orders-table td:nth-child(4) { white-space:normal; overflow-wrap:break-word; word-break:break-word; line-height:1.45; }
	   #pre-orders-table th:nth-child(5),
   #pre-orders-table td:nth-child(5) { text-align:center; font-variant-numeric:tabular-nums; }
	   #pre-orders-table th:nth-child(6),
   #pre-orders-table td:nth-child(6),
   #pre-orders-table th:nth-child(7),
   #pre-orders-table td:nth-child(7) { text-align:center; white-space:nowrap; }
    .pre-orders-toolbar { display:grid; grid-template-columns:minmax(33.333%,1.5fr) auto auto auto; gap:10px; align-items:center; margin-bottom:14px; }
    .pre-orders-toolbar input { width:100%; padding:8px 10px; border:1px solid var(--line); border-radius:5px; font-size:14px; }
    .pre-orders-toolbar input:focus { outline:none; border-color:var(--blue); box-shadow:0 0 0 2px rgba(36,109,142,0.15); }
   #ticket-dashboard-table { min-width:1060px; border:0; }
   #ticket-dashboard-table th, #ticket-dashboard-table td { padding:13px 14px; vertical-align:middle; }
   #ticket-dashboard-table th { position:sticky; top:0; z-index:1; background:#f2f6fa; }
   #ticket-dashboard-table td:nth-child(1) { color:var(--blue); font-weight:600; }
   #ticket-dashboard-table td:nth-child(2), #ticket-dashboard-table td:nth-child(5) { white-space:normal; overflow-wrap:break-word; word-break:break-word; line-height:1.45; }

    .material-catalog-toolbar { display:grid; grid-template-columns:minmax(220px,1fr) auto minmax(180px,.65fr); gap:10px; align-items:center; margin-bottom:14px; }
    .material-catalog-toolbar input { width:100%; padding:8px 10px; border:1px solid var(--line); border-radius:5px; font-size:14px; }
    .material-catalog-toolbar input:focus { outline:none; border-color:var(--blue); box-shadow:0 0 0 2px rgba(36,109,142,0.15); }
    .material-catalog-sync { color:var(--muted); font-size:12px; text-align:right; white-space:nowrap; }
    .failure-rate-toolbar { display:flex; align-items:center; gap:12px; margin-bottom:14px; flex-wrap:wrap; }
    .failure-rate-summary { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:12px; margin-bottom:18px; }
    .failure-rate-summary .fr-stat { background:var(--panel); border:1px solid var(--line); border-radius:8px; padding:16px 18px; }
    .failure-rate-summary .fr-stat .fr-stat-label { font-size:12px; color:var(--muted); margin-bottom:4px; }
    .failure-rate-summary .fr-stat .fr-stat-value { font-size:28px; font-weight:700; color:var(--ink); font-variant-numeric:tabular-nums; }
    .fr-charts-row { display:grid; grid-template-columns:320px 1fr; gap:16px; margin-bottom:18px; }
    .fr-chart-box { background:var(--panel); border:1px solid var(--line); border-radius:8px; padding:18px; }
    .fr-chart-box h4 { font-size:14px; font-weight:600; margin-bottom:14px; color:var(--ink); }
    /* Donut chart */
    .fr-donut-container { position:relative; width:220px; height:220px; margin:0 auto; }
    .fr-donut-svg { width:100%; height:100%; transform:rotate(-90deg); }
    .fr-donut-svg circle { fill:none; stroke-width:28; transition:stroke-dasharray .8s ease; }
    .fr-donut-center { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); text-align:center; }
    .fr-donut-center .fr-donut-total { font-size:32px; font-weight:700; color:var(--ink); line-height:1; }
    .fr-donut-center .fr-donut-label { font-size:11px; color:var(--muted); margin-top:2px; }
    .fr-donut-legend { display:flex; flex-direction:column; gap:6px; margin-top:12px; }
    .fr-donut-legend-item { display:flex; align-items:center; gap:8px; font-size:12px; color:var(--ink); cursor:pointer; }
    .fr-donut-legend-dot { width:10px; height:10px; border-radius:2px; flex-shrink:0; }
    .fr-donut-legend-pct { margin-left:auto; color:var(--muted); font-variant-numeric:tabular-nums; }
    /* Bar chart */
    .failure-rate-chart { display:flex; flex-direction:column; gap:8px; }
    .fr-bar-row { display:grid; grid-template-columns:120px 1fr 55px; align-items:center; gap:10px; font-size:13px; cursor:pointer; }
    .fr-bar-row:hover .fr-bar-fill { opacity:.85; }
    .fr-bar-label { color:var(--ink); font-weight:500; text-align:right; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .fr-bar-track { background:#f0f0f0; border-radius:4px; height:22px; overflow:hidden; position:relative; }
    .fr-bar-fill { height:100%; border-radius:4px; transition:width .6s ease; min-width:2px; position:relative; }
    .fr-bar-fill.fr-bar-anomaly { animation:frPulse 2s ease-in-out infinite; }
    .fr-bar-pct { font-variant-numeric:tabular-nums; color:var(--muted); font-size:12px; }
    .fr-bar-tooltip { visibility:hidden; position:absolute; bottom:100%; left:50%; transform:translateX(-50%); background:#1e293b; color:#fff; font-size:11px; padding:4px 8px; border-radius:4px; white-space:nowrap; z-index:5; margin-bottom:4px; pointer-events:none; }
    .fr-bar-row:hover .fr-bar-tooltip { visibility:visible; }
    @keyframes frPulse { 0%,100% { box-shadow:0 0 0 0 rgba(220,38,38,.3); } 50% { box-shadow:0 0 0 4px rgba(220,38,38,0); } }
    /* Trend chart */
    .fr-trend-wrap { background:var(--panel); border:1px solid var(--line); border-radius:8px; padding:18px; margin-bottom:18px; }
    .fr-trend-wrap h4 { font-size:14px; font-weight:600; margin-bottom:14px; color:var(--ink); }
    .fr-trend-chart { overflow-x:auto; }
    .fr-trend-svg { min-width:600px; height:200px; display:block; }
    .fr-trend-svg .fr-trend-area { fill:rgba(37,99,235,.08); }
    .fr-trend-svg .fr-trend-line { fill:none; stroke:var(--blue); stroke-width:2; }
    .fr-trend-svg .fr-trend-dot { fill:var(--blue); cursor:pointer; }
    .fr-trend-svg .fr-trend-dot:hover { r:5; }
    .fr-trend-svg text { font-size:11px; fill:var(--muted); }
    .fr-trend-svg .fr-trend-grid { stroke:var(--line); stroke-dasharray:3,3; }
    /* Top-N table */
    .fr-top-n-wrap { margin-bottom:18px; }
    .fr-top-n-wrap h4 { font-size:14px; font-weight:600; margin-bottom:10px; color:var(--ink); }
    #fault-issues-table { min-width:720px; }
   #fault-issues-table td:nth-child(2) { font-variant-numeric:tabular-nums; }
    #fault-issues-table td:nth-child(4) { white-space:normal; overflow-wrap:break-word; word-break:break-word; line-height:1.45; }
    #fault-issues-detail-table { min-width:860px; }
   #fault-issues-detail-table td:nth-child(1) { color:var(--blue); font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:13px; font-weight:600; }
    #failure-rate-topn-table { min-width:680px; }
   #failure-rate-topn-table th, #failure-rate-topn-table td { padding:10px 14px; vertical-align:middle; }
   #failure-rate-topn-table td:nth-child(1) { font-weight:700; color:var(--muted); text-align:center; }
   #failure-rate-topn-table td:nth-child(2) { color:var(--blue); font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:13px; font-weight:600; }
    #failure-rate-topn-table td:nth-child(3) { white-space:normal; overflow-wrap:break-word; word-break:break-word; line-height:1.4; }
   /* Category table */
    #failure-rate-table { min-width:960px; }
   #failure-rate-table th, #failure-rate-table td { padding:12px 14px; vertical-align:middle; }
   #failure-rate-table td:nth-child(3), #failure-rate-table td:nth-child(4), #failure-rate-table td:nth-child(5), #failure-rate-table td:nth-child(6) { font-variant-numeric:tabular-nums; }
    #failure-rate-table td:nth-child(7) { white-space:normal; overflow-wrap:break-word; word-break:break-word; line-height:1.45; }
    .fr-cat-row { cursor:pointer; transition:background .15s; }
    .fr-cat-row:hover { background:#f6f9fc; }
    .fr-cat-badge { display:inline-flex; align-items:center; gap:6px; font-weight:600; }
    .fr-cat-badge::before { content:''; width:10px; height:10px; border-radius:2px; flex-shrink:0; background:var(--cat-color, var(--blue)); }
    .fr-cat-anomaly { color:#dc2626; }
    .fr-mat-chip { display:inline-block; background:#eef2f7; border-radius:4px; padding:2px 8px; margin:2px; font-size:12px; color:#34515f; }
    /* Detail table */
    #failure-rate-detail-table { min-width:680px; }
    #failure-rate-detail-table th, #failure-rate-detail-table td { padding:12px 14px; vertical-align:middle; }
    #failure-rate-detail-table td:nth-child(1) { color:var(--blue); font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:13px; font-weight:600; }
    @media (max-width:900px) { .fr-charts-row { grid-template-columns:1fr; } }
    #after-sales-materials-table { min-width:860px; border:0; }
    #after-sales-materials-table th, #after-sales-materials-table td { padding:12px 14px; vertical-align:middle; }
   #after-sales-materials-table th { position:sticky; top:0; z-index:1; background:#f2f6fa; }
   #after-sales-materials-table td:nth-child(1) { color:var(--blue); font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:13px; font-weight:600; }
    #after-sales-materials-table td:nth-child(2), #after-sales-materials-table td:nth-child(3) { white-space:normal; overflow-wrap:break-word; word-break:break-word; line-height:1.45; }
    .query-material-section { margin-top:30px; padding-top:24px; border-top:1px solid var(--line); }
    .material-result-list { display:grid; gap:10px; }
    .material-result { border:1px solid var(--line); border-radius:6px; padding:14px; background:var(--panel); }
    .material-result-head { display:flex; justify-content:space-between; gap:12px; align-items:baseline; margin-bottom:10px; }
    .material-result-head strong { color:var(--blue); font-size:15px; }
    .material-result-grid { display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:8px 18px; font-size:13px; }
    .material-result-grid span { color:var(--muted); display:block; margin-bottom:2px; }
    @media (max-width:720px) { .material-result-grid { grid-template-columns:repeat(2, minmax(0, 1fr)); } }
    
    .query-panel { background:var(--panel); border:1px solid var(--line); border-radius:7px; padding:20px 22px; margin-bottom:18px; }
    .query-row { display:flex; gap:10px; margin-bottom:14px; }
    .query-row input { flex:1; font-size:15px; height:44px; }
    .query-row .btn { white-space:nowrap; }
    .query-tags { display:flex; gap:8px; }
    .query-tag { padding:4px 12px; border-radius:4px; font-size:13px; border:1px solid var(--line); cursor:pointer; color:var(--muted); }
    .query-tag.active { background:var(--blue); border-color:var(--blue); color:#fff; }
    .query-result { min-height:60px; }
    .query-result-card { background:var(--panel); border:1px solid var(--line); border-radius:7px; padding:18px; margin-bottom:12px; }
    .query-result-card h4 { margin:0 0 10px; font-size:16px; color:var(--blue); }
    .query-result-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px 20px; }
    .query-result-grid .qr { font-size:13px; }
    .query-result-grid .qr span { color:var(--muted); }
    .query-result-grid .qr b { color:var(--ink); margin-left:4px; }
    .query-history { margin-top:28px; }
    .query-history .section-head { margin-bottom:10px; }
    .query-history-item { display:flex; align-items:center; gap:12px; padding:10px 14px; border:1px solid var(--line); border-radius:5px; margin-bottom:6px; cursor:pointer; background:var(--panel); }
    .query-history-item:hover { background:#f0f4f8; }
   .query-history-item .qh-type { font-size:11px; padding:2px 7px; border-radius:3px; background:#e4ecf2; color:var(--blue); white-space:nowrap; }
    .query-segmented { display:inline-flex; gap:4px; padding:4px; background:#eef2f6; border:1px solid var(--line); border-radius:999px; margin-bottom:18px; }
    .query-segmented-btn { border:0; background:transparent; color:var(--muted); font-size:13px; font-weight:600; padding:7px 18px; border-radius:999px; cursor:pointer; transition:background .15s ease,color .15s ease; }
    .query-segmented-btn.active { background:var(--blue); color:#fff; }
    .query-segmented-btn:hover:not(.active) { color:var(--blue); }
    .query-history-filters { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:12px; }
    .query-filter-tab { border:1px solid var(--line); background:var(--panel); color:var(--muted); font-size:12px; font-weight:600; padding:4px 12px; border-radius:999px; cursor:pointer; transition:all .15s ease; }
    .query-filter-tab.active { background:var(--blue); border-color:var(--blue); color:#fff; }
    .query-filter-tab:hover:not(.active) { border-color:var(--blue); color:var(--blue); }
    .query-result-actions { display:flex; gap:8px; margin-top:14px; padding-top:12px; border-top:1px solid var(--line); }
    .query-action-btn { font-size:13px; padding:5px 14px; border-radius:5px; }
    .query-history-item .qh-query { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:14px; flex:1; }
    .query-history-item .qh-time { font-size:12px; color:var(--muted); white-space:nowrap; }
    .query-error { padding:14px 16px; border-left:3px solid var(--rose); background:#fef6f6; color:#7a3d3d; border-radius:0 5px 5px 0; font-size:14px; }
    .query-loading { padding:14px 16px; color:var(--muted); font-size:14px; }
    @media (max-width:610px) { .query-result-grid { grid-template-columns:1fr; } .query-row { flex-wrap:wrap; } }
    .state { display:inline-block; padding:3px 7px; border-radius:4px; font-size:12px; font-weight:600; background:#edf1f4; color:#3d505a; }
    .state.pending { background:#f3efdf; color:#8a6a30; } .state.created { background:#dce4f0; color:#1b5c7a; } .state.done { background:#e0f2ec; color:#2a7a55; } .state.rejected { background:#fdeaea; color:#b94045; }
    .request-detail { margin-top:0; border:1px solid var(--line); background:var(--panel); border-radius:7px; padding:19px; }
    tr.request-detail-row > td { padding:0 !important; border:none !important; background:var(--panel) !important; }
    .detail-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-top:14px; }
    .detail-meta-grid { padding-top:12px; border-top:1px solid var(--line); margin-top:16px; }
    .detail-grid div { color:var(--muted); font-size:13px; } .detail-grid b { display:block; color:var(--ink); font-size:15px; margin-top:3px; font-weight:600; white-space:pre-wrap; overflow-wrap:anywhere; }
    .detail-note { margin-top:15px; padding:11px 12px; border-left:3px solid var(--lime); background:#f0f4f0; color:#2d4a5a; font-size:13px; }
    .detail-actions { display:flex; gap:10px; margin-top:18px; flex-wrap:wrap; }
    .detail-query-result { margin-top:14px; }
    .status-timeline { display:flex; gap:0; margin-top:18px; padding:14px 0; border-top:1px solid var(--line); overflow-x:auto; }
    .status-timeline .step { flex:1; min-width:120px; text-align:center; position:relative; padding-top:24px; }
    .status-timeline .step::before { content:''; position:absolute; top:6px; left:50%; width:12px; height:12px; border-radius:50%; background:var(--line); transform:translateX(-50%); }
    .status-timeline .step.done::before { background:var(--success); }
    .status-timeline .step.current::before { background:var(--blue); box-shadow:0 0 0 4px rgba(37,99,235,.15); }
    .status-timeline .step.rejected::before { background:var(--danger); box-shadow:0 0 0 4px rgba(185,28,28,.12); }
    .status-timeline .step::after { content:''; position:absolute; top:11px; left:50%; width:100%; height:2px; background:var(--line); z-index:-1; }
    .status-timeline .step:last-child::after { display:none; }
    .status-timeline .step.done::after { background:var(--success); }
    .status-timeline .step-label { font-size:12px; color:var(--muted); }
    .status-timeline .step.done .step-label, .status-timeline .step.current .step-label { color:var(--ink); font-weight:600; }
    .status-timeline .step-time { font-size:11px; color:var(--muted); margin-top:2px; }
    .status-timeline .step-helper { max-width:180px; margin:5px auto 0; color:var(--muted); font-size:11px; line-height:1.45; }
    .status-timeline .step.rejected .step-label { color:var(--danger); }
    .confirm-section { margin-bottom:16px; }
    .confirm-section h4 { margin:0 0 8px; font-size:13px; color:var(--muted); }
    .confirm-section-title { margin:0 0 8px; color:var(--ink); font-size:13px; font-weight:700; }
    .confirm-card { border:1px solid var(--line); border-radius:7px; overflow:hidden; }
    .confirm-card-row { display:flex; gap:0; padding:0; border-bottom:1px solid var(--line); }
    .confirm-card-row:last-child { border-bottom:0; }
    .confirm-card-row > div { padding:9px 12px; font-size:13px; border-right:1px solid var(--line); }
    .confirm-card-row > div:last-child { border-right:0; }
    .confirm-card-row .ch-label { color:var(--muted); min-width:110px; background:#f8fafc; font-weight:600; }
    .confirm-card-row .ch-value { flex:1; white-space:pre-wrap; overflow-wrap:anywhere; }
    .confirm-mini-table { width:100%; border-collapse:collapse; font-size:13px; }
    .confirm-mini-table th { background:#f8fafc; color:var(--muted); font-size:11px; font-weight:700; padding:8px 10px; text-align:left; }
    .confirm-mini-table td { padding:8px 10px; border-top:1px solid var(--line); white-space:pre-wrap; overflow-wrap:anywhere; }
    .confirm-table-wrap { overflow-x:auto; border:1px solid var(--line); border-radius:var(--radius-sm); }
    .confirm-table-wrap .confirm-mini-table { min-width:560px; }
    .confirm-table-wrap .confirm-mini-table th { text-align:left; }
    .confirm-table-wrap .confirm-mini-table td { line-height:1.55; vertical-align:top; }
    .dashboard-connection-error { padding:24px 16px !important; color:var(--danger) !important; text-align:center !important; white-space:normal !important; line-height:1.6; }
    .detail-section { margin-top:20px; padding-top:18px; border-top:1px solid var(--line); }
    .detail-section h4 { margin:0 0 10px; color:var(--ink); font-size:14px; }
    .detail-table-wrap { overflow:auto; border:1px solid var(--line); border-radius:var(--radius-sm); }
    .detail-table { width:100%; min-width:640px; border-collapse:collapse; font-size:13px; }
    .detail-table th, .detail-table td { padding:11px 12px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.55; }
    .detail-table th { background:#f8fafc; color:var(--muted); font-size:11px; font-weight:700; }
    .detail-table tr:last-child td { border-bottom:0; }
    .ticket-detail-table { min-width:900px; }
    .ticket-detail-table th:nth-child(1), .ticket-detail-table td:nth-child(1) { width:16%; }
    .ticket-detail-table th:nth-child(2), .ticket-detail-table td:nth-child(2) { width:36%; }
    .ticket-detail-table th:nth-child(3), .ticket-detail-table td:nth-child(3),
    .ticket-detail-table th:nth-child(4), .ticket-detail-table td:nth-child(4) { width:24%; }
    .submission-toast { position:fixed; right:28px; bottom:28px; z-index:40; max-width:min(420px,calc(100vw - 40px)); padding:13px 16px; border:1px solid #bbf7d0; border-radius:10px; background:#f0fdf4; box-shadow:0 12px 30px rgba(15,23,42,.14); color:#166534; font-size:14px; font-weight:600; line-height:1.5; }
    .submission-toast[hidden] { display:none; }
    .modal-backdrop { position:fixed; inset:0; z-index:30; display:grid; place-items:center; padding:20px; background:rgba(23,33,38,.42); }
    .modal-backdrop[hidden] { display:none; }
    .modal { width:min(680px,100%); max-height:min(720px,calc(100vh - 40px)); overflow:auto; background:var(--panel); border:1px solid var(--line); border-radius:7px; box-shadow:0 18px 48px rgba(20,37,48,.2); }
    .modal-header { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:17px 20px; border-bottom:1px solid var(--line); background:#f4f7fc; }
    .modal-header h2 { font-size:18px; }
    .modal-close { border:0; background:transparent; color:var(--muted); font-size:25px; line-height:1; cursor:pointer; padding:2px 5px; }
    .modal-body { padding:20px; }
    .modal-intro { color:var(--muted); margin-bottom:16px; }
    .confirm-list { display:flex; flex-direction:column; gap:14px; }
    .modal-actions { display:flex; justify-content:flex-end; gap:10px; padding:0 20px 20px; }
    .notice-list { display:grid; gap:10px; }
    .notice-item { border:1px solid var(--line); border-radius:7px; background:var(--panel); overflow:hidden; }
    .notice-header { display:flex; align-items:center; gap:12px; padding:13px 16px; cursor:pointer; }
    .notice-header:hover { background:#f6f8fa; }
    .notice-date { font-size:12px; color:var(--muted); white-space:nowrap; min-width:80px; }
    .notice-header h4 { font-size:14px; margin:0; flex:1; }
    .notice-toggle { color:var(--muted); font-size:14px; transition:transform .2s; }
    .notice-item.open .notice-toggle { transform:rotate(90deg); }
    .notice-body { display:none; padding:0 16px 16px; font-size:14px; color:var(--muted); }
    .notice-item.open .notice-body { display:block; }
    .warranty-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
    .warranty-card { border:1px solid var(--line); border-radius:7px; background:var(--panel); padding:18px; }
    .warranty-card h4 { margin:0 0 10px; font-size:15px; }
    .warranty-card ul { margin:0; padding-left:18px; color:var(--muted); font-size:14px; }
    .warranty-card ul li { margin-bottom:5px; }
    .warranty-card p { color:var(--muted); font-size:14px; }
    @media (max-width:610px) { .warranty-grid { grid-template-columns:1fr; } }
    @media (max-width:900px) { .shell { padding:20px 18px 40px; } .split,.form-layout { grid-template-columns:1fr; } .process-map { grid-template-columns:repeat(2,1fr); } .rma-flow { grid-template-columns:repeat(4,1fr); } .rma-flow .flow-step:nth-child(4)::after { display:none; } .grid { grid-template-columns:repeat(2,1fr); } .request-stats { grid-template-columns:repeat(2,1fr); } .request-list { min-width:760px; } .request-table-wrap { overflow:auto; } }
    @media (max-width:640px) { .rma-dashboard-toolbar,.material-catalog-toolbar,.pre-orders-toolbar { grid-template-columns:1fr; } .rma-dashboard-toolbar .btn,.material-catalog-toolbar .btn,.pre-orders-toolbar .btn { width:100%; } .material-catalog-sync { text-align:left; white-space:normal; } .rma-dashboard-pagination { justify-content:space-between; flex-wrap:wrap; } }
    @media (max-width:610px) { .shell { padding:18px; } header { align-items:flex-start; flex-direction:column; } .header-actions { width:100%; justify-content:space-between; } h1 { font-size:32px; } .process-map,.rma-flow,.grid,.rules,.form-grid,.item-row,.request-stats,.detail-grid,.request-toolbar,.rma-basic-row { grid-template-columns:1fr; } .flow-step::after { display:none; } .process-link { white-space:normal; } dl { grid-template-columns:1fr; gap:2px; } .remove-item { width:100%; } .rma-contact-row { grid-template-columns:1fr; } .request-actions { align-items:stretch; flex-direction:column; } }
    /* Mobile: dashboard tables get compact padding + scroll hint */
    @media (max-width:610px) {
      .request-table-wrap { position:relative; }
      .request-table-wrap::after {
        content:'⟷'; position:sticky; right:0; top:50%; transform:translateY(-50%);
        font-size:14px; color:var(--muted); background:rgba(255,255,255,.85);
        padding:4px 6px; border-radius:4px; pointer-events:none; z-index:2;
        opacity:.7; margin-right:4px; display:inline;
      }
      #rma-dashboard-table th, #rma-dashboard-table td,
      #ticket-dashboard-table th, #ticket-dashboard-table td { padding:8px 6px; font-size:12px; }
      #rma-dashboard-table { min-width:800px; }
      #ticket-dashboard-table { min-width:760px; }
      .request-list { min-width:560px; }
      .request-list th, .request-list td { padding:8px 6px; font-size:12px; }
      .request-stats { gap:8px; }
      .stat-card { padding:12px; }
      .stat-card .stat-num { font-size:22px; }
    }

    /* Visual system: keeps the existing markup and interactions intact. */
    :root {
      --paper: #f8fafc;
      --panel: #ffffff;
      --ink: #111827;
      --muted: #6b7280;
      --line: #e5e7eb;
      --blue: #2563eb;
      --blue-strong: #1d4ed8;
      --blue-soft: #eff6ff;
      --blue-line: #bfdbfe;
      --success: #047857;
      --warning: #a16207;
      --danger: #b91c1c;
      --shadow-sm: 0 1px 2px rgba(15, 23, 42, .04), 0 5px 14px rgba(15, 23, 42, .035);
      --shadow-md: 0 10px 28px rgba(15, 23, 42, .07);
      --radius: 14px;
      --radius-sm: 10px;
    }

    body {
      margin: 0;
      min-width: 320px;
      background: var(--paper);
      color: var(--ink);
      font: 14px/1.65 -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
    }
    button, input, textarea, select { font: inherit; }
    button { -webkit-tap-highlight-color: transparent; }
    a { color: var(--blue); text-underline-offset: 3px; }

    /* Use the wide desktop canvas without turning the workspace into edge-to-edge content. */
    .shell {
      width: min(100%, 1760px);
      max-width: 1760px;
      margin: 0 auto;
      padding: 0 clamp(20px, 1.6vw, 36px) 72px;
    }
    header {
      position: relative;
      z-index: 5;
      min-height: 64px;
      display: grid;
      grid-template-columns: auto minmax(0, 1fr) auto;
      align-items: center;
      gap: 28px;
      padding: 12px 0;
      border-bottom: 1px solid var(--line);
    }
    .brand {
      display: inline-flex;
      align-items: center;
      gap: 0;
      color: var(--ink);
      font-size: 15px;
      font-weight: 680;
      line-height: 1;
      letter-spacing: 0;
      white-space: nowrap;
    }
    .brand-mark {
      display: block;
      width: 27px;
      height: 27px;
      flex: 0 0 27px;
      object-fit: contain;
      margin-right: 10px;
      border-radius: 0;
      background: transparent;
      box-shadow: none;
    }
    .workspace-nav {
      justify-content: center;
      gap: 2px;
      min-width: 0;
      padding: 3px;
      border: 1px solid var(--line);
      border-radius: 11px;
      background: rgba(255, 255, 255, .72);
    }
    .workspace-tab {
      border: 0;
      border-radius: 8px;
      background: transparent;
      color: var(--muted);
      padding: 7px 11px;
      font-size: 13px;
      line-height: 1.25;
      transition: color .2s ease, background-color .2s ease, box-shadow .2s ease;
    }
    .workspace-tab:hover { color: var(--ink); background: #f3f4f6; }
    .workspace-tab.active { background: var(--panel); border: 0; color: var(--ink); font-weight: 650; box-shadow: 0 1px 2px rgba(15, 23, 42, .08); }
    .header-actions { display: flex; align-items: center; gap: 13px; margin-left: 0; white-space: nowrap; }
    .status { display:inline-flex; align-items:center; gap:8px; color:var(--muted); font-size:12px; line-height:1.25; }
    .dot { display:block; width:7px; height:7px; flex:0 0 7px; border-radius:50%; background:#10b981; box-shadow:0 0 0 3px #d1fae5; }
    .lang-switch { padding-left: 12px; border-left: 1px solid var(--line); }
    .lang-switch select {
      height: 30px;
      border: 0;
      border-radius: 7px;
      background: #f3f4f6;
      color: var(--ink);
      padding: 4px 26px 4px 8px;
      font-size: 12px;
    }
    .account-actions { gap: 8px; font-size: 12px; }
    .account-avatar { width:28px; height:28px; flex-basis:28px; font-size:11px; }
    .account-logout { color: var(--blue); font-size: 12px; }

    .hero {
      position: relative;
      display: grid;
      grid-template-columns: minmax(0, 820px) minmax(260px, 1fr);
      align-items: end;
      min-height: 248px;
      padding: 74px 0 56px;
      border-bottom: 1px solid var(--line);
    }
    .hero[hidden] { display: none; }
    .hero > div { position: relative; z-index: 1; }
    .hero::after {
      content: "SVEA / RMA";
      justify-self: end;
      align-self: center;
      color: #e9eef7;
      font-size: clamp(34px, 5vw, 72px);
      font-weight: 750;
      line-height: 1;
      white-space: nowrap;
      pointer-events: none;
    }
    h1 { max-width: 820px; margin: 0 0 16px; color: var(--ink); font-size: clamp(36px, 4vw, 56px); font-weight: 740; line-height: 1.12; }
    h2 { color: var(--ink); font-size: 21px; font-weight: 700; line-height: 1.3; }
    h3 { color: var(--ink); font-weight: 680; line-height: 1.35; }
    .hero-copy { max-width: 760px; color: var(--muted); font-size: 16px; line-height: 1.8; }

    .workspace-view { padding-top: 46px; }
    .section-head { align-items: end; gap: 20px; margin: 0 0 18px; }
    .section-head h2, .section-head h3 { letter-spacing: 0; }
    .section-head span { max-width: 600px; color: var(--muted); font-size: 13px; line-height: 1.5; text-align: right; }
    .overview-notice-head { margin-top: 34px; }

    .notice-list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
    .notice-item {
      min-height: 108px;
      border: 1px solid transparent;
      border-radius: var(--radius);
      background: var(--panel);
      box-shadow: var(--shadow-sm);
      transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
    }
    .notice-item:hover { transform: translateY(-2px); border-color: var(--blue-line); box-shadow: var(--shadow-md); }
    .notice-header { min-height: 108px; align-items: flex-start; gap: 10px; padding: 18px; }
    .notice-date {
      min-width: auto;
      border-radius: 999px;
      background: var(--blue-soft);
      color: var(--blue-strong);
      padding: 3px 8px;
      font-size: 11px;
      font-variant-numeric: tabular-nums;
      line-height: 1.45;
    }
    .notice-header h4 { color: var(--ink); font-size: 14px; font-weight: 670; line-height: 1.55; }
    .notice-toggle { margin-left: auto; color: var(--blue); font-size: 16px; line-height: 1.3; }
    .notice-body { padding: 0 18px 18px; color: var(--muted); font-size: 13px; line-height: 1.75; }
    .notice-item.open { grid-column: span 3; }
    .notice-item.open .notice-header { min-height: auto; padding-bottom: 12px; }

    .warranty-grid { gap: 18px; }
    .warranty-card {
      position: relative;
      min-height: 226px;
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: var(--panel);
      padding: 25px 26px 24px;
      box-shadow: var(--shadow-sm);
      overflow: hidden;
    }
    .warranty-card::before {
      content: "";
      display: block;
      width: 30px;
      height: 4px;
      margin-bottom: 17px;
      border-radius: 999px;
      background: var(--blue);
    }
    .warranty-card:nth-child(2)::before { background: #0f766e; }
    .warranty-card h4 { margin: 0 0 13px; font-size: 17px; font-weight: 700; }
    .warranty-card ul { padding-left: 20px; color: var(--muted); font-size: 14px; line-height: 1.75; }
    .warranty-card ul li { margin-bottom: 7px; padding-left: 3px; }
    .help { color: var(--muted); font-size: 13px; }

    .process-map { gap: 16px; margin-bottom: 28px; }
    .process-lane {
      min-height: 280px;
      display: flex;
      flex-direction: column;
      border: 1px solid var(--line);
      border-top: 1px solid var(--line);
      border-radius: var(--radius);
      background: var(--panel);
      padding: 22px 20px 20px;
      box-shadow: var(--shadow-sm);
      overflow: hidden;
      transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease, background-color .2s ease;
    }
    .process-lane.parts, .process-lane.rma, .process-lane.materials { border-top-color: var(--line); }
    .process-lane:hover { border-color: var(--blue-line); box-shadow: var(--shadow-md); transform: translateY(-2px); }
    .process-lane.active { border-color: var(--blue); background: var(--blue-soft); box-shadow: 0 8px 24px rgba(37, 99, 235, .12); }
    .lane-kicker, .parts .lane-kicker, .rma .lane-kicker, .materials .lane-kicker {
      display: inline-flex;
      width: fit-content;
      margin-bottom: 30px;
      color: var(--blue);
      font-size: 11px;
      font-weight: 720;
      line-height: 1;
    }
    .process-lane h3 { margin-bottom: 9px; font-size: 21px; }
    .process-lane p { color: var(--muted); font-size: 13px; line-height: 1.7; }
    .lane-steps { gap: 9px; margin-top: auto; padding-top: 24px; }
    .lane-step { border-left: 0; border-top: 1px solid var(--line); padding: 9px 0 0; color: #374151; font-size: 12px; line-height: 1.5; }
    .process-lane.active .lane-step { border-color: var(--blue-line); }
    .lane-panels { margin-bottom: 46px; }
    .lane-panel.active { animation: panel-enter .22s ease both; }
    @keyframes panel-enter { from { opacity: .4; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
    .process-link { margin: 0 0 32px; color: var(--muted); }
    .process-link::before, .process-link::after { background: var(--line); }
    .process-link b { color: var(--blue); }

    .rma-flow { gap: 12px; margin-bottom: 22px; }
    .flow-step {
      min-height: 178px;
      border: 1px solid var(--line);
      border-radius: var(--radius-sm);
      background: var(--panel);
      padding: 17px 15px 15px;
      box-shadow: none;
      transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease, background-color .2s ease;
    }
    .flow-step:not(:last-child)::after {
      right: -16px;
      top: 27px;
      width: 20px;
      color: #94a3b8;
      background: transparent;
      font-size: 16px;
    }
    .flow-step:hover { border-color: var(--blue-line); box-shadow: var(--shadow-sm); transform: translateY(-2px); }
    .flow-step.active { border-color: var(--blue); background: var(--blue-soft); box-shadow: 0 7px 18px rgba(37, 99, 235, .1); }
    .number { margin-bottom: 25px; color: var(--blue); font-size: 12px; font-weight: 750; }
    .flow-step h3 { margin-bottom: 7px; font-size: 14px; }
    .flow-step p { color: var(--muted); font-size: 12px; line-height: 1.65; }
    .flow-detail { border: 1px solid var(--blue-line); border-radius: var(--radius); background: var(--panel); box-shadow: var(--shadow-sm); }
    .flow-detail-header { padding: 17px 20px; border-bottom: 1px solid var(--line); background: var(--blue-soft); }
    .flow-detail-header h3 { font-size: 16px; }
    .flow-detail-body { padding: 22px; }
    .flow-detail-help { border-left-color: var(--blue); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; background: #f8fafc; color: #374151; }
    .flow-detail video, .tutorial-video { border: 1px solid var(--line); border-radius: var(--radius-sm); }

    .tabs, .dashboard-tabs {
      gap: 2px;
      width: fit-content;
      max-width: 100%;
      margin: 0 0 28px;
      padding: 4px;
      border: 1px solid var(--line);
      border-radius: 11px;
      background: #f3f4f6;
      overflow-x: auto;
    }
    .tab, .dashboard-tab {
      flex: 0 0 auto;
      border: 0;
      border-bottom: 0;
      border-radius: 8px;
      color: var(--muted);
      padding: 8px 12px;
      font-size: 13px;
      transition: color .2s ease, background-color .2s ease, box-shadow .2s ease;
    }
    .tab:hover, .dashboard-tab:hover { color: var(--ink); }
    .tab.active, .dashboard-tab.active { border: 0; background: var(--panel); color: var(--ink); font-weight: 650; box-shadow: 0 1px 2px rgba(15, 23, 42, .08); }

    /* Keep the RMA dashboard views available at the title level. */
    .dashboard-section-head {
      align-items: center;
      flex-wrap: wrap;
      margin-bottom: 26px;
    }
    .dashboard-heading-row {
      display: flex;
      align-items: center;
      flex: 1 1 auto;
      flex-wrap: wrap;
      gap: 12px;
      min-width: 0;
    }
    .dashboard-heading-row .dashboard-tabs {
      flex: 0 1 auto;
      margin: 0;
    }
    .dashboard-section-head > span {
      flex: 0 1 360px;
    }

    .form-card, .query-panel, .request-detail {
      border: 1px solid var(--line);
      border-radius: var(--radius);
      background: var(--panel);
      box-shadow: var(--shadow-sm);
    }
    .form-card { padding: 28px; }
    .form-card h2 { font-size: 19px; }
    .form-guidance { margin: 10px 0 20px; color: var(--muted); font-size: 13px; }
    .form-intro { margin-bottom: 24px; color: var(--muted); }
    .form-grid { gap: 18px; }
    .field { gap: 7px; }
    label { color: #4b5563; font-size: 12px; font-weight: 580; }
    label strong { color: var(--danger); }
    input, textarea, select {
      height: 44px;
      min-height: 44px;
      border: 1px solid #d1d5db;
      border-radius: var(--radius-sm);
      background: #fff;
      color: var(--ink);
      padding: 10px 12px;
      transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
    }
    textarea { min-height: 108px; line-height: 1.6; }
    input:hover, textarea:hover, select:hover { border-color: #9ca3af; }
    input:focus, textarea:focus, select:focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(37, 99, 235, .12); }
    .rma-basic-field { grid-template-rows: 20px 44px; }
    .rma-pi-field .pi-lookup-status { top: 70px; }
    .item-row { border: 1px solid var(--line); border-radius: var(--radius-sm); background: #f9fafb; padding: 13px; }
    .ticket-input-wrap input { border-radius: var(--radius-sm) 0 0 var(--radius-sm); }
    .lookup-ticket { height: 44px; border-color: #d1d5db; border-radius: 0 var(--radius-sm) var(--radius-sm) 0; }
    .lookup-ticket:hover { background: var(--blue-soft); color: var(--blue); border-color: var(--blue); }
    .remove-item { height: 40px; border-radius: var(--radius-sm); border-color: #fecaca; background: #fff; color: var(--danger); }
    .add-line { border: 1px dashed var(--blue); border-radius: var(--radius-sm); color: var(--blue); padding: 9px 12px; font-weight: 600; }
    .add-line:hover { background: var(--blue-soft); }
    .actions { gap: 10px; margin-top: 26px; }
    .btn {
      min-height: 38px;
      border: 1px solid #d1d5db;
      border-radius: 9px;
      background: var(--panel);
      color: #374151;
      padding: 8px 13px;
      font-size: 13px;
      font-weight: 620;
      transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease, border-color .18s ease;
    }
    .btn:hover { filter: none; border-color: #9ca3af; background: #f9fafb; box-shadow: 0 1px 2px rgba(15, 23, 42, .05); }
    .btn:active { transform: translateY(1px); box-shadow: none; }
    .btn.primary { border-color: var(--blue); background: var(--blue); color: #fff; }
    .btn.primary:hover { border-color: var(--blue-strong); background: var(--blue-strong); box-shadow: 0 5px 12px rgba(37, 99, 235, .2); }

    .query-panel { padding: 22px; margin-bottom: 22px; }
    .query-row { gap: 10px; margin-bottom: 16px; }
    .query-row input { height: 46px; font-size: 14px; }
    .query-tags { flex-wrap: wrap; gap: 7px; }
    .query-tag { border: 1px solid var(--line); border-radius: 999px; padding: 5px 11px; color: var(--muted); font-size: 12px; transition: all .18s ease; }
    .query-tag:hover { border-color: var(--blue-line); color: var(--blue); background: var(--blue-soft); }
   .query-tag.active { border-color: var(--blue); background: var(--blue); color: #fff; }
    .query-segmented { background: var(--blue-soft); border-color: var(--blue-line); }
    .query-segmented-btn:hover:not(.active) { background: rgba(37, 99, 235, .08); }
    .query-filter-tab { border-radius: var(--radius-sm); transition: all .18s ease; }
    .query-filter-tab:hover:not(.active) { border-color: var(--blue-line); background: var(--blue-soft); }
    .query-action-btn { border-radius: var(--radius-sm); }
    .query-action-btn:hover { border-color: var(--blue-line); color: var(--blue); background: var(--blue-soft); }
   .query-result-card, .material-result { border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-sm); }
    .query-result-card { padding: 22px; }
    .query-result-card h4, .material-result-head strong { color: var(--blue); }
    .query-history-item { border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 12px 14px; transition: background-color .18s ease, border-color .18s ease; }
    .query-history-item:hover { border-color: var(--blue-line); background: var(--blue-soft); }
    .query-history-item .qh-type { border-radius: 999px; background: var(--blue-soft); color: var(--blue); }

    .request-stats { gap: 16px; margin-bottom: 24px; }
    .stat { border: 1px solid var(--line); border-radius: var(--radius); padding: 19px; box-shadow: var(--shadow-sm); cursor:pointer; transition:border-color .2s, box-shadow .2s, transform .2s; }
    .stat b { color: var(--blue); font-size: 28px; }
    .stat span { color: var(--muted); font-size: 12px; }
    .stat:hover, .stat:focus-visible { border-color:var(--blue-line); box-shadow:var(--shadow-md); transform:translateY(-2px); outline:none; }
    .stat.active { border-color:var(--blue); background:var(--blue-soft); box-shadow:0 0 0 3px rgba(37,99,235,.10); }
    .request-toolbar, .rma-dashboard-toolbar, .material-catalog-toolbar, .pre-orders-toolbar { gap: 12px; margin-bottom: 18px; }
    .rma-dashboard-toolbar .btn, .material-catalog-toolbar .btn, .pre-orders-toolbar .btn { min-height: 34px; padding: 6px 12px; font-size: 12px; font-weight: 600; white-space: nowrap; }
    .request-list { min-width: 1420px; border: 1px solid var(--line); border-radius: var(--radius-sm); table-layout: fixed; }
    .request-list th, .request-list td { border-bottom-color: var(--line); padding: 13px 14px; }
    .request-list th { background: #f8fafc; color: #6b7280; font-size: 11px; font-weight: 700; }
    .request-list tbody tr:hover { background: #f8fbff; }
    /* Every operational field stays on one line; only remarks can use multiple lines. */
    .request-list th { white-space: nowrap; }
    .request-list tbody > tr:not(.request-detail-row) > td { white-space: nowrap; }
    .request-list th:nth-child(1), .request-list tbody > tr:not(.request-detail-row) > td:nth-child(1) { width: 112px; }
    .request-list th:nth-child(2), .request-list tbody > tr:not(.request-detail-row) > td:nth-child(2) { width: 210px; }
    .request-list th:nth-child(3), .request-list tbody > tr:not(.request-detail-row) > td:nth-child(3) { width: 92px; }
    .request-list th:nth-child(4), .request-list tbody > tr:not(.request-detail-row) > td:nth-child(4) { width: 118px; }
    .request-list th:nth-child(5), .request-list tbody > tr:not(.request-detail-row) > td:nth-child(5) { width: 86px; }
    .request-list th:nth-child(6), .request-list tbody > tr:not(.request-detail-row) > td:nth-child(6) { width: 88px; }
    .request-list th:nth-child(8), .request-list tbody > tr:not(.request-detail-row) > td:nth-child(8) { width: 148px; }
    .request-list th:nth-child(9), .request-list tbody > tr:not(.request-detail-row) > td:nth-child(9) { width: 170px; }
    .request-list th:nth-child(7), .request-list tbody > tr:not(.request-detail-row) > td:nth-child(7) { min-width: 330px; white-space: normal; overflow-wrap: anywhere; }
    .request-list .state { display: inline-flex; white-space: nowrap; }
    .submitter-cell { display:flex; align-items:center; gap:8px; min-width:128px; }
    .submitter-avatar { width:26px; height:26px; display:grid; place-items:center; flex:0 0 26px; overflow:hidden; border-radius:50%; background:#e7edf8; color:var(--blue); font-size:11px; font-weight:700; }
    .submitter-avatar img { display:block; width:100%; height:100%; object-fit:cover; }
    .submitter-name { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
    .request-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    #rma-dashboard-workspace .request-table-wrap { border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-sm); }
    #rma-dashboard-table th, #ticket-dashboard-table th, #after-sales-materials-table th { background: #f8fafc; }
    .rma-dashboard-pagination { gap: 10px; margin-top: 16px; }
    .state { border-radius: 999px; padding: 4px 8px; font-size: 11px; }
    .state.pending { background: #fffbeb; color: var(--warning); }
    .state.created { background: var(--blue-soft); color: var(--blue-strong); }
    .state.done { background: #ecfdf5; color: var(--success); }
    .state.rejected { background: #fef2f2; color: var(--rose); }

    .modal-backdrop { background: rgba(15, 23, 42, .38); backdrop-filter: blur(3px); }
    .modal { border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 24px 64px rgba(15, 23, 42, .2); }
    .modal-header { padding: 19px 22px; border-bottom-color: var(--line); background: #fff; }
    .modal-body { padding: 22px; }

    .source { margin-top: 56px; border-top-color: var(--line); padding-top: 20px; color: var(--muted); }
    :focus-visible { outline: 3px solid rgba(37, 99, 235, .28); outline-offset: 2px; }

    @media (max-width: 1180px) {
      header { grid-template-columns: auto 1fr; gap: 12px 22px; }
      .workspace-nav { justify-content: flex-start; grid-column: 1 / -1; grid-row: 2; overflow-x: auto; }
      .header-actions { grid-column: 2; justify-self: end; }
      .status { display: none; }
      .hero { grid-template-columns: minmax(0, 1fr) auto; min-height: 216px; padding-top: 58px; }
      .notice-list { grid-template-columns: 1fr; }
      .notice-item.open { grid-column: auto; }
      .notice-header { min-height: 0; }
      .process-map { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .rma-flow { grid-template-columns: repeat(4, minmax(0, 1fr)); }
      .rma-flow .flow-step:nth-child(4)::after { display: none; }
    }
    @media (max-width: 760px) {
      .shell { padding: 0 18px 48px; }
      header { display: flex; flex-wrap: wrap; min-height: auto; padding: 14px 0; gap: 12px; }
      .brand { margin-right: auto; }
      .header-actions { margin-left: auto; }
      .workspace-nav { order: 3; width: 100%; justify-content: flex-start; overflow-x: auto; }
      .workspace-tab { padding: 8px 10px; }
      .account-name, .account-logout { display: none; }
      .lang-switch { padding-left: 0; border-left: 0; }
      .hero { grid-template-columns: 1fr; min-height: 0; padding: 46px 0 42px; }
      .hero::after { display: none; }
      h1 { font-size: 36px; }
      .hero-copy { font-size: 15px; }
      .workspace-view { padding-top: 34px; }
      .section-head { align-items: flex-start; flex-direction: column; gap: 5px; margin-bottom: 15px; }
      .section-head span { text-align: left; }
      .dashboard-section-head { align-items: flex-start; gap: 10px; margin-bottom: 22px; }
      .dashboard-heading-row { width: 100%; gap: 10px; }
      .dashboard-section-head > span { flex-basis: auto; }
      .process-map, .warranty-grid { grid-template-columns: 1fr; }
      .process-lane { min-height: 218px; }
      .rma-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .rma-flow .flow-step:nth-child(2n)::after { display: none; }
      .flow-step { min-height: 154px; }
      .form-card { padding: 20px; }
      .query-row { flex-wrap: wrap; }
      .query-row input { flex-basis: 100%; }
      .request-actions { align-items: flex-start; }
    }
    @media (max-width: 460px) {
      .header-actions { gap: 6px; }
      .workspace-nav { border-radius: 10px; }
      .workspace-tab { font-size: 12px; }
      h1 { font-size: 32px; }
      .rma-flow { grid-template-columns: 1fr; }
      .flow-step::after { display: none; }
      .notice-header { padding: 15px; }
      .notice-date { font-size: 10px; }
      .warranty-card { padding: 21px; }
    }
    .bridge-status { height:3px; width:100%; background:var(--line); transition:background .3s; }
    .bridge-status.ok { background:#22c55e; }
    .bridge-status.down { background:var(--rose); }
    .bridge-status.warn { background:#f59e0b; }
    .bridge-status-text { position:fixed; top:0; right:0; z-index:60; font-size:11px; padding:3px 10px; border-radius:0 0 0 6px; background:#fffbeb; color:#92400e; border:1px solid #fde68a; border-top:0; }
    .bridge-status-text.ok { background:#f0fdf4; color:#166534; border-color:#bbf7d0; }
    .bridge-status-text.down { background:#fef2f2; color:#991b1b; border-color:#fecaca; }
    .bridge-status-text[hidden] { display:none; }
    .spinner { display:inline-block; width:16px; height:16px; border:2px solid var(--line); border-top-color:var(--blue); border-radius:50%; animation:spin .6s linear infinite; vertical-align:middle; margin-right:6px; }
    .spinner-sm { display:inline-block; width:14px; height:14px; border:2px solid var(--line); border-top-color:var(--blue); border-radius:50%; animation:spin .6s linear infinite; vertical-align:middle; }
    @keyframes spin { to { transform:rotate(360deg); } }
    .skeleton-row { text-align:center; color:var(--muted); padding:24px; }
    .query-loading::before { content:''; display:inline-block; width:14px; height:14px; border:2px solid var(--line); border-top-color:var(--blue); border-radius:50%; animation:spin .6s linear infinite; vertical-align:middle; margin-right:8px; }
    .request-sync-status[data-tone="loading"]::before { content:''; display:inline-block; width:12px; height:12px; border:2px solid var(--line); border-top-color:var(--blue); border-radius:50%; animation:spin .6s linear infinite; vertical-align:middle; margin-right:6px; }
    @keyframes rowFlash { 0% { background:#dbeafe; } 100% { background:transparent; } }
    .row-highlight { animation: rowFlash 3s ease-out; }
    .nav-cards { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:24px; }
    .nav-card { background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:28px 24px; cursor:pointer; transition:box-shadow .2s, transform .2s; }
    .nav-card:hover { box-shadow:0 4px 12px rgba(0,0,0,.08); transform:translateY(-2px); }
    .nav-card h3 { margin:0 0 6px; font-size:16px; color:var(--ink); }
    .nav-card p { margin:0; font-size:13px; color:var(--muted); }
    .nav-card .nav-card-icon { font-size:28px; margin-bottom:12px; display:block; }
    .process-detail-back { display:inline-flex; align-items:center; gap:6px; margin-bottom:16px; padding:6px 14px; border:1px solid var(--line); border-radius:7px; background:var(--panel); color:var(--blue); cursor:pointer; font-size:13px; }
    .process-detail-back:hover { background:var(--blue-soft); border-color:var(--blue-line); }
    @media(max-width:768px){ .nav-cards{grid-template-columns:repeat(2,1fr);} }
    @media(max-width:480px){ .nav-cards{grid-template-columns:1fr;} }
    .header-link { border:1px solid var(--blue); background:var(--blue); color:#fff; cursor:pointer; padding:6px 14px; font-size:13px; font-weight:600; border-radius:7px; transition:all .15s ease; display:inline-flex; align-items:center; gap:5px; }
    .header-link:hover { background:#1d4ed8; border-color:#1d4ed8; color:#fff; }
    .header-link::before { content:'\1F4CB'; font-size:14px; }
    #account-actions { position:relative; }
    .account-trigger { display:flex; align-items:center; gap:8px; border:0; background:transparent; cursor:pointer; padding:2px 4px; border-radius:8px; font-size:13px; }
    .account-trigger:hover { background:#f3f4f6; }
    .account-dropdown { position:absolute; top:calc(100% + 4px); right:0; min-width:160px; background:var(--panel); border:1px solid var(--line); border-radius:10px; box-shadow:0 8px 24px rgba(15,23,42,.12); padding:4px; z-index:60; }
    .account-dropdown[hidden] { display:none; }
    .dropdown-item { display:block; width:100%; text-align:left; border:0; background:transparent; padding:8px 12px; font-size:13px; color:var(--ink); cursor:pointer; border-radius:6px; }
    .dropdown-item:hover { background:#f3f4f6; }
    .dropdown-item[hidden] { display:none; }
    .mobile-tab-bar { display:none; }
    @media(max-width:610px){
      .mobile-tab-bar { display:flex; position:fixed; bottom:0; left:0; right:0; z-index:50; background:var(--panel); border-top:1px solid var(--line); padding:6px 0 env(safe-area-inset-bottom, 6px); }
      .mobile-tab { flex:1; display:flex; flex-direction:column; align-items:center; gap:2px; padding:4px; border:0; background:none; font-size:10px; color:var(--muted); cursor:pointer; }
      .mobile-tab.active { color:var(--blue); }
      .mobile-tab span { font-size:10px; }
      .shell { padding-bottom:70px !important; }
      .workspace-nav { display:none; }
    }
    .confirm-section-title { font-size:12px; font-weight:600; color:var(--muted); text-transform:uppercase; letter-spacing:.05em; margin-bottom:8px; }

    /* Contextual alignment: align by information type instead of centering every surface. */
    .btn,
    .header-link,
    .workspace-tab,
    .tab,
    .dashboard-tab,
    .query-tag,
    .query-filter-tab,
    .query-segmented-btn,
    .add-line,
    .remove-item,
    .process-detail-back,
    .state,
    .badge,
    .fr-cat-badge {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      text-align: center;
    }

    /* Short summary metrics benefit from a centered visual anchor. */
    .stat,
    .failure-rate-summary .fr-stat {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      text-align: center;
    }
    .stat b,
    .stat span,
    .failure-rate-summary .fr-stat .fr-stat-label,
    .failure-rate-summary .fr-stat .fr-stat-value { text-align: center; }

    /* Navigation and explanatory cards retain a clear left-hand reading edge. */
    .nav-card { text-align: left; }
    .nav-card .nav-card-icon { display: block; text-align: left; }
    .nav-card h3,
    .nav-card p,
    .warranty-card h4,
    .warranty-card ul,
    .warranty-card p,
    .notice-header,
    .notice-body,
    .section-head h2,
    .section-head h3,
    .section-head span { text-align: left; }

    /* Process identity is centered, while descriptive steps stay easy to scan. */
    .process-lane { align-items: stretch; text-align: left; }
    .process-lane .lane-kicker,
    .process-lane h3 { align-self: center; text-align: center; }
    .process-lane p,
    .process-lane .lane-step { text-align: left; }
    .flow-step {
      display: flex;
      flex-direction: column;
      align-items: stretch;
      justify-content: center;
      text-align: left;
    }
    .flow-step .number,
    .flow-step h3 { text-align: center; }
    .flow-step p { text-align: left; }
    .flow-step .number { margin-bottom: 17px; }

    /* Table defaults: readable text left, dates/states centered, numbers right. */
    .request-list th,
    .request-list td { text-align: left; vertical-align: middle; }
    .request-list th { text-align: left; }
    .request-list .state { justify-content: center; }
    .request-list .request-detail-row > td { text-align: left; }
    .submitter-cell { justify-content: flex-start; }

    #requests .request-list th:nth-child(4),
    #requests .request-list td:nth-child(4),
    #requests .request-list th:nth-child(5),
    #requests .request-list td:nth-child(5),
    #requests .request-list th:nth-child(6),
    #requests .request-list td:nth-child(6),
    #requests .request-list th:nth-child(8),
    #requests .request-list td:nth-child(8),
    #ticket-dashboard-table th:nth-child(3),
    #ticket-dashboard-table td:nth-child(3),
    #ticket-dashboard-table th:nth-child(6),
    #ticket-dashboard-table td:nth-child(6),
    #ticket-dashboard-table th:nth-child(7),
    #ticket-dashboard-table td:nth-child(7),
    #rma-dashboard-table th:nth-child(3),
    #rma-dashboard-table td:nth-child(3),
    #rma-dashboard-table th:nth-child(4),
    #rma-dashboard-table td:nth-child(4),
    #rma-dashboard-table th:nth-child(5),
    #rma-dashboard-table td:nth-child(5),
    #rma-dashboard-table th:nth-child(6),
    #rma-dashboard-table td:nth-child(6),
    #after-sales-materials-table th:nth-child(4),
    #after-sales-materials-table td:nth-child(4),
    #after-sales-materials-table th:nth-child(5),
    #after-sales-materials-table td:nth-child(5) { text-align: center; }

    #failure-rate-topn-table th:nth-child(1),
    #failure-rate-topn-table td:nth-child(1),
    #failure-rate-topn-table th:nth-child(5),
    #failure-rate-topn-table td:nth-child(5),
    #failure-rate-topn-table th:nth-child(6),
    #failure-rate-topn-table td:nth-child(6),
    #failure-rate-table th:nth-child(2),
    #failure-rate-table td:nth-child(2),
    #failure-rate-table th:nth-child(3),
    #failure-rate-table td:nth-child(3),
    #failure-rate-table th:nth-child(4),
    #failure-rate-table td:nth-child(4),
    #failure-rate-table th:nth-child(5),
    #failure-rate-table td:nth-child(5),
    #failure-rate-table th:nth-child(6),
    #failure-rate-table td:nth-child(6),
    #failure-rate-detail-table th:nth-child(3),
    #failure-rate-detail-table td:nth-child(3),
    #failure-rate-detail-table th:nth-child(4),
    #failure-rate-detail-table td:nth-child(4),
    #fault-issues-table th:nth-child(2),
    #fault-issues-table td:nth-child(2),
    #fault-issues-table th:nth-child(3),
    #fault-issues-table td:nth-child(3) { text-align: right; }

    #fault-issues-detail-table th:nth-child(4),
    #fault-issues-detail-table td:nth-child(4),
    #fault-issues-detail-table th:nth-child(5),
    #fault-issues-detail-table td:nth-child(5) { text-align: center; }

    /* Details and search results are read, not scanned as centered metrics. */
    .detail-grid > div,
    .detail-grid > div > span,
    .detail-grid > div > b,
    .detail-table th,
    .detail-table td,
    .confirm-card-row > div,
    .confirm-mini-table th,
    .confirm-mini-table td,
    .query-result-card h4,
    .query-result-grid .qr,
    .material-result,
    .material-result-head,
    .material-result-grid,
    .fr-chart-box h4,
    .fr-trend-wrap h4,
    .fr-top-n-wrap h4,
    .flow-detail-body,
    .fr-donut-legend,
    .fr-bar-label { text-align: left; }
    .detail-grid > div,
    .query-result-grid .qr,
    .material-result-grid > div { display: block; }
    .query-result-grid .qr b { margin-left: 4px; }
    .material-result-head { justify-content: space-between; align-items: baseline; flex-wrap: wrap; }
    .query-result-actions { justify-content: flex-start; }
    .rma-dashboard-pagination { justify-content: center; }

    /* Form entry always follows the standard left-to-right writing pattern. */
    label,
    input,
    textarea,
    select,
    .country-option,
    .dropdown-item { text-align: left; }

    /* Keep the request register within the desktop workspace. The operational
       note is deliberately the flexible reading column; compact identifiers do
       not need to force a horizontal scrollbar. */
    #requests .request-table-wrap { overflow-x: hidden; }
    #requests .request-list {
      width: 100%;
      min-width: 0;
      table-layout: fixed;
    }
    #requests .request-list th:nth-child(1),
    #requests .request-list tbody > tr:not(.request-detail-row) > td:nth-child(1) { width: 7%; }
    #requests .request-list th:nth-child(2),
    #requests .request-list tbody > tr:not(.request-detail-row) > td:nth-child(2) { width: 12%; }
    #requests .request-list th:nth-child(3),
    #requests .request-list tbody > tr:not(.request-detail-row) > td:nth-child(3) { width: 7%; }
    #requests .request-list th:nth-child(4),
    #requests .request-list tbody > tr:not(.request-detail-row) > td:nth-child(4) { width: 10%; }
    #requests .request-list th:nth-child(5),
    #requests .request-list tbody > tr:not(.request-detail-row) > td:nth-child(5) { width: 7%; }
    #requests .request-list th:nth-child(6),
    #requests .request-list tbody > tr:not(.request-detail-row) > td:nth-child(6) { width: 7%; }
    #requests .request-list th:nth-child(7),
    #requests .request-list tbody > tr:not(.request-detail-row) > td:nth-child(7) {
      width: 29%;
      min-width: 0;
      max-width: none;
      overflow-wrap: anywhere;
    }
    #requests .request-list th:nth-child(8),
    #requests .request-list tbody > tr:not(.request-detail-row) > td:nth-child(8) { width: 9%; }
    #requests .request-list th:nth-child(9),
    #requests .request-list tbody > tr:not(.request-detail-row) > td:nth-child(9) { width: 12%; }

    /* The register is scanned column by column, so compact field values are
       centered. Keep the free-form remarks column and expanded detail content
       left aligned for comfortable reading. */
    #requests .request-list > thead > tr > th:not(:nth-child(7)),
    #requests .request-list > tbody > tr:not(.request-detail-row) > td:not(:nth-child(7)) {
      text-align: center;
    }
    #requests .request-list .submitter-cell { justify-content: center; }

    /* Preserve readable cells on small screens; desktop views remain scroll-free. */
    @media (max-width: 900px) {
      #requests .request-table-wrap { overflow-x: auto; }
      #requests .request-list { min-width: 900px; table-layout: auto; }
    }

    /* Final visual refinement: consolidate the established visual language
       without changing page structure or workflow behavior. */
    .btn-export {
      border-color: var(--blue-line);
      background: var(--blue-soft);
      color: var(--blue-strong);
    }
    .btn-export:hover {
      border-color: var(--blue);
      background: #dbeafe;
      color: var(--blue-strong);
      box-shadow: 0 1px 2px rgba(37, 99, 235, .1);
    }

    .request-actions {
      min-height: 42px;
      margin: 0 0 18px;
      padding: 8px 0 12px;
      border-bottom: 1px solid #eef0f3;
    }
    .request-actions .actions {
      align-items: center;
      gap: 8px;
    }
    .request-sync-status,
    .dashboard-updated,
    .material-catalog-sync {
      color: var(--muted) !important;
      font-size: 12px !important;
      line-height: 1.45;
      font-variant-numeric: tabular-nums;
    }

    .request-toolbar {
      grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(33.333%, 2fr) auto;
      align-items: center;
    }
    .rma-dashboard-toolbar {
      grid-template-columns: minmax(160px, .8fr) minmax(280px, 1.55fr) auto auto minmax(150px, .75fr);
    }
    .material-catalog-toolbar {
      grid-template-columns: minmax(150px, .7fr) minmax(150px, .7fr) minmax(300px, 1.65fr) auto minmax(150px, .75fr);
      align-items: center;
    }
    .failure-rate-toolbar {
      align-items: center;
    }
    .rma-dashboard-toolbar input,
    .rma-dashboard-toolbar select,
    .material-catalog-toolbar input,
    .material-catalog-toolbar select,
    .request-toolbar input,
    .request-toolbar select {
      min-height: 40px;
      height: 40px;
    }
    .request-filter-clear {
      min-height: 40px;
      height: 40px;
      padding: 7px 12px;
      color: var(--muted);
      white-space: nowrap;
    }
    .request-filter-clear:hover {
      color: var(--ink);
      border-color: var(--blue-line);
      background: var(--blue-soft);
    }

    #rma-dashboard-workspace .request-table-wrap,
    #requests .request-table-wrap {
      background: var(--panel);
      border-color: var(--line);
      box-shadow: var(--shadow-sm);
    }
    #requests .request-table-wrap {
      border: 1px solid var(--line);
      border-radius: var(--radius-sm);
    }
    .request-list th,
    .request-list td {
      border-bottom-color: #edf0f2;
    }
    .request-list th {
      height: 42px;
      background: #f8fafc;
      color: #64748b;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: .01em;
      vertical-align: middle;
    }
    .request-list td {
      min-height: 54px;
      color: #374151;
      font-size: 13px;
      line-height: 1.55;
      vertical-align: middle;
    }
    .request-list tbody tr:not(.request-detail-row) {
      transition: background-color .18s ease;
    }
    .request-list tbody tr:not(.request-detail-row):hover {
      background: #f8fbff;
    }
    #requests .request-list tbody > tr:not(.request-detail-row) > td:nth-child(7) {
      color: #4b5563;
      line-height: 1.6;
    }
    #requests .request-list th:nth-child(4),
    #requests .request-list td:nth-child(4),
    #ticket-dashboard-table th:nth-child(7),
    #ticket-dashboard-table td:nth-child(7),
    #rma-dashboard-table th:nth-child(4),
    #rma-dashboard-table td:nth-child(4) {
      font-variant-numeric: tabular-nums;
    }
    #rma-dashboard-table td:nth-child(1),
    #ticket-dashboard-table td:nth-child(1),
    #after-sales-materials-table td:nth-child(1),
    #fault-issues-detail-table td:nth-child(1),
    #failure-rate-topn-table td:nth-child(2),
    #failure-rate-detail-table td:nth-child(1) {
      letter-spacing: .005em;
    }

    .state {
      min-height: 24px;
      padding: 4px 9px;
      border: 1px solid transparent;
      font-weight: 650;
      line-height: 1.2;
      letter-spacing: 0;
    }
    .state.pending { border-color: #fde68a; }
    .state.created { border-color: var(--blue-line); }
    .state.done { border-color: #a7f3d0; }
    .state.rejected { border-color: #fecaca; }
    .submitter-avatar {
      width: 28px;
      height: 28px;
      flex-basis: 28px;
      border: 1px solid #dbe3ef;
      box-shadow: 0 1px 1px rgba(15, 23, 42, .05);
    }
    .submitter-cell { gap: 9px; }
    .submitter-name { color: #374151; font-weight: 560; }

    .rma-dashboard-pagination {
      min-height: 36px;
      margin-top: 14px;
      color: var(--muted);
      font-size: 12px;
      font-variant-numeric: tabular-nums;
    }
    .rma-dashboard-pagination .btn {
      min-height: 32px;
      padding: 5px 10px;
    }
    .tabs,
    .dashboard-tabs,
    .workspace-nav {
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, .7);
    }
    .modal-close {
      width: 32px;
      height: 32px;
      display: inline-grid;
      place-items: center;
      border-radius: 8px;
      transition: background-color .18s ease, color .18s ease;
    }
    .modal-close:hover {
      background: #f3f4f6;
      color: var(--ink);
    }

    @media (max-width: 1180px) {
      .rma-dashboard-toolbar,
      .material-catalog-toolbar {
        grid-template-columns: minmax(150px, 1fr) minmax(220px, 1.4fr) auto auto;
      }
      .rma-dashboard-toolbar .dashboard-updated,
      .material-catalog-toolbar .material-catalog-sync {
        grid-column: 1 / -1;
      }
    }
    @media (max-width: 760px) {
      .request-toolbar,
      .rma-dashboard-toolbar,
      .material-catalog-toolbar {
        grid-template-columns: 1fr;
      }
      .request-actions {
        align-items: flex-start;
      }
      .rma-dashboard-toolbar .dashboard-updated,
      .material-catalog-toolbar .material-catalog-sync {
        grid-column: auto;
      }
    }

    /* Mobile workbench: keep desktop density intact while presenting the same
       operational data as touch-friendly, priority-led cards on phones. */
    @media (max-width: 610px) {
      :root {
        --mobile-page-pad: 14px;
      }
      html { -webkit-text-size-adjust: 100%; }
      body { font-size: 15px; }
      .shell { padding: 0 var(--mobile-page-pad) 94px !important; }

      header {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        min-height: 58px;
        gap: 10px;
        padding: 10px 0;
      }
      .brand { min-width: 0; font-size: 14px; }
      .brand-mark { width: 31px; height: 31px; }
      .workspace-nav,
      .status,
      .lang-switch { display: none !important; }
      .header-actions { display: flex; grid-column: 2; width: auto; margin: 0; gap: 7px; }
      .header-link {
        min-height: 38px;
        padding: 7px 10px;
        border-radius: 9px;
        font-size: 13px;
      }
      .header-link::before { display: none; }
      .account-trigger { min-width: 38px; min-height: 38px; padding: 2px; justify-content: center; }
      .account-name { display: none; }
      .account-avatar { width: 30px; height: 30px; }
      .account-dropdown {
        position: fixed;
        top: auto;
        right: var(--mobile-page-pad);
        bottom: 76px;
        min-width: 184px;
        padding: 6px;
        border-radius: 12px;
        box-shadow: 0 14px 34px rgba(15, 23, 42, .16);
      }
      .dropdown-item { min-height: 42px; padding: 10px 12px; font-size: 14px; }

      .mobile-tab-bar {
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        align-items: stretch;
        min-height: calc(64px + env(safe-area-inset-bottom, 0px));
        padding: 5px 8px calc(5px + env(safe-area-inset-bottom, 0px));
        background: rgba(255, 255, 255, .96);
        border-top: 1px solid #e9edf2;
        box-shadow: 0 -5px 20px rgba(15, 23, 42, .06);
        backdrop-filter: blur(10px);
      }
      .mobile-tab {
        min-width: 0;
        min-height: 52px;
        gap: 3px;
        padding: 5px 3px;
        border-radius: 10px;
        font-size: 12px;
        font-weight: 600;
        line-height: 1.15;
      }
      .mobile-tab-icon {
        display: grid;
        width: 22px;
        height: 22px;
        place-items: center;
        border-radius: 7px;
        color: currentColor;
        font-size: 18px;
        font-weight: 500;
        line-height: 1;
      }
      .mobile-tab span:last-child { font-size: 12px; white-space: nowrap; }
      .mobile-tab.active { background: #eff6ff; color: var(--blue-strong); }
      .mobile-tab.active .mobile-tab-icon { background: #dbeafe; }

      .workspace-view { padding-top: 24px; }
      .hero { padding: 30px 0 28px; }
      .hero h1, h1 { font-size: 32px; line-height: 1.18; }
      .hero-copy { font-size: 14px; line-height: 1.7; }
      .section-head { margin-bottom: 14px; }
      .section-head h2 { font-size: 22px; line-height: 1.28; }
      .section-head h3 { font-size: 18px; line-height: 1.35; }
      .section-head span { max-width: none; font-size: 13px; line-height: 1.55; }
      .form-card { padding: 16px; border-radius: 12px; }
      .form-guidance { margin: 0 0 14px; font-size: 13px; }
      label { font-size: 14px; }
      input, select, textarea { min-height: 44px; font-size: 16px; }
      textarea { min-height: 104px; }
      .btn { min-height: 44px; padding: 9px 13px; font-size: 14px; }
      .btn.primary { box-shadow: 0 4px 10px rgba(37, 99, 235, .15); }

      .tabs,
      .dashboard-tabs {
        width: calc(100% + 4px);
        margin: 0 -2px 16px;
        padding: 3px;
        gap: 4px;
        overflow-x: auto;
        scrollbar-width: none;
      }
      .tabs::-webkit-scrollbar,
      .dashboard-tabs::-webkit-scrollbar { display: none; }
      .tab,
      .dashboard-tab {
        flex: 0 0 auto;
        min-height: 40px;
        padding: 8px 12px;
        font-size: 13px;
        white-space: nowrap;
      }

      /* Search and filtering are deliberately stacked before lower-priority actions. */
      .request-toolbar,
      .rma-dashboard-toolbar,
      .material-catalog-toolbar {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 10px;
        margin-bottom: 12px;
      }
      .request-toolbar #request-search,
      .rma-dashboard-toolbar > input,
      .material-catalog-toolbar > input,
      .rma-dashboard-toolbar .dashboard-updated,
      .material-catalog-toolbar .material-catalog-sync {
        grid-column: 1 / -1;
      }
      .request-toolbar .request-filter-clear {
        grid-column: 1 / -1;
        width: 100%;
      }
      .request-toolbar input,
      .request-toolbar select,
      .rma-dashboard-toolbar input,
      .rma-dashboard-toolbar select,
      .material-catalog-toolbar input,
      .material-catalog-toolbar select,
      .country-combobox input {
        width: 100%;
        min-height: 46px;
        height: 46px;
        border-radius: 10px;
      }
      .rma-dashboard-toolbar .btn,
      .material-catalog-toolbar .btn { min-height: 44px; padding: 9px 10px; font-size: 13px; }
      .dashboard-updated,
      .material-catalog-sync,
      .request-sync-status { min-height: 20px; font-size: 12px !important; text-align: left; white-space: normal !important; }
      .request-actions {
        display: grid;
        grid-template-columns: 1fr;
        align-items: stretch;
        gap: 10px;
        margin: 0 0 14px;
        padding: 0;
        border: 0;
      }
      .request-actions .actions { display: grid; grid-template-columns: 1fr; gap: 9px; }
      #sync-requests { width: 100%; }
      #export-requests { display: none; }

      /* Four compact summary filters stay visible without turning into large cards. */
      .request-stats {
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 8px;
        margin-bottom: 16px;
      }
      .stat { min-height: 72px; padding: 10px 5px; border-radius: 12px; text-align: center; }
      .stat b { font-size: 21px; line-height: 1.1; }
      .stat span { display: block; margin-top: 5px; font-size: 12px; line-height: 1.25; }

      /* Request register: desktop columns become a scan-friendly list of cards. */
      #requests .form-card { padding: 0; border: 0; background: transparent; box-shadow: none; }
      #requests .request-table-wrap,
      #rma-dashboard-workspace .request-table-wrap,
      #information-query-workspace .request-table-wrap {
        overflow: visible;
        border: 0;
        border-radius: 0;
        background: transparent;
        box-shadow: none;
      }
      #requests .request-list,
      #ticket-dashboard-table,
      #rma-dashboard-table,
      #after-sales-materials-table,
      #pre-orders-table {
        display: block;
        width: 100%;
        min-width: 0;
        border: 0;
        table-layout: auto;
        background: transparent;
      }
      #requests .request-list thead,
      #ticket-dashboard-table thead,
      #rma-dashboard-table thead,
      #after-sales-materials-table thead,
      #pre-orders-table thead { display: none; }
      #requests .request-list tbody,
      #ticket-dashboard-table tbody,
      #rma-dashboard-table tbody,
      #after-sales-materials-table tbody,
      #pre-orders-table tbody { display: grid; gap: 10px; }
      #requests .request-list tbody > tr:not(.request-detail-row),
      #ticket-dashboard-table tbody > tr,
      #rma-dashboard-table tbody > tr,
      #after-sales-materials-table tbody > tr,
      #pre-orders-table tbody > tr {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 8px 12px;
        padding: 14px;
        border: 1px solid #e6ebf1;
        border-radius: 14px;
        background: var(--panel);
        box-shadow: 0 1px 2px rgba(15, 23, 42, .035);
      }
      #requests .request-list tbody > tr:not(.request-detail-row) { cursor: pointer; }
      #requests .request-list tbody > tr:not(.request-detail-row):focus-visible { outline: 3px solid rgba(37, 99, 235, .24); outline-offset: 2px; }
      #requests .request-list tbody > tr:not(.request-detail-row) > td,
      #ticket-dashboard-table td,
      #rma-dashboard-table td,
      #after-sales-materials-table td,
      #pre-orders-table td {
        display: flex;
        width: auto !important;
        min-width: 0;
        min-height: 0;
        padding: 0;
        border: 0;
        background: transparent;
        color: #4b5563;
        font-size: 13px;
        line-height: 1.45;
        text-align: left !important;
        white-space: normal !important;
      }
      #requests .request-list tbody > tr:not(.request-detail-row) > td::before,
      #ticket-dashboard-table td::before,
      #rma-dashboard-table td::before,
      #after-sales-materials-table td::before,
      #pre-orders-table td::before {
        content: attr(data-mobile-label);
        flex: 0 0 auto;
        margin-right: 6px;
        color: #8a94a3;
        font-size: 12px;
      }
      #requests .request-list tbody > tr:not(.request-detail-row) > td:nth-child(1) { order: 1; color: var(--muted); font-size: 12px; }
      #requests .request-list tbody > tr:not(.request-detail-row) > td:nth-child(1)::before,
      #requests .request-list tbody > tr:not(.request-detail-row) > td:nth-child(2)::before,
      #requests .request-list tbody > tr:not(.request-detail-row) > td:nth-child(6)::before { display: none; }
      #requests .request-list tbody > tr:not(.request-detail-row) > td:nth-child(2) { order: 3; grid-column: 1 / -1; color: var(--ink); font-size: 16px; font-weight: 700; letter-spacing: .01em; }
      #requests .request-list tbody > tr:not(.request-detail-row) > td:nth-child(3) { order: 4; }
      #requests .request-list tbody > tr:not(.request-detail-row) > td:nth-child(4) { order: 5; }
      #requests .request-list tbody > tr:not(.request-detail-row) > td:nth-child(5) { order: 6; }
      #requests .request-list tbody > tr:not(.request-detail-row) > td:nth-child(6) { order: 2; align-items: flex-start; justify-self: end; }
      #requests .request-list tbody > tr:not(.request-detail-row) > td:nth-child(7),
      #requests .request-list tbody > tr:not(.request-detail-row) > td:nth-child(8) { display: none; }
      #requests .request-list tbody > tr:not(.request-detail-row) > td:nth-child(9) { order: 7; grid-column: 1 / -1; align-items: center; }
      #requests .request-list .submitter-cell { justify-content: flex-start; }
      #requests .request-list .state { min-height: 25px; }
      #requests .request-list tbody > tr > td[colspan] { display: block; grid-column: 1 / -1; padding: 24px 14px; text-align: center !important; color: var(--muted); }
      #requests .request-detail-row { display: block; margin: -2px 0 2px; }
      #requests .request-detail-row > td { display: block; padding: 0 !important; }
      .request-detail { margin: 0; padding: 16px 14px; border-radius: 12px; box-shadow: none; }
      .request-detail h3 { margin: 0 0 12px; font-size: 16px; }
      .detail-grid { grid-template-columns: 1fr; gap: 11px; margin-top: 0; }
      .detail-grid div { padding-bottom: 10px; border-bottom: 1px solid #edf0f3; font-size: 13px; }
      .detail-grid b { margin-top: 4px; font-size: 14px; line-height: 1.55; }
      .detail-actions,
      .request-detail .actions { display: grid; grid-template-columns: 1fr; gap: 9px; margin-top: 14px; }
      .detail-actions .btn,
      .request-detail .actions .btn { width: 100%; }

      /* Dashboard records use the same visual grammar, with core identifiers first. */
      #ticket-dashboard-table td:nth-child(1),
      #rma-dashboard-table td:nth-child(1),
      #after-sales-materials-table td:nth-child(1),
      #pre-orders-table td:nth-child(1) { order: 1; color: var(--ink); font-size: 16px; font-weight: 700; }
      #ticket-dashboard-table td:nth-child(1)::before,
      #rma-dashboard-table td:nth-child(1)::before,
      #after-sales-materials-table td:nth-child(1)::before,
      #pre-orders-table td:nth-child(1)::before { display: none; }
      #ticket-dashboard-table td:nth-child(6),
      #rma-dashboard-table td:nth-child(5) { order: 2; justify-self: end; color: var(--blue-strong); font-weight: 650; }
      #ticket-dashboard-table td:nth-child(6)::before,
      #rma-dashboard-table td:nth-child(5)::before { display: none; }
      #ticket-dashboard-table td:nth-child(2),
      #rma-dashboard-table td:nth-child(2),
      #after-sales-materials-table td:nth-child(2),
      #pre-orders-table td:nth-child(2) { order: 3; grid-column: 1 / -1; color: #374151; }
      #ticket-dashboard-table td:nth-child(3),
      #rma-dashboard-table td:nth-child(3),
      #after-sales-materials-table td:nth-child(4),
      #pre-orders-table td:nth-child(5) { order: 4; }
      #ticket-dashboard-table td:nth-child(7),
      #rma-dashboard-table td:nth-child(4),
      #after-sales-materials-table td:nth-child(5),
      #pre-orders-table td:nth-child(6) { order: 5; }
      #ticket-dashboard-table td:nth-child(4),
      #ticket-dashboard-table td:nth-child(5),
      #rma-dashboard-table td:nth-child(6),
      #rma-dashboard-table td:nth-child(7),
      #after-sales-materials-table td:nth-child(3),
      #pre-orders-table td:nth-child(3),
      #pre-orders-table td:nth-child(4),
      #pre-orders-table td:nth-child(7) { order: 6; grid-column: 1 / -1; }
      .dashboard-status { border-radius: 999px; background: var(--blue-soft); padding: 4px 8px; }

      .rma-dashboard-pagination { display: grid; grid-template-columns: 1fr auto 1fr; gap: 8px; margin-top: 14px; }
      .rma-dashboard-pagination > span:first-child { grid-column: 1 / -1; text-align: center; }
      .rma-dashboard-pagination .btn { min-height: 42px; }
      .rma-dashboard-pagination .btn:last-child { grid-column: 3; }
      .rma-dashboard-pagination > span:not(:first-child) { align-self: center; text-align: center; }
      .dashboard-tabs { margin-bottom: 12px; }
      .failure-rate-toolbar { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
      .failure-rate-toolbar .country-combobox,
      .failure-rate-toolbar .dashboard-updated { grid-column: 1 / -1; }
      .failure-rate-toolbar .btn { min-height: 44px; }
      .failure-rate-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
      .failure-rate-summary .fr-stat { min-height: 92px; padding: 13px; border-radius: 12px; }

      /* Keep the submit action reachable after long mobile forms without adding a new workflow. */
      #rma-form > .actions,
      #forecast-form > .actions,
      #borrow-form > .actions {
        position: sticky;
        bottom: 70px;
        z-index: 8;
        margin: 18px -3px -3px;
        padding: 9px 3px 3px;
        border-top: 1px solid rgba(229, 231, 235, .9);
        background: rgba(255, 255, 255, .96);
        box-shadow: 0 -6px 12px rgba(15, 23, 42, .035);
      }
      #rma-form > .actions .btn,
      #forecast-form > .actions .btn,
      #borrow-form > .actions .btn { flex: 1; min-height: 46px; }

      .modal-backdrop { align-items: flex-end; padding: 0; }
      .modal { width: 100%; max-height: min(86vh, 760px); overflow: auto; border-radius: 18px 18px 0 0; }
      .modal-header { position: sticky; top: 0; z-index: 1; padding: 15px 16px; }
      .modal-body { padding: 16px; }
      .modal-actions { position: sticky; bottom: 0; display: grid; grid-template-columns: 1fr 1fr; padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px)); background: var(--panel); }
      .modal-actions .btn { width: 100%; }
      .submission-toast { right: 14px; bottom: 78px; max-width: calc(100vw - 28px); font-size: 14px; }
    }

    @media (max-width: 380px) {
      .header-link { padding: 7px 8px; font-size: 12px; }
      .brand { font-size: 13px; }
      .request-stats { gap: 6px; }
      .stat { padding-inline: 3px; }
      .stat span { font-size: 11px; }
      .mobile-tab span:last-child { font-size: 11px; }
    }

    @media (max-width: 610px) {
      /* Analysis tables follow the same mobile list pattern instead of retaining a desktop scroll surface. */
      #failure-rate-topn-table,
      #failure-rate-table,
      #failure-rate-detail-table,
      #fault-issues-table,
      #fault-issues-detail-table {
        display: block;
        width: 100%;
        min-width: 0;
        border: 0;
        table-layout: auto;
        background: transparent;
      }
      #failure-rate-topn-table thead,
      #failure-rate-table thead,
      #failure-rate-detail-table thead,
      #fault-issues-table thead,
      #fault-issues-detail-table thead { display: none; }
      #failure-rate-topn-table tbody,
      #failure-rate-table tbody,
      #failure-rate-detail-table tbody,
      #fault-issues-table tbody,
      #fault-issues-detail-table tbody { display: grid; gap: 10px; }
      #failure-rate-topn-table tbody > tr,
      #failure-rate-table tbody > tr,
      #failure-rate-detail-table tbody > tr,
      #fault-issues-table tbody > tr,
      #fault-issues-detail-table tbody > tr {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 8px 12px;
        padding: 14px;
        border: 1px solid #e6ebf1;
        border-radius: 14px;
        background: var(--panel);
        box-shadow: 0 1px 2px rgba(15, 23, 42, .035);
      }
      #failure-rate-topn-table td,
      #failure-rate-table td,
      #failure-rate-detail-table td,
      #fault-issues-table td,
      #fault-issues-detail-table td {
        display: flex;
        width: auto !important;
        min-width: 0;
        padding: 0;
        border: 0;
        color: #4b5563;
        font-size: 13px;
        line-height: 1.5;
        text-align: left !important;
        white-space: normal !important;
      }
      #failure-rate-topn-table td::before,
      #failure-rate-table td::before,
      #failure-rate-detail-table td::before,
      #fault-issues-table td::before,
      #fault-issues-detail-table td::before {
        content: attr(data-mobile-label);
        flex: 0 0 auto;
        margin-right: 6px;
        color: #8a94a3;
        font-size: 12px;
      }
      #failure-rate-topn-table td:first-child,
      #failure-rate-table td:first-child,
      #failure-rate-detail-table td:first-child,
      #fault-issues-table td:first-child,
      #fault-issues-detail-table td:first-child { order: 1; grid-column: 1 / -1; color: var(--ink); font-size: 15px; font-weight: 700; }
      #failure-rate-topn-table td:first-child::before,
      #failure-rate-table td:first-child::before,
      #failure-rate-detail-table td:first-child::before,
      #fault-issues-table td:first-child::before,
      #fault-issues-detail-table td:first-child::before { display: none; }
      #failure-rate-table td:nth-child(5),
      #fault-issues-table td:nth-child(2) { color: var(--blue-strong); font-weight: 650; }
      #failure-rate-topn-table td:nth-child(3),
      #failure-rate-table td:nth-child(7),
      #failure-rate-detail-table td:nth-child(2),
      #fault-issues-table td:nth-child(4),
      #fault-issues-detail-table td:nth-child(2),
      #fault-issues-detail-table td:nth-child(3) { grid-column: 1 / -1; }
      #fault-issues-detail-table td:nth-child(3) { color: var(--muted); }
      #failure-rate-table .fr-mat-chip { margin: 2px 4px 2px 0; }
      .fr-trend-chart,
      .failure-rate-chart { overflow-x: hidden; }
      .fr-trend-svg { min-width: 0 !important; width: 100%; height: auto; }
    }

    /* Mobile feedback layer: loading, filtering and detail reading all use the same compact visual language. */
    .request-filter-summary,
    .dashboard-filter-summary { display: none; }
    .detail-summary { display: none; }
    .detail-collapsible { display: block; }
    .detail-collapsible summary { cursor: pointer; color: var(--ink); font-weight: 600; line-height: 1.55; }
    .detail-collapsible > div { margin-top: 8px; color: var(--ink); font-weight: 600; line-height: 1.65; white-space: pre-wrap; overflow-wrap: anywhere; }
    .dashboard-connection-error { text-align: center; color: var(--danger); }
    .dashboard-retry { display: inline-flex; margin: 12px auto 0; }

    @media (max-width: 610px) {
      .request-filter-summary,
      .dashboard-filter-summary {
        display: block;
        min-height: 18px;
        margin: -3px 1px 12px;
        color: #6b7280;
        font-size: 12px;
        line-height: 1.5;
      }
      .dashboard-filter-summary { margin-top: -4px; }
      .request-filter-summary:empty,
      .dashboard-filter-summary:empty { display: none; }

      /* Low-frequency CSV export stays available on desktop, while phone space stays focused on search and refresh. */
      .rma-dashboard-toolbar .btn-export,
      .failure-rate-toolbar .btn-export { display: none; }

      .mobile-skeleton-card {
        display: block !important;
        min-height: 104px;
        padding: 0 !important;
        overflow: hidden;
        border: 1px solid #e6ebf1 !important;
        border-radius: 14px;
        background: #f1f5f9 !important;
        box-shadow: none !important;
        animation: mobileSkeleton 1.15s ease-in-out infinite alternate;
      }
      .mobile-skeleton-card > td,
      #requests .request-list .mobile-skeleton-card > td {
        display: block !important;
        min-height: 104px;
        padding: 0 !important;
        color: transparent !important;
        font-size: 0 !important;
        background: transparent !important;
      }
      .mobile-skeleton-card .spinner { display: none; }
      @keyframes mobileSkeleton { from { opacity: .68; } to { opacity: 1; } }

      #requests .request-list tbody > tr:not(.request-detail-row)::after {
        content: attr(data-mobile-action);
        order: 9;
        grid-column: 1 / -1;
        margin-top: 2px;
        padding-top: 10px;
        border-top: 1px solid #eef1f4;
        color: var(--blue);
        font-size: 13px;
        font-weight: 650;
        text-align: right;
      }
      #requests .request-list tbody > tr.mobile-skeleton-card::after { display: none; }

      .detail-summary {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 10px;
        margin: -2px 0 14px;
        padding: 0 0 13px;
        border-bottom: 1px solid #e8edf2;
      }
      .detail-summary-main { display: grid; gap: 3px; min-width: 0; }
      .detail-summary-main strong { color: var(--ink); font-size: 16px; line-height: 1.35; overflow-wrap: anywhere; }
      .detail-summary-main span { color: var(--muted); font-size: 12px; line-height: 1.45; overflow-wrap: anywhere; }
      .detail-summary .state { flex: 0 0 auto; }
      .request-detail h3 { color: #6b7280; font-size: 12px; font-weight: 650; }
      .detail-collapsible { margin-top: 4px; }
      .detail-collapsible summary { font-size: 14px; }
      .detail-collapsible > div { font-size: 14px; }
      .detail-collapsible summary::marker { color: var(--blue); }

      .dashboard-connection-error {
        display: grid !important;
        place-items: center;
        gap: 2px;
        min-height: 138px;
        padding: 18px !important;
        border: 1px solid #fecaca !important;
        border-radius: 14px;
        background: #fffafa !important;
        color: var(--danger) !important;
        font-size: 14px !important;
        line-height: 1.55;
        text-align: center !important;
      }
      .dashboard-connection-error .dashboard-retry { min-width: 112px; min-height: 42px; margin-top: 8px; color: var(--danger); background: #fff; border-color: #fecaca; }
      .dashboard-connection-error .dashboard-retry:hover { background: #fef2f2; border-color: #fca5a5; }

      /* Do not force a horizontal scroll for the remaining mobile data surfaces. */
      #failure-rate-panel .request-table-wrap,
      #fault-issues-panel .request-table-wrap { overflow: visible; }
      .fr-top-n-wrap { overflow: visible; }
    }