:root { color-scheme: light; --ui-font: "Noto Sans TC", "Microsoft JhengHei", "PingFang TC", system-ui, sans-serif; }
/* Warranty lookup: larger type and clear controls for comfortable daily reading. */
@media screen {
 #section-warranty {font-size:18px;color:#17304d;}
 #section-warranty > div {padding:32px;border-radius:24px;border:1px solid #cbd8e7;box-shadow:0 8px 28px #17304d08;}
 #section-warranty h2 {font-size:30px;line-height:1.5;}
 #section-warranty h3 {font-size:22px;color:#172b47;}
 #section-warranty p {font-size:18px;color:#364c65;line-height:1.85;}
 #section-warranty .warranty-guide {padding:18px 22px;background:#edf4ff;border-left:4px solid #2459c4;border-radius:12px;margin-bottom:28px;}
 #section-warranty .warranty-guide strong {display:block;color:#173f84;font-size:20px;margin-bottom:6px;}
 #section-warranty #brand-grid,#section-warranty #brand-service-grid {grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;}
 #section-warranty .brand-card {min-height:174px;padding:20px 14px;border:2px solid #c9d6e6;border-radius:18px;gap:10px;background:#fff;box-shadow:0 2px 5px #17304d05;}
 #section-warranty .brand-card:hover,#section-warranty .brand-card:focus-visible {border-color:#2459c4;background:#f0f6ff;transform:none;}
 #section-warranty .brand-card[aria-pressed="true"] {border-color:#2459c4;background:#eaf2ff;box-shadow:0 0 0 1px #2459c4;}
 #section-warranty .brand-card > div {background:#e8eff9;color:#214a83;width:54px;height:54px;font-size:22px;}
 #section-warranty .brand-card > span:first-of-type {font-size:20px;line-height:1.6;font-weight:700;color:#172b47;white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;}
 #section-warranty .brand-card > span:last-of-type {font-size:16px;font-weight:600;color:#164ba5;line-height:1.6;}
 #section-warranty #brand-detail {background:#f2f6fc;border-color:#b7cce9;scroll-margin-top:100px;}
 #section-warranty #detail-name {font-size:26px;}
 #section-warranty #detail-checked {font-size:16px;color:#495d73;}
 #section-warranty #brand-detail a,#section-warranty #brand-detail button {font-size:18px;min-height:52px;padding:14px 22px;}
 #section-warranty #detail-link {background:#174eaf;color:#fff;}
}
@media screen and (max-width:1000px) {
 #section-warranty #brand-grid,#section-warranty #brand-service-grid {grid-template-columns:repeat(3,minmax(0,1fr));}
}
@media screen and (max-width:700px) {
 #section-warranty #brand-grid,#section-warranty #brand-service-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
 #section-warranty .brand-card {padding:16px 10px;min-height:166px;}
 #section-warranty > div {padding:20px;}
 #section-warranty h2 {font-size:26px;}
 #section-warranty .warranty-guide {padding:16px;}
 #section-warranty #brand-detail a,#section-warranty #brand-detail button {width:100%;}
}
@media screen and (max-width:380px) {
 #section-warranty #brand-grid,#section-warranty #brand-service-grid {grid-template-columns:1fr;}
}
body, .statement-box { font-family: var(--ui-font); line-height: 1.65; }
button, input, select, textarea { font-family: inherit; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, summary:focus-visible { outline: 3px solid #60a5fa; outline-offset: 3px; }
input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select, textarea {
    font-size: 16px; line-height: 1.5; min-height: 48px; min-width: 0; max-width: 100%;
    padding: 12px 14px; color: #0f172a; background-color: #fff; border: 1px solid #cbd5e1; border-radius: 12px;
    transition: border-color .15s, box-shadow .15s;
}
input::placeholder, textarea::placeholder { color: #64748b; opacity: 1; }
input:focus-visible, select:focus-visible, textarea:focus-visible { outline: none; border-color: #2563eb; box-shadow: 0 0 0 3px #2563eb22; }
input[type="checkbox"], input[type="radio"] { min-height: 20px; height: 20px; width: 20px; flex-shrink: 0; accent-color: #2563eb; vertical-align: middle; cursor: pointer; }
label:has(input[type="checkbox"]), label:has(input[type="radio"]) { min-height: 44px; padding-block: 8px; line-height: 1.6; cursor: pointer; }
#special-discount-input, #manufacturer-fee-input, #other-fee-input, #contract-discount-input { padding-left: 36px; }
textarea { min-height: 120px; resize: vertical; }
button { min-height: 44px; touch-action: manipulation; }
button:disabled { opacity: .6; cursor: wait; }
.btn-active, .tab-active { transform: none; }
.font-black { font-weight: 700; }
#display-id { max-width: none; white-space: nowrap; font-size: 13px; line-height: 1.6; color: #dbeafe; letter-spacing: .02em; }
#display-urgency { white-space: nowrap; flex-shrink: 0; }
#app-status { position: static; margin-block: 12px; line-height: 1.6; }
#urgency-fee-label { min-width: 0; overflow-wrap: anywhere; }
@media screen {
    body { color: #1e293b; background: #f3f6fa; }
    main .text-xs { font-size: 13px; line-height: 1.65; }
    main .text-sm { line-height: 1.7; }
    main label { color: #334155; font-weight: 500; }
    #section-quote label[class*="tracking-"] { font-size: 14px; letter-spacing: 0; color: #475569; font-weight: 600; margin-bottom: 12px; }
    #section-quote section { padding: 28px; border-radius: 24px; }
    #section-quote .gap-10 { gap: 24px; }
    #quote-card { border-radius: 24px; box-shadow: 0 12px 32px #0f172a0c; }
    #quote-card > div { padding: 28px; }
    #quote-card [id$="-row"] { gap: 12px; align-items: flex-start; }
    #quote-card [id$="-row"] > div { min-width: 0; gap: 12px; }
    #quote-card [id$="-row"] > div > div { flex-shrink: 0; }
    #quote-card [id$="-row"] > span { white-space: nowrap; flex-shrink: 0; }
    nav > div { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 6px; }
    nav button { min-width: 0 !important; padding: 12px 8px !important; font-size: 15px; }
    .brand-card { min-width: 0; border-radius: 16px; }
    .brand-card:hover { transform: translateY(-2px); }
    #history-list > div { padding: 16px; border-radius: 16px; }
    #history-list button { font-size: 14px; }
    #driver-detail, #brand-detail { border-radius: 20px; }
}
@media screen and (max-width: 767px) {
    header { padding: 14px 16px !important; }
    header h1 { font-size: 16px !important; line-height: 1.5; }
    header .gap-4 { gap: 10px; }
    header svg { width: 22px; height: 22px; }
    nav { margin-bottom: 20px !important; }
    nav > div { grid-template-columns: repeat(3,minmax(0,1fr)); }
    nav button { font-size: 14px; }
    #section-quote section { padding: 20px; }
    #quote-card > div { padding: 20px; }
    #quote-card > div:first-child > div:first-child { flex-wrap: wrap; gap: 12px; }
    #quote-card > div:first-child .text-right { text-align: left; }
    #quote-card [id$="-row"] > div { gap: 8px; }
    #quote-card [id$="-row"] > div > div { width: 30px; height: 30px; border-radius: 9px; }
    #quote-card [id$="-row"] .text-base { font-size: 15px; }
    #quote-card [id$="-row"] .text-lg { font-size: 17px; }
    #display-total { font-size: 48px; }
    #section-drivers > div, #section-warranty > div { padding: 20px; border-radius: 24px; }
    #brand-detail, #driver-detail { padding: 20px; }
    #section-training > section, #team-private > section, #team-manager { padding: 20px; }
    #driver-link { width: 100%; }
    #mobile-quote-bar { gap: 6px; }
    #mobile-quote-bar button { padding: 10px 12px; font-size: 14px; }
    #section-quote, #section-team, #section-drivers, #section-warranty, #section-training { min-width: 0; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}

/* Shared quotation workspace: readable inputs, quiet surfaces, clear customer output. */
:root {--quote-ink:#172b47;--quote-muted:#52647d;--quote-line:#dce5ef;--quote-blue:#2459c4;--quote-font:"Microsoft JhengHei","PingFang TC","Noto Sans TC",system-ui,sans-serif;}
@media screen {
 body {font-family:var(--quote-font);color:var(--quote-ink);background:#f4f7fb;line-height:1.7;}
 button,input,select,textarea {font-family:var(--quote-font);}
 button {letter-spacing:0;font-weight:600;min-height:44px;border-radius:12px;transition:background-color .15s,border-color .15s;}
 input:not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea {border-radius:12px;border-color:#ccd8e5;background:#fff;line-height:1.6;box-shadow:none;}
 input:focus-visible,select:focus-visible,textarea:focus-visible {outline:3px solid #9bc2ff;outline-offset:2px;}
 h1,h2,h3 {letter-spacing:-.02em;line-height:1.5;}
 pre {font-family:var(--quote-font);white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.95;tab-size:2;}
 .customer-preview {margin:16px 0;padding:18px 20px;background:#fff;border:1px solid var(--quote-line);border-radius:16px;color:var(--quote-ink);min-width:0;}
 .customer-preview summary {cursor:pointer;font-weight:700;font-size:16px;min-height:44px;line-height:1.7;}
 .customer-preview p {font-size:13px;color:var(--quote-muted);margin:6px 0 14px;}
 .customer-preview pre {padding:18px;background:#f7f9fc;border:1px solid #e7edf5;border-radius:12px;font-size:15px;max-height:600px;overflow:auto;}
}
@media screen and (max-width:600px) {
 .customer-preview {padding:14px;margin:12px 0;}
 .customer-preview pre {padding:14px;font-size:14px;max-height:none;}
}

@media screen {
 header {box-shadow:0 2px 12px #142e4f10!important;}
 main {max-width:1360px!important;}
 #section-quote section,#history-section,#section-training>section {border-color:var(--quote-line);box-shadow:0 4px 18px #17335405;}
 #quote-card {border:1px solid var(--quote-line);box-shadow:0 8px 30px #17335409;}
 #quote-card>div:first-child {background:linear-gradient(125deg,#194caa,#2868db);}
 #quote-card .statement-box {padding:16px;font-size:13px;line-height:1.85;background:#f7f9fc;border-radius:14px;}
 #device-options button,#urgency-options button {border-radius:12px;font-size:14px;padding:12px 10px;min-height:52px;box-shadow:none;}
 nav>div {padding:5px;background:#e8eef6;border-radius:16px;}
 nav button {border-radius:12px!important;}
 #display-total {font-size:clamp(40px,4.8vw,58px);font-variant-numeric:tabular-nums;letter-spacing:-.04em;}
 #print-btn,#copy-btn {min-height:50px;font-size:15px;padding:12px 16px;box-shadow:none;}
}
@media screen and (max-width:767px) {
 main {padding:16px!important;}
 #section-quote section,#quote-card>div {padding:20px;}
 #device-options {gap:8px;}
 #quote-card {border-radius:20px;}
 #section-quote .gap-10 {gap:18px;}
 #history-list>div {padding:14px;}
}
@media screen and (max-width:767px) {
 nav>div {grid-template-columns:repeat(3,minmax(0,1fr))!important;}
 nav button {min-height:48px;padding:10px 6px!important;font-size:13px;line-height:1.5;}
}

/* Driver downloads use the same accessible reading scale as warranty lookup. */
@media screen {
 #section-drivers {font-size:18px;color:#17304d;}
 #section-drivers > div {padding:32px;border-radius:24px;border:1px solid #cbd8e7;box-shadow:0 8px 28px #17304d08;}
 #section-drivers h2 {font-size:30px;line-height:1.5;}
 #section-drivers h3 {font-size:22px;color:#172b47;}
 #section-drivers p {font-size:18px;color:#364c65;line-height:1.85;}
 #section-drivers .driver-guide {padding:18px 22px;background:#edf4ff;border-left:4px solid #2459c4;border-radius:12px;margin-bottom:28px;}
 #section-drivers .driver-guide strong {display:block;color:#173f84;font-size:20px;margin-bottom:6px;}
 #section-drivers #driver-grid,#section-drivers #driver-guide-grid {grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;}
 #section-drivers .brand-card {min-height:174px;padding:20px 14px;border:2px solid #c9d6e6;border-radius:18px;gap:10px;background:#fff;box-shadow:0 2px 5px #17304d05;}
 #section-drivers .brand-card:hover,#section-drivers .brand-card:focus-visible {border-color:#2459c4;background:#f0f6ff;transform:none;}
 #section-drivers .brand-card[aria-pressed="true"] {border-color:#2459c4;background:#eaf2ff;box-shadow:0 0 0 1px #2459c4;}
 #section-drivers .brand-card > div {background:#e8eff9;color:#214a83;width:54px;height:54px;font-size:22px;}
 #section-drivers .brand-card > span:first-of-type {font-size:20px;line-height:1.6;font-weight:700;color:#172b47;white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;}
 #section-drivers .brand-card > span:last-of-type {font-size:16px;font-weight:600;color:#164ba5;line-height:1.6;}
 #section-drivers #driver-detail {background:#f2f6fc;border-color:#b7cce9;scroll-margin-top:100px;}
 #section-drivers #driver-name {font-size:26px;}
 #section-drivers #driver-host {font-size:16px;color:#495d73;}
 #section-drivers #driver-detail a,#section-drivers #driver-detail button {font-size:18px;min-height:52px;padding:14px 22px;}
 #section-drivers #driver-link {background:#174eaf;color:#fff;}
}
@media screen and (max-width:1000px) {
 #section-drivers #driver-grid,#section-drivers #driver-guide-grid {grid-template-columns:repeat(3,minmax(0,1fr));}
}
@media screen and (max-width:700px) {
 #section-drivers #driver-grid,#section-drivers #driver-guide-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
 #section-drivers .brand-card {padding:16px 10px;min-height:166px;}
 #section-drivers > div {padding:20px;}
 #section-drivers h2 {font-size:26px;}
 #section-drivers .driver-guide {padding:16px;}
 #section-drivers #driver-detail a,#section-drivers #driver-detail button {width:100%;}
}
@media screen and (max-width:380px) {
 #section-drivers #driver-grid,#section-drivers #driver-guide-grid {grid-template-columns:1fr;}
}

@media screen { #section-drivers label {font-size:18px;font-weight:700;color:#17304d;} #section-drivers input,#section-drivers select,#section-drivers button {font-size:18px;} #section-drivers input,#section-drivers select {min-height:54px;margin-top:8px;} #section-drivers .driver-guide {margin-bottom:24px;} #section-drivers summary,#section-drivers li,#section-drivers #driver-warranty {font-size:18px;line-height:1.85;color:#23456d;} #section-drivers #driver-detail {scroll-margin-top:100px;} }
@media screen and (max-width:700px) { #section-drivers label {flex:1 1 100%;min-width:0;} #section-drivers select,#section-drivers #driver-reset {width:100%;} }

/* Comfortable quotation entry: screen only; quoted prices and print layouts are unchanged. */
@media screen { #section-quote button.btn-active {color:#fff!important;} }
@media screen {
 body {font-family:"Microsoft JhengHei","PingFang TC",system-ui,sans-serif;font-size:18px;line-height:1.8;color:#17304d;}
 button,input,select,textarea {font-family:inherit;}
 button {font-size:18px!important;min-height:52px;line-height:1.6!important;white-space:normal;}
 input:not([type=checkbox]):not([type=radio]):not([type=file]),select,textarea {font-size:18px!important;min-height:54px;line-height:1.7;border-color:#8da2bc!important;background-color:#fff;color:#172b47;}
 input::placeholder,textarea::placeholder {color:#52657c;opacity:1;}
 input[type=checkbox],input[type=radio] {width:24px;height:24px;flex-shrink:0;accent-color:#174eaf;}
 label {font-size:18px!important;line-height:1.75!important;}
 button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible {outline:3px solid #2459c4;outline-offset:3px;}
 .customer-preview summary {font-size:20px!important;min-height:52px;}
 .customer-preview pre {font-size:18px!important;line-height:1.9;overflow-wrap:anywhere;}
 .customer-preview p {font-size:17px!important;color:#425773;}
}
@media screen and (max-width:600px) {
 button {min-height:52px;}
 input,textarea,select {max-width:100%;}
 .customer-preview {padding:16px;}
 .customer-preview pre {padding:12px!important;font-size:18px!important;max-height:none!important;}
}

@media screen {
 #section-quote .text-xs,#section-quote .text-sm,#section-team .text-xs,#section-team .text-sm {font-size:17px!important;line-height:1.8;}
 #section-quote [class*="text-[10px]"],#section-quote [class*="text-[11px]"] {font-size:16px!important;}
 #section-quote label,#section-quote .text-slate-400,#section-quote .text-slate-500,#section-team .text-slate-400,#section-team .text-slate-500 {color:#425773!important;}
 #section-quote h2,#section-team h2 {font-size:24px;}
 #device-options button,#urgency-options button {font-size:18px!important;padding:14px 12px;min-height:60px;}
 #section-quote .border-slate-100 {border-color:#b8c9dd;}
 #section-quote .statement-box {font-size:17px!important;line-height:1.85;}
 #display-total {font-size:clamp(40px,5vw,58px);}
 #history-list button {font-size:17px!important;}
 #section-quote .grid>*,#section-team .grid>* {min-width:0;}
 #section-quote label[class*="tracking-"] {letter-spacing:0;}
 #display-id {white-space:normal;overflow-wrap:anywhere;font-size:16px;}
}
@media screen and (max-width:900px) {
 #section-quote {grid-template-columns:1fr!important;}
}
@media screen and (max-width:600px) {
 #section-quote .grid-cols-2,#section-quote .grid-cols-3,#section-team .grid-cols-2,#section-team .grid-cols-3 {grid-template-columns:1fr!important;}
 #section-quote section,#quote-card>div {padding:18px;}
 #quote-card [id$="-row"] {flex-wrap:wrap;}
 #mobile-quote-bar {flex-wrap:wrap;}
 #mobile-quote-bar button {flex:1 1 120px;}
 nav>div {display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;}
 nav button {font-size:17px!important;}
}

@media screen {
 .simple-workflow #team-manager>:not(details):not(h3) {display:none!important;}
 .workspace-notices {max-width:1320px;margin:18px auto;padding:20px;background:#eef5ff;border:1px solid #b4c9e6;border-radius:18px;color:#17304d;}
 .workspace-notices h2 {font-size:22px;font-weight:700;margin-bottom:10px;}
 .workspace-notices h3 {font-size:20px;font-weight:700;}
 .workspace-notices article {background:#fff;padding:16px;border-radius:12px;margin:10px 0;}
 .workspace-notices article p {white-space:pre-wrap;overflow-wrap:anywhere;font-size:18px;line-height:1.85;}
 .workspace-notices input,.workspace-notices textarea,.workspace-notices select {display:block;width:100%;margin:12px 0;border:1px solid #94a3b8;padding:12px;border-radius:10px;}
 .workspace-notices button {background:#174eaf;color:white;padding:12px 18px;margin:6px;border-radius:10px;}
 .workspace-notices summary {font-size:18px;min-height:48px;cursor:pointer;}
 .workflow-hint {padding:14px 18px;margin:12px 0;border:1px solid #bdd2e9;border-radius:12px;background:#f0f6ff;color:#17304d;font-size:18px;}
}
@media print {.workspace-notices,.workflow-hint {display:none!important;}}

/* Match the maintenance editor's fixed prefix column and comfortable touch target. */
@media screen {
 #section-quote input:not([type=checkbox]):not([type=radio]),#section-quote select {min-height:58px;box-sizing:border-box;}
 #section-quote .money-input {display:block;position:relative;width:100%;min-width:0;}
 #section-quote .money-prefix {position:absolute;left:1px;top:1px;bottom:1px;width:54px;display:flex;align-items:center;justify-content:center;border-right:1px solid #d5dfeb;color:#425773;font-size:16px;font-weight:600;line-height:1;pointer-events:none;}
 #section-quote .money-prefix svg {display:block;width:20px;height:20px;flex:none;}
 #section-quote .money-input>input {width:100%;min-width:0;height:58px;min-height:58px;padding:12px 14px 12px 70px!important;margin:0;box-sizing:border-box;line-height:1.6;text-align:left;}
 #section-quote label:has(>.money-input) {min-width:0;}
 #section-quote label>.money-input {margin-top:8px;}
 #section-quote .grid>* {min-width:0;}
}