:root { --apple-black:#1d1d1f; --apple-ink:#313134; --apple-blue:#0071e3; --apple-blue-deep:#0066cc; --apple-blue-wash:#eaf4ff; --apple-paper:#fff; --apple-canvas:#f5f5f7; --apple-line:#d2d2d7; --apple-muted:#6e6e73; --apple-shadow:0 12px 34px rgba(0,0,0,.08); font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","PingFang TC","Noto Sans TC",sans-serif; }
* { box-sizing:border-box; }
html { min-width:1180px; background:var(--apple-canvas); }
body { min-width:1180px; margin:0; background:var(--apple-canvas); color:var(--apple-black); letter-spacing:-.012em; }
button,input,select,textarea { font:inherit; }
button { letter-spacing:inherit; }

.app-topbar { position:sticky; top:0; z-index:20; display:grid; grid-template-columns:205px minmax(560px,1fr) auto; align-items:center; gap:22px; min-height:76px; padding:0 32px; border-bottom:1px solid rgba(0,0,0,.09); background:rgba(255,255,255,.92); backdrop-filter:blur(18px) saturate(1.5); }
.brand { display:flex; align-items:center; gap:11px; color:var(--apple-black); text-decoration:none; }
.brand-mark { display:grid; place-items:center; inline-size:38px; block-size:38px; border-radius:11px; background:var(--apple-black); color:#fff; font-size:21px; line-height:1; box-shadow:inset 0 1px rgba(255,255,255,.25); }
.brand strong { display:block; font-size:16px; font-weight:760; letter-spacing:-.045em; }.brand small { display:block; margin-top:1px; color:var(--apple-muted); font-size:11px; font-weight:620; letter-spacing:0; }
.primary-nav { display:flex; align-items:center; gap:3px; min-width:0; overflow:hidden; white-space:nowrap; }
.nav-item { display:inline-flex; align-items:center; gap:7px; min-height:36px; padding:0 10px; border:0; border-radius:10px; background:transparent; color:#4d4d52; font-size:13px; font-weight:650; cursor:pointer; transition:background .18s ease,color .18s ease,transform .18s ease; }.nav-item span { font-size:17px; line-height:1; }.nav-item b { display:grid; place-items:center; min-inline-size:18px; padding:1px 5px; border-radius:99px; background:#e9e9ed; color:#6e6e73; font-size:11px; }.nav-item:hover { background:#f0f0f3; color:var(--apple-black); }.nav-item.is-active { background:var(--apple-blue-wash); color:var(--apple-blue-deep); }.nav-item.is-active b { background:#cfe7ff; color:var(--apple-blue-deep); }
.top-actions { display:flex; align-items:center; gap:9px; }.search { display:flex; align-items:center; gap:7px; inline-size:205px; min-block-size:38px; padding:0 11px; border:1px solid #dedee3; border-radius:11px; background:#f5f5f7; color:#86868b; }.search span { font-size:18px; }.search input { min-inline-size:0; border:0; outline:0; background:transparent; color:var(--apple-black); font-size:13px; }.search input::placeholder { color:#929297; }.notification { position:relative; display:grid; place-items:center; inline-size:38px; block-size:38px; border:1px solid #dedee3; border-radius:11px; background:#fff; color:#3a3a3e; cursor:pointer; }.notification i { position:absolute; top:-5px; right:-5px; display:grid; place-items:center; min-inline-size:17px; block-size:17px; border:2px solid #fff; border-radius:99px; background:#ff453a; color:#fff; font-size:10px; font-style:normal; font-weight:750; }
.button { min-height:38px; border-radius:10px; font-size:13px; font-weight:720; box-shadow:none; }.button-primary { border:1px solid var(--apple-blue); background:var(--apple-blue); color:#fff; }.button-primary:hover { border-color:var(--apple-blue-deep); background:var(--apple-blue-deep); }.button-quiet { border:1px solid var(--apple-line); background:#fff; color:var(--apple-ink); }.store-identity { min-block-size:38px; padding:0 10px; border:1px solid #dedee3; border-radius:10px; background:#fff; color:#545458; font-size:12px; font-weight:670; }.manager-access { min-block-size:38px; padding:0 11px; border:1px solid #c7dff8; border-radius:10px; background:var(--apple-blue-wash); color:var(--apple-blue-deep); font-size:13px; font-weight:720; }.manager-access.is-active { border-color:var(--apple-black); background:var(--apple-black); color:#fff; }

.main-stage { max-width:1600px; margin:0 auto; padding:42px 48px 70px; }.page-intro { display:flex; align-items:baseline; gap:9px; margin-bottom:22px; }.page-intro p { margin:0; color:var(--apple-muted); font-size:14px; }.page-intro p:first-child { color:var(--apple-black); font-size:28px; font-weight:740; letter-spacing:-.055em; }.page-intro span { color:#c7c7cc; }.page-intro #view-hint { margin-left:2px; }
.overview-strip { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin:0 0 18px; }.summary-card { padding:20px; border:1px solid #e2e2e7; border-radius:18px; background:#fff; box-shadow:0 2px 8px rgba(0,0,0,.025); }.summary-card small { color:var(--apple-muted); font-size:13px; font-weight:650; }.summary-card strong { display:block; margin-top:8px; color:var(--apple-black); font-size:32px; letter-spacing:-.06em; }
.table-card { overflow:hidden; border:1px solid #dedee3; border-radius:20px; background:#fff; box-shadow:var(--apple-shadow); }.table-scroll { overflow:auto; }.case-table { min-width:1320px; border-collapse:separate; border-spacing:0; }.case-table th { height:48px; padding:0 20px; border-bottom:1px solid #e6e6eb; background:#fbfbfc; color:#6e6e73; font-size:12px; font-weight:720; letter-spacing:0; text-align:left; }.case-table td { min-height:74px; padding:16px 20px; border-bottom:1px solid #eeeeF2; color:#323236; font-size:14px; vertical-align:middle; }.case-table tbody tr:last-child td { border-bottom:0; }.case-row { cursor:pointer; transition:background .16s ease; }.case-row:hover { background:#f5f9ff; }.case-number { color:var(--apple-blue-deep); font-weight:700; }.product-title { color:var(--apple-black); font-size:15px; font-weight:720; }.product-sub { color:#86868b; font-size:12px; }.sku,.date-copy { color:#323236; font-size:14px; }.reason { border-radius:99px; background:#eef5ff; color:var(--apple-blue-deep); font-size:12px; font-weight:750; }.reason.stock { background:#ecf8f3; color:#167c54; }.case-type-badge { border-radius:99px; font-size:12px; font-weight:750; }.case-type-badge.case-type-mint { background:#ecf8f3; color:#167c54; }.case-type-badge.case-type-violet { background:#f1edff; color:#6c4fd1; }.case-type-badge.case-type-amber { background:#fff4dd; color:#a66d12; }.plain-status { color:#6e6e73; font-weight:600; }.plain-status.is-done,.check.is-done { color:#12805c; }.empty-state { padding:70px 20px; color:var(--apple-muted); }.empty-state strong { color:var(--apple-black); }

.modal { width:min(780px,calc(100vw - 48px)) !important; max-width:780px !important; max-height:calc(100vh - 48px); margin:auto; padding:0 !important; border:1px solid rgba(0,0,0,.14); border-radius:22px; background:#fff; color:var(--apple-black); box-shadow:0 24px 70px rgba(0,0,0,.24); overflow:auto; }.modal::backdrop { background:rgba(0,0,0,.44); backdrop-filter:blur(4px); }.modal > form { display:block !important; width:auto !important; min-width:0 !important; margin:0 !important; padding:28px 30px 24px !important; background:#fff; }.modal-head { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; padding:0 0 22px; border-bottom:1px solid #e5e5ea; }.modal-head h2 { margin:3px 0 0; color:var(--apple-black); font-size:24px; font-weight:750; letter-spacing:-.055em; }.eyebrow { color:var(--apple-blue-deep); font-size:11px; font-weight:760; letter-spacing:.075em; text-transform:uppercase; }.icon-button { display:grid; place-items:center; inline-size:32px; block-size:32px; padding:0; border:0; border-radius:99px; background:#f2f2f7; color:#525257; font-size:21px; cursor:pointer; }.icon-button:hover { background:#e5e5ea; }
.form-grid { display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:16px !important; margin-top:22px; }.form-grid label { display:grid !important; gap:7px !important; min-width:0; color:#515157; font-size:13px; font-weight:680; }.form-grid label input,.form-grid label select,.login-fields input { width:100% !important; min-width:0 !important; height:43px !important; padding:0 12px !important; border:1px solid #d2d2d7 !important; border-radius:10px !important; outline:0; background:#fff !important; color:var(--apple-black) !important; box-shadow:none !important; font-size:14px !important; }.form-grid label input:focus,.form-grid label select:focus,.login-fields input:focus { border-color:var(--apple-blue) !important; box-shadow:0 0 0 3px rgba(0,113,227,.16) !important; }.case-type-picker { display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:10px !important; width:100%; margin:0; padding:0; border:0; }.case-type-picker legend { grid-column:1/-1; margin:0 0 2px; color:#515157; font-size:13px; font-weight:680; }.type-choice { min-height:86px !important; padding:14px !important; border:1px solid #d9d9df !important; border-radius:14px !important; background:#fff !important; }.type-choice:hover { border-color:#8ac5ff !important; background:#f7fbff !important; transform:none !important; }.type-choice-icon { flex:0 0 34px; inline-size:34px; block-size:34px; border-radius:10px; background:#eef6ff; color:var(--apple-blue-deep); }.type-choice strong { color:var(--apple-black); font-size:14px; }.type-choice small { color:#86868b; font-size:12px; }.type-choice-input:checked + .type-choice { border-color:var(--apple-blue) !important; background:var(--apple-blue-wash) !important; box-shadow:0 0 0 3px rgba(0,113,227,.12) !important; }.type-choice-input:checked + .type-choice .type-choice-icon { background:var(--apple-blue); color:#fff; }.items-editor { margin-top:25px; padding-top:22px; border-top:1px solid #e5e5ea; }.items-heading p { color:#86868b; }.text-action { color:var(--apple-blue-deep); font-weight:720; }.item-row { display:grid !important; grid-template-columns:150px minmax(0,1fr) 80px 34px !important; gap:9px; }.item-row input { min-width:0 !important; height:42px !important; border:1px solid #d2d2d7 !important; border-radius:10px !important; padding:0 11px !important; }.remove-item { border:0 !important; border-radius:10px !important; background:#fff1f0 !important; color:#c43d35 !important; }.modal-footer { display:flex !important; justify-content:flex-end; gap:9px; margin-top:26px; padding-top:18px; border-top:1px solid #e5e5ea; }.modal-footer .button { min-width:96px; }

.login-modal { width:min(460px,calc(100vw - 48px)) !important; max-width:460px !important; }.login-modal > form { padding:30px !important; }.login-copy { margin:20px 0; color:#6e6e73; font-size:14px; line-height:1.55; }.login-fields { display:grid !important; grid-template-columns:1fr !important; gap:15px; }.login-fields label { display:grid !important; width:100%; gap:7px; color:#515157; font-size:13px; font-weight:680; }.login-hint { margin:17px 0 0; padding:10px 12px; border:1px solid #cfe7ff; border-radius:10px; background:#f5faff; color:#0568c8; font-size:12px; font-weight:600; }.login-modal .modal-footer { margin-top:23px; }

.settings-panel { max-width:none; }.settings-card { padding:28px 30px; border:1px solid #dedee3; border-radius:20px; background:#fff; box-shadow:0 4px 16px rgba(0,0,0,.035); }.settings-intro { background:linear-gradient(120deg,#fff 20%,#edf6ff 100%); }.settings-intro h2 { font-size:28px; letter-spacing:-.055em; }.settings-intro p { max-width:650px; color:#6e6e73; }.settings-icon { background:var(--apple-black); border-radius:15px; }.settings-card h3 { font-size:19px; letter-spacing:-.035em; }.store-form { grid-template-columns:.6fr .7fr 1fr 1fr 1.25fr auto; }.store-form label { color:#515157; }.store-form input { min-width:0; height:43px; border-color:#d2d2d7; border-radius:10px; }.import-card { border-color:#cfe7ff; background:#f8fbff; }.file-picker { border-color:#b8dbff; background:#fff; color:var(--apple-blue-deep); }.settings-table { min-width:1100px; }.settings-table th { background:#fbfbfc; color:#6e6e73; }.settings-table td { color:#3a3a3e; }.store-url { color:var(--apple-blue-deep); }.copy-store-url { padding:4px 7px; background:#eef6ff; color:var(--apple-blue-deep); }.store-actions button { background:#eef6ff; color:var(--apple-blue-deep); }.store-actions .delete-store { background:#fff1f0; color:#c43d35; }
.employee-editor { border-color:#cfe7ff; background:linear-gradient(130deg,#fff 25%,#f5faff 100%); }.employee-editor p { margin:5px 0 0; color:#6e6e73; font-size:13px; }.employee-store-badge { display:inline-flex; align-items:center; min-height:32px; padding:0 11px; border:1px solid #b8dbff; border-radius:99px; background:#fff; color:var(--apple-blue-deep); font-size:12px; font-weight:720; }.employee-form { display:grid; grid-template-columns:1fr 1fr auto; align-items:end; gap:13px; margin-top:20px; }.employee-form label { display:grid; gap:7px; color:#515157; font-size:13px; font-weight:680; }.employee-form input { min-width:0; height:43px; padding:0 12px; border:1px solid #d2d2d7; border-radius:10px; background:#fff; color:var(--apple-black); }.employee-form input:focus { outline:0; border-color:var(--apple-blue); box-shadow:0 0 0 3px rgba(0,113,227,.16); }.employee-form-actions { display:flex; gap:8px; }.employee-form-actions .button { white-space:nowrap; }.employee-table { min-width:420px; }.employee-directory { margin-top:16px; }.employee-empty { padding:25px 0; color:#6e6e73; text-align:center; }
.drawer { width:min(680px,calc(100vw - 36px)); max-height:100vh; margin:0 0 0 auto; padding:0; border:0; background:#fff; box-shadow:-18px 0 50px rgba(0,0,0,.16); }.drawer::backdrop { background:rgba(0,0,0,.22); }.detail-shell { padding:34px; }.detail-top { border-bottom:1px solid #e5e5ea; }.detail-title { letter-spacing:-.055em; }.detail-section { border-bottom:1px solid #e5e5ea; }.status-control select,.detail-note textarea { border:1px solid #d2d2d7; border-radius:10px; }.notice { right:28px; bottom:28px; border:0; border-radius:12px; background:var(--apple-black); color:#fff; box-shadow:0 12px 30px rgba(0,0,0,.2); }
@media (max-width:1250px) { .app-topbar { grid-template-columns:188px minmax(445px,1fr) auto; gap:12px; padding-inline:20px; }.nav-item { padding-inline:7px; }.nav-item span { display:none; }.search { inline-size:170px; }.main-stage { padding-inline:28px; }.store-identity { display:none; } }

/* 外放式分段按鈕（取代固定選項下拉） */
.form-grid .seg-field { display:grid !important; gap:7px !important; min-width:0; }
.form-grid .seg-field[hidden] { display:none !important; }
.seg-label { color:#515157; font-size:13px; font-weight:680; }
.segmented { display:flex; flex-wrap:wrap; gap:6px; }
.seg-input { position:absolute !important; inline-size:1px !important; block-size:1px !important; padding:0 !important; margin:0; border:0 !important; clip-path:inset(50%); overflow:hidden; white-space:nowrap; }
.form-grid .seg-option { display:inline-flex !important; align-items:center; justify-content:center; flex:1 1 auto; min-height:43px; height:auto !important; padding:0 15px !important; border:1px solid #d2d2d7 !important; border-radius:10px !important; background:#fff !important; color:var(--apple-black) !important; font-size:14px !important; font-weight:600; white-space:nowrap; cursor:pointer; transition:border-color 160ms ease, background 160ms ease, box-shadow 160ms ease; }
.form-grid .seg-option:hover { border-color:#8ac5ff !important; background:#f7fbff !important; }
.seg-input:checked + .seg-option { border-color:var(--apple-blue) !important; background:var(--apple-blue-wash) !important; color:var(--apple-blue-deep) !important; box-shadow:0 0 0 3px rgba(0,113,227,.12) !important; font-weight:720; }
.seg-input:focus-visible + .seg-option { outline:3px solid rgba(0,113,227,.3); outline-offset:2px; }