/* English: The visual system uses the supplied ICOT red/blue mark as the anchor. 繁中：視覺系統以提供的 ICOT 紅藍標誌作為核心。 */
:root { --navy:#0f3b5d; --navy-deep:#092b43; --ink:#183246; --muted:#718391; --line:#e3e9ed; --paper:#f7f9fa; --white:#fff; --red:#ef3f32; --blue:#1d5b8f; --green:#2f8a68; --amber:#c48425; --soft-blue:#eaf2f8; --shadow:0 18px 40px rgba(21,53,74,.07); --radius:16px; }
* { box-sizing:border-box; }
html { min-width:320px; background:var(--paper); }
body { margin:0; color:var(--ink); background:var(--paper); font-family:"Segoe UI", Inter, Arial, sans-serif; -webkit-font-smoothing:antialiased; }
button { font:inherit; color:inherit; cursor:pointer; }
.app-shell[hidden],.login-screen[hidden] { display:none!important; }
.app-shell { display:flex; min-height:100vh; }
/* English: The authentication screen carries the same ICOT geometry without exposing the dashboard first. 繁中：身份驗證畫面沿用 ICOT 幾何語言，並避免先顯示儀表板。 */
.login-screen { min-height:100vh; display:grid; place-items:center; padding:30px; background:linear-gradient(135deg,var(--navy-deep) 0 42%,#f4f7f8 42% 100%); }.login-card { width:min(100%,470px); padding:36px; border:1px solid rgba(255,255,255,.8); border-radius:18px; background:#fff; box-shadow:0 35px 90px rgba(6,30,45,.27); }.login-brand { display:flex; align-items:center; gap:12px; margin-bottom:38px; }.login-brand img { width:43px; height:43px; object-fit:cover; }.login-brand strong,.login-brand small { display:block; }.login-brand strong { color:var(--navy); font-size:18px; letter-spacing:.16em; }.login-brand small { margin-top:4px; color:#91a1a9; font-size:9px; letter-spacing:.12em; text-transform:uppercase; }.login-card h1 { margin:11px 0 13px; font-size:31px; line-height:1.08; }.login-card > p:not(.panel-kicker) { color:#748791; font-size:11px; line-height:1.6; }.login-card form { margin-top:25px; }.login-card .primary-button { width:100%; margin-top:5px; padding:12px 14px; }.login-error { padding:10px 12px; border:1px solid #f1cec8; border-radius:8px; color:#a1483e; background:#fff2ef; font-size:10px; }.login-footnote { display:block; margin-top:22px; color:#9ba8ae; font-size:9px; text-align:center; }.account-summary { display:flex; align-items:center; gap:12px; padding:15px; border-radius:10px; background:#f4f8f9; }.account-summary strong,.account-summary small { display:block; }.account-summary strong { color:#456272; font-size:12px; }.account-summary small { margin-top:4px; color:#899aa2; font-size:9px; }
.sidebar { width:252px; flex:none; display:flex; flex-direction:column; padding:30px 18px 18px; color:#dce8ee; background:var(--navy-deep); }
/* English: Each audience has a distinct control-room tone so the active product boundary is immediately recognizable. 繁中：每類使用者採用不同控制中心色調，讓目前產品邊界一望即知。 */
body[data-interface="owner"] .sidebar { background:#082a43; }
body[data-interface="admin"] .sidebar { background:#153d52; }
body[data-interface="user"] .sidebar { background:#3e403d; }
body[data-interface="admin"] .nav-item.is-active { background:#2b617a; box-shadow:inset 3px 0 0 #7ec3dc; }
body[data-interface="user"] .nav-item.is-active { background:#595b55; box-shadow:inset 3px 0 0 #d68a5e; }
.brand-lockup { display:flex; gap:12px; align-items:center; padding:0 10px 38px; }
.brand-mark { width:40px; height:40px; object-fit:cover; border-radius:2px; background:white; }
.brand-name { margin:0; color:#fff; font-size:20px; font-weight:760; letter-spacing:.12em; }
.brand-caption { margin:3px 0 0; color:#91a8b7; font-size:10px; letter-spacing:.12em; text-transform:uppercase; }
.eyebrow,.panel-kicker,.section-kicker { margin:0; color:#8fa7b6; font-size:10px; font-weight:750; letter-spacing:.12em; text-transform:uppercase; }
.interface-identity { display:flex; align-items:center; gap:10px; margin:0 8px 38px; padding:0 0 18px; border-bottom:1px solid rgba(255,255,255,.1); }
.interface-identity small,.interface-identity strong { display:block; }.interface-identity small { color:#91a8b7; font-size:8px; font-weight:750; letter-spacing:.08em; text-transform:uppercase; }.interface-identity strong { margin-top:4px; color:#fff; font-size:11px; }.interface-mark { display:grid; place-items:center; flex:none; width:33px; height:33px; border:1px solid rgba(255,255,255,.18); border-radius:8px; color:#fff; background:rgba(255,255,255,.08); font-size:9px; font-weight:800; }
.nav-group { display:grid; gap:7px; }
.nav-item { display:flex; align-items:center; gap:12px; border:0; border-radius:10px; padding:11px 12px; background:transparent; color:#afc1cb; font-size:13px; text-align:left; transition:background .2s,color .2s,transform .2s; }
.nav-item:hover,.nav-item:focus-visible { color:#fff; background:rgba(255,255,255,.08); outline:none; }
.nav-item.is-active { color:#fff; background:#184e70; box-shadow:inset 3px 0 0 var(--red); }
.nav-icon { width:19px; color:#86adc1; font-size:17px; text-align:center; }
.nav-item.is-active .nav-icon { color:#fff; }
.sidebar-footer { margin-top:auto; display:grid; gap:14px; }
.environment-pill { display:flex; align-items:center; gap:8px; padding:9px 11px; border:1px solid rgba(143,193,173,.24); border-radius:9px; color:#a8d9c1; background:rgba(47,138,104,.1); font-size:11px; }
.status-dot { width:7px; height:7px; border-radius:50%; background:#5dc28c; box-shadow:0 0 0 4px rgba(93,194,140,.13); }
.user-chip { display:flex; align-items:center; gap:9px; border:0; padding:10px 2px; background:none; color:#fff; text-align:left; }
.user-chip strong,.user-chip small { display:block; }
.user-chip strong { font-size:11px; }
.user-chip small { margin-top:3px; color:#8fa7b6; font-size:10px; }
.user-chevron { margin-left:auto; color:#8fa7b6; }
.avatar { display:grid; place-items:center; flex:none; width:32px; height:32px; border-radius:50%; color:#fff; background:#356d8e; font-size:10px; font-weight:750; letter-spacing:.04em; }
.main-content { width:min(100%,1440px); margin:0 auto; padding:38px 54px 60px; }
.topbar,.hero-row,.panel-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; }
.breadcrumb { margin:0 0 14px; color:#93a0a8; font-size:11px; }
.breadcrumb span { padding:0 8px; color:#c1cbd0; }
h1,h2,p { margin-top:0; }
h1 { margin-bottom:0; color:var(--navy); font-family:Georgia,"Times New Roman",serif; font-size:clamp(28px,3vw,40px); font-weight:500; letter-spacing:-.045em; }
.title-dot { color:var(--red); }
.topbar-actions { display:flex; align-items:center; gap:10px; }
.icon-button,.outline-button,.text-button,.more-button { border:0; background:none; }
.icon-button { position:relative; width:34px; height:34px; color:#617885; font-size:22px; }
.notification-dot { position:absolute; top:5px; right:5px; width:6px; height:6px; border:2px solid var(--paper); border-radius:50%; background:var(--red); }
.outline-button { border:1px solid #cbd7dd; border-radius:8px; padding:9px 13px; background:#fff; color:var(--navy); font-size:11px; font-weight:700; }
.outline-button span { padding-left:8px; color:var(--red); }
.hero-row { align-items:center; margin:44px 0 24px; padding-bottom:24px; border-bottom:1px solid var(--line); }
.section-kicker { color:#adbbc2; }
.hero-copy { max-width:600px; margin:10px 0 0; color:#627580; font-size:14px; line-height:1.6; }
.date-control { padding:10px 12px; border:1px solid var(--line); border-radius:8px; color:#607582; background:#fff; font-size:11px; white-space:nowrap; }
.calendar-icon { padding-right:7px; color:var(--red); }.control-chevron { padding-left:12px; color:#93a3ac; }
.metric-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.metric-card { min-height:145px; padding:19px 20px; border:1px solid var(--line); border-radius:var(--radius); background:#fff; box-shadow:0 6px 20px rgba(21,53,74,.025); }
.metric-card-primary { color:#fff; border-color:var(--navy); background:var(--navy); box-shadow:var(--shadow); }
.metric-card-warning { background:#fffdf7; border-color:#f0e2c9; }
.metric-top,.metric-foot,.budget-title,.budget-meta,.legend-row { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.metric-label { color:#7e909a; font-size:11px; font-weight:700; }.metric-card-primary .metric-label { color:#aec5d2; }
.metric-icon { display:grid; place-items:center; width:26px; height:26px; border-radius:7px; color:#5d89a5; background:#eff5f8; font-size:13px; font-weight:800; }.metric-card-primary .metric-icon { color:#fff; background:#27597a; }.metric-card-warning .metric-icon { color:var(--amber); background:#fff0d5; }
.metric-value { margin:20px 0 10px; color:var(--navy); font-family:Georgia,"Times New Roman",serif; font-size:28px; letter-spacing:-.04em; }.metric-card-primary .metric-value { color:#fff; }.metric-value small { color:#9aa9b1; font-family:"Segoe UI",sans-serif; font-size:12px; letter-spacing:0; }
.metric-foot { color:#9aa9b1; font-size:10px; }.trend-positive { color:var(--green); font-weight:750; }.metric-card-primary .metric-foot { color:#9db7c5; }.metric-card-primary .trend-positive { color:#71d4a0; }.trend-warning { color:var(--amber); font-weight:750; }
.dashboard-grid { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(320px,.95fr); gap:18px; margin-top:18px; }
.lower-grid { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(320px,.95fr); gap:18px; margin-top:18px; }
.panel { min-width:0; padding:24px; border:1px solid var(--line); border-radius:var(--radius); background:#fff; box-shadow:0 6px 20px rgba(21,53,74,.025); }
.panel-kicker { margin-bottom:7px; color:#a1afb6; }.panel h2 { margin-bottom:0; color:var(--navy); font-family:Georgia,"Times New Roman",serif; font-size:19px; font-weight:500; letter-spacing:-.025em; }
.text-button { padding:4px 0; color:#527389; font-size:11px; font-weight:700; }.text-button:hover,.panel-link:hover { color:var(--red); }
.more-button { padding:0; color:#8498a3; letter-spacing:2px; }
.legend-row { justify-content:flex-start; margin:28px 0 8px; color:#8b9ba4; font-size:10px; }.legend-row span + span { margin-left:18px; }.legend-dot { display:inline-block; width:7px; height:7px; margin-right:7px; border-radius:50%; }.legend-total { background:var(--navy); }.legend-forecast { background:#c3d1d8; }
.chart-wrap { display:flex; height:250px; }.y-axis { width:38px; display:flex; flex-direction:column; justify-content:space-between; padding:6px 0 27px; color:#a0adb4; font-size:9px; text-align:left; }.chart-area { position:relative; flex:1; min-width:0; }.grid-line { position:absolute; right:0; left:0; border-top:1px dashed #e9eef1; }.line-1{top:5px}.line-2{top:49px}.line-3{top:93px}.line-4{top:137px}.line-5{top:181px}.spend-chart { position:absolute; inset:0 0 27px; width:100%; height:calc(100% - 27px); overflow:visible; }.x-axis { position:absolute; right:0; bottom:0; left:0; display:flex; justify-content:space-between; color:#a0adb4; font-size:9px; }
.budget-panel { display:flex; flex-direction:column; }.budget-list { margin:22px 0 12px; }.budget-item + .budget-item { margin-top:22px; }.budget-title { color:#435e6d; font-size:11px; }.budget-title span { color:#7c8e98; font-weight:750; }.progress-track { height:7px; margin:9px 0 7px; overflow:hidden; border-radius:99px; background:#edf1f2; }.progress-fill { display:block; height:100%; border-radius:99px; }.progress-high { background:var(--red); }.progress-medium { background:#d69b31; }.progress-safe { background:#62ad87; }.budget-meta { color:#9aa8ae; font-size:10px; }
.panel-link { display:flex; align-items:center; justify-content:space-between; width:100%; margin-top:auto; padding:17px 0 0; border:0; border-top:1px solid var(--line); background:none; color:#527389; font-size:11px; font-weight:700; text-align:left; }.panel-link span { color:var(--red); font-size:16px; }
.table-wrap { margin:22px -24px -24px; overflow:auto; }.table-wrap table { width:100%; border-collapse:collapse; min-width:650px; }.table-wrap th { padding:0 14px 12px; color:#9aa8ae; font-size:9px; font-weight:750; letter-spacing:.07em; text-align:left; text-transform:uppercase; }.table-wrap th:first-child,.table-wrap td:first-child { padding-left:24px; }.table-wrap th:last-child,.table-wrap td:last-child { padding-right:24px; }.table-wrap td { padding:13px 14px; border-top:1px solid #edf1f3; color:#637984; font-size:10px; white-space:nowrap; }.person-cell { display:flex; align-items:center; gap:9px; }.person-cell strong,.person-cell small { display:block; }.person-cell strong { color:#405b6a; font-size:11px; }.person-cell small { margin-top:3px; color:#a2afb4; font-size:9px; }.avatar-small { width:28px; height:28px; font-size:9px; }.avatar-blue { background:#4d83a1; }.avatar-gold { background:#bd8d42; }.avatar-green { background:#4b9479; }.category-pill { display:inline-block; padding:5px 8px; border-radius:6px; font-size:9px; font-weight:750; }.category-blue { color:#37718d; background:#eaf4f7; }.category-purple { color:#725e9d; background:#f0ecf8; }.category-orange { color:#ac7024; background:#fff1df; }.status-label { font-size:10px; font-weight:750; }.status-ok { color:var(--green); }.status-review { color:var(--amber); }
.alert-count { padding:6px 8px; border-radius:6px; color:#b45a32; background:#fff1e7; font-size:10px; font-weight:750; }.alert-list { margin:19px 0 12px; }.alert-item { display:flex; gap:11px; padding:13px 0; border-bottom:1px solid #edf1f3; }.alert-item:last-child { border-bottom:0; }.alert-symbol { display:grid; place-items:center; flex:none; width:25px; height:25px; border-radius:7px; font-size:12px; font-weight:800; }.alert-red { color:#c2473b; background:#ffebe7; }.alert-amber { color:#b27c2c; background:#fff2db; }.alert-blue { color:#3e7897; background:#e9f3f8; }.alert-item strong { color:#405b6a; font-size:11px; }.alert-item p { margin:4px 0; color:#7f919b; font-size:10px; line-height:1.35; }.alert-item small { color:#a3afb4; font-size:9px; }
.toast { position:fixed; right:24px; bottom:24px; z-index:5; transform:translateY(20px); opacity:0; padding:12px 16px; border-radius:8px; color:#fff; background:var(--navy); box-shadow:var(--shadow); font-size:12px; pointer-events:none; transition:opacity .2s,transform .2s; }.toast.is-visible { transform:translateY(0); opacity:1; }
/* English: Dialogs use the same disciplined ICOT control language as all three interfaces. 繁中：對話框在三個介面中沿用一致而穩重的 ICOT 控制語言。 */
.modal-backdrop[hidden] { display:none; }
.modal-open { overflow:hidden; }.modal-backdrop { position:fixed; inset:0; z-index:30; display:grid; place-items:center; padding:20px; background:rgba(7,31,47,.54); backdrop-filter:blur(4px); }.modal-card { width:min(100%,590px); max-height:min(88vh,760px); overflow:auto; padding:25px; border:1px solid rgba(255,255,255,.6); border-radius:16px; background:#fff; box-shadow:0 30px 90px rgba(5,28,43,.28); }.modal-heading { display:flex; justify-content:space-between; gap:20px; margin-bottom:22px; padding-bottom:17px; border-bottom:1px solid var(--line); }.modal-heading h2 { margin:6px 0 0; color:var(--navy); font-family:Georgia,"Times New Roman",serif; font-size:24px; font-weight:500; letter-spacing:-.025em; }.modal-close { width:31px; height:31px; border:1px solid #dce5e9; border-radius:8px; color:#718691; background:#fff; font-size:20px; line-height:1; }.modal-form { display:grid; gap:16px; }.modal-form label { display:grid; gap:7px; color:#627985; font-size:10px; font-weight:750; }.modal-form input,.modal-form select,.modal-form textarea { width:100%; border:1px solid #d4dfe4; border-radius:8px; padding:11px 12px; color:#385868; background:#fff; font:11px "Segoe UI",sans-serif; outline:none; }.modal-form textarea { resize:vertical; line-height:1.5; }.modal-form input:focus,.modal-form select:focus,.modal-form textarea:focus { border-color:#6e9bb4; box-shadow:0 0 0 3px rgba(66,119,148,.12); }.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }.form-note { margin:0; padding:11px 12px; border-radius:8px; color:#7f919b; background:#f5f8f9; font-size:9px; line-height:1.5; }.modal-actions { display:flex; justify-content:flex-end; gap:9px; margin-top:5px; padding-top:17px; border-top:1px solid var(--line); }.secondary-button { border:1px solid #d5e0e5; border-radius:8px; padding:10px 13px; color:#617985; background:#fff; font-size:10px; font-weight:750; }.secret-warning { padding:13px; border:1px solid #f0d7c7; border-radius:8px; background:#fff8f3; }.secret-warning strong { color:#a15b37; font-size:10px; }.secret-warning p { margin:5px 0 0; color:#9a735e; font-size:9px; line-height:1.5; }.session-context { display:grid; grid-template-columns:1fr 1fr auto; align-items:center; gap:14px; margin-bottom:18px; padding:12px; border-radius:9px; background:#f1f6f8; }.session-context small,.session-context strong { display:block; }.session-context small { color:#91a1a9; font-size:8px; text-transform:uppercase; letter-spacing:.08em; }.session-context strong { margin-top:4px; color:#456272; font-size:10px; }.monitoring-strip { display:flex; align-items:center; gap:8px; padding:10px; border-radius:8px; color:#648174; background:#edf7f1; font-size:9px; line-height:1.45; }
.message-list { display:grid; }.message-list article { display:grid; grid-template-columns:30px 1fr auto; align-items:center; gap:12px; padding:15px 0; border-bottom:1px solid #edf1f3; }.message-list strong { color:#456272; font-size:11px; }.message-list p { margin:4px 0 0; color:#91a1a9; font-size:9px; }.message-list > article > small { color:#718691; font-size:9px; }.health-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }.health-summary { display:flex; align-items:center; gap:24px; }.health-summary h2 { margin:6px 0 8px; }.health-summary p:last-child { margin:0; color:#82949d; font-size:10px; line-height:1.55; }.health-ring { display:grid; place-items:center; flex:none; width:118px; height:118px; border:9px solid #dceee5; border-top-color:var(--green); border-radius:50%; color:var(--navy); font-family:Georgia,"Times New Roman",serif; font-size:23px; }.health-ring small { margin-left:2px; font-size:10px; }.compact-health-list { display:grid; margin-top:18px; }.compact-health-list > div { display:grid; grid-template-columns:9px 1fr auto 70px; align-items:center; gap:9px; padding:12px 0; border-bottom:1px solid #edf1f3; }.compact-health-list strong { color:#4b6877; font-size:10px; }.compact-health-list span:nth-child(3),.compact-health-list small { color:#8c9da5; font-size:9px; }.compact-health-list small { text-align:right; }.dot-warning { background:#d69b31; box-shadow:0 0 0 4px rgba(214,155,49,.13); }.provider-custom { background:#708896; }.project-permissions { display:grid; gap:6px; margin-top:18px; color:#6a8b7b; font-size:9px; }
/* English: Role pages share a compact set of controls and data surfaces. 繁中：角色頁面共用一組精簡的控制項及資料介面。 */
.role-topbar { align-items:flex-start; }.role-description { max-width:620px; margin:12px 0 0; color:#718391; font-size:13px; line-height:1.55; }.module-action-row { display:flex; justify-content:flex-end; margin:24px 0 -8px; }.module-action-row + .panel,.module-action-row + .card-grid-3,.module-action-row + .provider-admin-grid,.module-action-row + .policy-grid { margin-top:24px; }
.table-subtext { display:block; margin-top:4px; color:#9aa8ae; font-size:9px; }.status-warning { color:var(--amber); }.event-list { margin:19px 0 14px; }.event-item { display:flex; gap:11px; padding:13px 0; border-bottom:1px solid #edf1f3; }.event-item:last-child { border-bottom:0; }.event-item strong { color:#405b6a; font-size:11px; }.event-item p { margin:4px 0; color:#7f919b; font-size:10px; line-height:1.35; }.event-item small { color:#a3afb4; font-size:9px; }.department-bars { display:grid; gap:22px; margin-top:28px; }.bar-label { display:flex; justify-content:space-between; color:#637984; font-size:11px; }.bar-label strong { color:#426072; }.bar-track { height:8px; margin-top:9px; overflow:hidden; border-radius:99px; background:#edf1f2; }.bar-track i { display:block; height:100%; border-radius:99px; background:var(--navy); }.bar-track i::after { content:""; display:block; width:100%; height:100%; background:linear-gradient(90deg,transparent,rgba(255,255,255,.18)); }
.workspace-hero { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(270px,.75fr); gap:18px; margin-top:32px; padding:30px; border:1px solid #dce7ec; border-radius:var(--radius); background:linear-gradient(120deg,#f0f6f8 0%,#fff 58%); box-shadow:var(--shadow); }.workspace-intro h2 { margin:15px 0 10px; color:var(--navy); font-family:Georgia,"Times New Roman",serif; font-size:27px; font-weight:500; letter-spacing:-.035em; }.workspace-intro p { max-width:580px; color:#718391; font-size:12px; line-height:1.65; }.workspace-badge { display:inline-block; padding:6px 8px; border-radius:6px; color:var(--green); background:#e8f4ed; font-size:9px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }.workspace-controls { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:22px 0; }.workspace-controls label { display:grid; gap:8px; color:#7b8e98; font-size:10px; font-weight:750; }.workspace-controls select { width:100%; border:1px solid #d5e0e5; border-radius:8px; padding:11px; color:#476474; background:#fff; font-size:11px; }.primary-button { border:0; border-radius:8px; padding:11px 14px; color:#fff; background:var(--navy); font-size:11px; font-weight:750; }.primary-button span { padding-left:14px; color:#f5887f; }.workspace-side { padding:20px; border-left:1px solid #dfe9ed; }.workspace-side strong { display:block; margin:13px 0 2px; color:var(--navy); font-family:Georgia,"Times New Roman",serif; font-size:31px; font-weight:500; }.workspace-side > span { display:block; color:#81939c; font-size:10px; }.workspace-side .progress-track { margin:18px 0 8px; }.workspace-side > small { color:#97a6ad; font-size:9px; }.notice-box { display:flex; gap:9px; margin-top:25px; padding:12px; border:1px solid #f0dec1; border-radius:8px; background:#fffaf0; }.notice-box > span { display:grid; place-items:center; flex:none; width:18px; height:18px; border-radius:50%; color:#a87835; background:#fff0d4; font-size:10px; }.notice-box p { margin:0; color:#96744a; font-size:9px; line-height:1.5; }.user-snapshot { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:24px; }.user-snapshot div { padding:15px; border-radius:9px; background:#f7fafb; }.user-snapshot strong,.user-snapshot span { display:block; }.user-snapshot strong { color:var(--navy); font-family:Georgia,"Times New Roman",serif; font-size:20px; font-weight:500; }.user-snapshot span { margin-top:5px; color:#91a1a9; font-size:9px; }.mini-activity { display:grid; gap:10px; margin-top:18px; }.mini-activity > div { display:grid; grid-template-columns:130px 1fr auto; align-items:center; gap:14px; padding-top:11px; border-top:1px solid #edf1f3; }.mini-activity strong { color:#557080; font-size:10px; }.mini-activity small { color:#a0adb4; font-size:9px; }
/* English: The provider-native launchpad makes capture coverage visible without impersonating a provider chat surface. 繁中：供應商原生啟動台清楚顯示擷取覆蓋範圍，不會冒充供應商聊天介面。 */
.native-access-hero { display:grid; grid-template-columns:minmax(0,1.45fr) minmax(280px,.65fr); gap:32px; margin-top:32px; padding:32px; overflow:hidden; border:1px solid #d9e5e8; border-radius:var(--radius); background:linear-gradient(118deg,#eef6f4 0 62%,#f8f4ee 62% 100%); box-shadow:var(--shadow); }.native-access-hero h2 { margin:16px 0 12px; color:#173d4b; font-family:Georgia,"Times New Roman",serif; font-size:29px; font-weight:500; letter-spacing:-.035em; line-height:1.12; }.native-access-hero > div > p { max-width:650px; color:#6d8187; font-size:12px; line-height:1.65; }.project-context { display:grid; gap:8px; max-width:480px; margin-top:22px; color:#647a80; font-size:10px; font-weight:750; }.project-context select { width:100%; border:1px solid #cbdcdf; border-radius:9px; padding:12px; color:#345563; background:#fff; font-size:11px; }.capture-coverage { display:flex; align-items:flex-start; gap:13px; align-self:center; padding:20px; border:1px solid rgba(74,109,100,.18); border-radius:12px; background:rgba(255,255,255,.72); }.capture-pulse { flex:none; width:10px; height:10px; margin-top:4px; border-radius:50%; background:#d49b4e; box-shadow:0 0 0 6px rgba(212,155,78,.13); }.capture-coverage small,.capture-coverage strong { display:block; }.capture-coverage small { color:#8a9a98; font-size:8px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }.capture-coverage strong { margin-top:6px; color:#3b5d59; font-size:13px; }.capture-coverage p { margin:9px 0 0; color:#788a87; font-size:9px; line-height:1.55; }.provider-launch-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin:24px 0; }.provider-launch-card { display:flex; flex-direction:column; min-height:250px; padding:20px; border:1px solid #dee7e8; border-radius:13px; background:#fff; box-shadow:0 12px 30px rgba(31,62,68,.045); }.provider-launch-heading { display:flex; align-items:center; gap:11px; }.provider-launch-heading strong,.provider-launch-heading small { display:block; }.provider-launch-heading strong { color:#385765; font-size:12px; }.provider-launch-heading small { margin-top:4px; color:#98a5aa; font-size:9px; }.provider-launch-card > p { min-height:56px; margin:18px 0; color:#75878f; font-size:10px; line-height:1.55; }.coverage-row { display:flex; justify-content:space-between; gap:10px; margin-top:auto; padding:12px 0; border-top:1px solid #edf1f2; color:#8b9a9f; font-size:9px; }.coverage-ready { color:var(--green); }.coverage-limited { color:var(--amber); }.provider-launch-card .primary-button { width:100%; margin-top:3px; }.provider-launch-card .primary-button:disabled { cursor:not-allowed; color:#98a5aa; background:#edf1f2; }.provider-empty { grid-column:1/-1; min-height:230px; border:1px solid #dee7e8; border-radius:13px; background:#fff; }.native-flow { display:grid; gap:15px; margin:22px 0; padding:0; list-style:none; }.native-flow li { display:flex; gap:11px; align-items:flex-start; }.native-flow li > span { display:grid; place-items:center; flex:none; width:24px; height:24px; border-radius:7px; color:#fff; background:#496f6b; font-size:9px; font-weight:800; }.native-flow p,.native-flow strong { display:block; }.native-flow p { margin:0; color:#8a999e; font-size:9px; line-height:1.45; }.native-flow strong { margin-bottom:3px; color:#4a6670; font-size:10px; }
.provider-list { display:grid; gap:0; margin:15px 0 12px; }.provider-list > div { display:flex; align-items:center; gap:10px; padding:13px 0; border-bottom:1px solid #edf1f3; }.provider-list > div:last-child { border-bottom:0; }.provider-list strong,.provider-list small { display:block; }.provider-list strong { color:#496575; font-size:11px; }.provider-list small { margin-top:3px; color:#9aa8ae; font-size:9px; }.provider-list i { margin-left:auto; color:var(--green); font-size:9px; font-style:normal; font-weight:750; }.provider-mark { display:grid; place-items:center; width:30px; height:30px; border-radius:8px; color:#fff; font-size:13px; font-weight:800; }.provider-openai { background:#263f4e; }.provider-claude { background:#b16d46; }.provider-gemini { background:#5d77a6; }.card-grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }.project-card { min-height:210px; }.project-card h2 { margin:16px 0 5px; font-size:18px; }.project-card p { margin-bottom:20px; color:#8798a0; font-size:10px; }.project-card > strong { display:block; color:var(--navy); font-family:Georgia,"Times New Roman",serif; font-size:21px; font-weight:500; }.project-card > strong small { color:#9aa8ae; font-family:"Segoe UI",sans-serif; font-size:10px; }.project-card .progress-track { margin:17px 0 9px; }.project-card > small { color:#8a9ba4; font-size:9px; line-height:1.5; }.provider-admin-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }.provider-admin-card { padding-bottom:0; }.provider-heading { display:flex; align-items:center; gap:11px; }.provider-heading h2 { margin:0; font-family:"Segoe UI",sans-serif; font-size:14px; font-weight:750; }.provider-heading p { margin:4px 0 0; color:#96a4ab; font-size:9px; }.provider-heading .status-label { margin-left:auto; }.provider-meta { display:flex; justify-content:space-between; gap:10px; margin:23px 0 17px; color:#9aa8ae; font-size:9px; }.provider-meta strong { display:block; margin-top:4px; color:#557080; font-size:10px; }.audit-list { margin-top:20px; }.audit-list > div { display:grid; grid-template-columns:28px 1fr auto; align-items:center; gap:11px; padding:15px 0; border-bottom:1px solid #edf1f3; }.audit-icon { display:grid; place-items:center; width:26px; height:26px; border-radius:7px; color:#3f7695; background:#eaf3f8; font-size:12px; }.audit-list strong,.audit-list small { display:block; }.audit-list strong { color:#496575; font-size:11px; }.audit-list small { margin-top:4px; color:#99a7ad; font-size:9px; }.filter-row { display:flex; flex-wrap:wrap; gap:7px; margin-bottom:20px; }.filter-chip { padding:8px 10px; border:1px solid #dce5e9; border-radius:7px; color:#81939c; background:#fff; font-size:10px; }.filter-chip.is-selected { border-color:#a7c0ce; color:var(--navy); background:#edf5f8; font-weight:750; }.workflow-note { display:flex; gap:14px; align-items:center; margin-top:20px; padding:14px; border-radius:8px; color:#6f8390; background:#f5f8f9; font-size:10px; }.workflow-note strong { color:var(--navy); }.module-placeholder { display:grid; place-items:center; min-height:360px; padding:50px; text-align:center; }.module-placeholder h2 { margin:20px 0 8px; font-family:Georgia,"Times New Roman",serif; font-size:24px; font-weight:500; }.module-placeholder p { max-width:430px; color:#83949d; font-size:12px; line-height:1.6; }.empty-orbit { display:grid; place-items:center; width:60px; height:60px; border:1px solid #bad0db; border-radius:50%; color:var(--navy); background:#eef6f8; font-size:24px; }.policy-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }.policy-card { min-height:240px; }.policy-number { color:var(--red); font-family:Georgia,"Times New Roman",serif; font-size:20px; }.policy-card h2 { margin:18px 0 10px; font-size:18px; }.policy-card p { color:#718391; font-size:11px; line-height:1.65; }.policy-card .status-label { display:block; margin-top:28px; }
@media (max-width:1050px) { .workspace-hero { grid-template-columns:1fr; }.workspace-side { padding:20px 0 0; border-top:1px solid #dfe9ed; border-left:0; }.card-grid-3,.provider-admin-grid,.policy-grid { grid-template-columns:1fr 1fr; }.health-grid { grid-template-columns:1fr; } }
@media (max-width:1050px) { .native-access-hero { grid-template-columns:1fr; background:linear-gradient(150deg,#eef6f4,#fff); }.provider-launch-grid { grid-template-columns:1fr 1fr; } }
@media (max-width:680px) { .role-description { font-size:11px; }.workspace-controls,.form-grid,.session-context { grid-template-columns:1fr; }.workspace-hero { padding:20px; }.card-grid-3,.provider-admin-grid,.policy-grid { grid-template-columns:1fr; }.user-snapshot { gap:7px; }.user-snapshot div { padding:10px; }.user-snapshot strong { font-size:16px; }.mini-activity > div { grid-template-columns:1fr; gap:6px; }.workflow-note { align-items:flex-start; flex-direction:column; }.modal-card { padding:19px; }.health-summary { align-items:flex-start; flex-direction:column; }.message-list article { grid-template-columns:30px 1fr; }.message-list > article > small { grid-column:2; } }
@media (max-width:680px) { .native-access-hero { padding:21px; }.native-access-hero h2 { font-size:24px; }.provider-launch-grid { grid-template-columns:1fr; }.provider-launch-card { min-height:0; }.provider-launch-card > p { min-height:0; } }
@media (max-width:1050px) { .sidebar { width:220px; }.main-content { padding:30px 28px 50px; }.metric-grid { grid-template-columns:repeat(2,1fr); }.dashboard-grid,.lower-grid { grid-template-columns:1fr; } }
@media (max-width:680px) { .app-shell { display:block; }.sidebar { width:100%; padding:18px 16px; }.brand-lockup { padding-bottom:20px; }.interface-identity,.sidebar-footer { display:none; }.nav-group { display:flex; gap:5px; overflow:auto; padding-bottom:2px; }.nav-group .eyebrow { display:none; }.nav-item { flex:none; padding:9px 10px; font-size:11px; }.nav-item.is-active { box-shadow:inset 0 -3px 0 var(--red); }.nav-icon { display:none; }.main-content { padding:26px 16px 40px; }.topbar-actions .icon-button { display:none; }.hero-row { display:block; margin-top:30px; }.date-control { display:inline-block; margin-top:16px; }.metric-grid { grid-template-columns:1fr 1fr; gap:10px; }.metric-card { min-height:132px; padding:15px; }.metric-value { font-size:23px; }.metric-foot { display:block; line-height:1.7; }.panel { padding:18px; }.table-wrap { margin-left:-18px; margin-right:-18px; }.table-wrap th:first-child,.table-wrap td:first-child { padding-left:18px; }.table-wrap th:last-child,.table-wrap td:last-child { padding-right:18px; } }
@media (max-width:520px) { .login-screen { padding:16px; background:var(--navy-deep); }.login-card { padding:26px 21px; }.login-card h1 { font-size:27px; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; } }

/* English: Provider destination display in the admin registry card and the general-user provider list. The destination
   is tenant data, so it is shown verbatim in a monospaced face rather than styled as prose.
   繁中：管理員註冊表卡片及一般用戶供應商清單中的目的地顯示。目的地屬租戶資料，
   因此以等寬字體原樣顯示，而非以文章樣式呈現。 */
.provider-destination-row { margin:13px 0 12px; padding:11px 12px; border-radius:8px; background:#f4f8f8; border:1px solid #e4edee; }
.provider-destination-row small { display:block; color:#8299a0; font-size:8.5px; font-weight:750; letter-spacing:.07em; }
.provider-destination-row code { display:block; margin-top:5px; color:#3d5f6d; font-family:Consolas,"Courier New",monospace; font-size:10px; word-break:break-all; }
.provider-destination-list > div > div { min-width:0; }
.provider-destination-list small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-family:Consolas,"Courier New",monospace; }
.provider-destination-list .status-label { margin-left:auto; flex-shrink:0; }