:root{color:#172033;background:#eef5fb;font-family:Inter,Noto Sans TC,Microsoft JhengHei,Arial,sans-serif;--blue: #0877e8;--cyan: #14aaf5;--orange: #ff8a00;--ink: #172033;--muted: #64748b;--line: #d9e6f2;--card: rgba(255, 255, 255, .94);--shadow: 0 22px 60px rgba(29, 63, 104, .12)}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer}.app-shell{min-height:100vh;display:grid;grid-template-columns:328px 1fr;background:radial-gradient(circle at top left,rgba(20,170,245,.22),transparent 36%),radial-gradient(circle at top right,rgba(255,138,0,.12),transparent 28%),#eef5fb}.sidebar{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;gap:22px;padding:28px;background:#102541;color:#fff;overflow-y:auto;overflow-x:hidden}.brand-mark{display:flex;align-items:center;gap:14px}.brand-mark>span{width:48px;height:48px;display:grid;place-items:center;border-radius:16px;background:linear-gradient(135deg,var(--cyan),var(--blue));font-weight:900}.brand-mark strong,.brand-mark small{display:block}.brand-mark small,.side-note span{color:#ffffffad}.system-switch{min-height:44px;display:flex;align-items:center;justify-content:center;gap:9px;border:1px solid rgba(255,255,255,.16);border-radius:12px;background:linear-gradient(135deg,#14aaf533,#ff8a0029);color:#fff;font-weight:900}.menu-block{display:grid;gap:16px}.menu-block h2{margin:0;color:#ffffffc7;font-size:13px;letter-spacing:0}.menu-group{display:grid;gap:8px}.menu-group h3{margin:0;color:#ffffff85;font-size:12px;font-weight:800}.sidebar nav{display:grid;gap:6px}.sidebar nav button{min-height:40px;display:flex;align-items:center;gap:9px;border:1px solid rgba(255,255,255,.1);border-radius:10px;background:transparent;color:#fff;padding:0 10px;text-align:left}.sidebar nav button span{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sidebar nav button em{flex:0 0 auto;border-radius:999px;background:#ff8a002e;color:#ffd08f;padding:2px 6px;font-size:11px;font-style:normal;font-weight:900}.sidebar nav button.active{background:#14aaf52e;border-color:#14aaf57a}.side-note{display:grid;gap:8px;border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:16px}.workspace{padding:32px}.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.topbar p{margin:0 0 4px;color:var(--blue);font-weight:800;text-transform:uppercase}.topbar h1{margin:0;font-size:34px}.topbar span{display:block;margin-top:6px;color:var(--muted)}.ghost-button{min-height:42px;display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--ink);padding:0 14px}.notice{margin-bottom:18px;border:1px solid #bfe7d0;border-radius:12px;background:#edfff4;color:#17663a;padding:12px 14px}.page-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.full-span,.profile-card{grid-column:1 / -1}.profile-card,.panel{border:1px solid rgba(217,230,242,.9);border-radius:18px;background:var(--card);box-shadow:var(--shadow)}.placeholder-page{min-height:520px;display:grid;place-items:center;align-content:center;gap:12px;border:1px solid rgba(217,230,242,.9);border-radius:18px;background:var(--card);box-shadow:var(--shadow);padding:44px;text-align:center}.placeholder-page .placeholder-icon{width:68px;height:68px;display:grid;place-items:center;border-radius:20px;background:linear-gradient(135deg,#14aaf529,#ff8a0029);color:var(--blue)}.placeholder-page p,.placeholder-page h2,.placeholder-page span,.placeholder-page strong{margin:0}.placeholder-page p{color:var(--blue);font-weight:900}.placeholder-page h2{font-size:32px}.placeholder-page span{color:var(--muted)}.placeholder-page strong{max-width:560px;border-radius:999px;background:#fff7e8;color:#9a5800;padding:10px 16px}.warehouse-list{display:grid;gap:20px}.warehouse-code-note{display:flex;justify-content:space-between;gap:16px;border:1px solid rgba(8,119,232,.18);border-radius:14px;background:#eef7ff;padding:14px 16px}.warehouse-code-note strong{color:var(--blue)}.warehouse-code-note span{color:var(--muted)}.warehouse-card{border:1px solid rgba(217,230,242,.9);border-radius:18px;background:var(--card);box-shadow:var(--shadow);padding:22px}.warehouse-card-header{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;border-bottom:1px solid var(--line);padding-bottom:16px}.warehouse-card-header .panel-title{margin-bottom:0}.warehouse-card-header>span{max-width:520px;color:var(--muted);text-align:right}.warehouse-table{margin:18px 0 0;border:1px solid #dceaf4;border-bottom:0}.warehouse-table div{display:grid;grid-template-columns:150px minmax(0,1fr);min-height:58px;border-bottom:1px solid #dceaf4}.warehouse-table dt,.warehouse-table dd{display:flex;align-items:center;margin:0;padding:12px 16px}.warehouse-table dt{background:#c8eef5;color:#37566b;font-weight:900}.warehouse-table dd{color:var(--ink)}.warehouse-actions{display:flex;justify-content:center;padding-top:22px}.warehouse-actions button{min-height:44px;border:0;border-radius:999px;background:linear-gradient(135deg,var(--cyan),var(--blue));color:#fff;padding:0 24px;font-weight:900}.balance-hero{display:flex;align-items:center;justify-content:space-between;border-radius:20px;background:linear-gradient(135deg,#103962,#0a87e8);box-shadow:var(--shadow);color:#fff;padding:26px}.balance-hero span,.balance-hero small{display:block;color:#ffffffb8}.balance-hero strong{display:block;margin:8px 0;font-size:34px}.topup-form{margin-top:16px}.amount-picker{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.amount-picker button{min-height:48px;border:1px solid var(--line);border-radius:14px;background:#fff;color:var(--ink);font-weight:900}.amount-picker button.active{border-color:#0877e87a;background:#eef7ff;color:var(--blue);box-shadow:inset 0 0 0 1px #0877e829}.payment-method-picker{display:grid;gap:12px}.payment-method-picker button{min-height:54px;display:flex;align-items:center;gap:16px;border:1px dashed #cfddea;border-radius:999px;background:#fff;color:#30445f;padding:0 18px;text-align:left;font-weight:800}.payment-method-picker button.active{border-color:var(--cyan);background:#eefbff;color:var(--blue);box-shadow:0 10px 26px #14aaf529}.payment-method-picker b{width:32px;height:32px;display:grid;place-items:center;border-radius:9px;background:linear-gradient(135deg,var(--blue),var(--cyan));color:#fff;font-size:14px}.payment-method-picker button:nth-child(3) b{background:linear-gradient(135deg,#16b83e,#09d05a)}.payment-account-list{display:grid;gap:10px}.payment-account-list article{display:grid;gap:4px;border:1px solid var(--line);border-radius:14px;background:#f8fbff;padding:12px}.payment-account-list strong,.payment-account-list span{display:block}.payment-account-list span{color:var(--muted);font-size:13px}.ticket-grid{display:grid;grid-template-columns:minmax(360px,.85fr) minmax(0,1fr);gap:20px}.ticket-list{display:grid;gap:10px}.ticket-list button{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--ink);padding:12px;text-align:left}.ticket-list button.active{border-color:#0877e87a;background:#f0f7ff}.ticket-list strong,.ticket-list span,.ticket-list small{display:block}.ticket-list strong{font-size:13px}.ticket-list span{color:var(--blue);font-size:13px;font-weight:800}.ticket-list small{grid-column:1 / -1;color:var(--muted);font-size:12px}.ticket-list mark{align-self:start;grid-row:1 / span 2;grid-column:2}.ticket-list em{justify-self:end;grid-column:2;color:var(--blue);font-size:12px;font-style:normal;font-weight:900}.ticket-detail{min-height:360px}.ticket-detail.empty-state,.empty-state{display:grid;place-items:center;min-height:180px;color:var(--muted)}.ticket-meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px;border-bottom:1px solid var(--line);padding-bottom:14px}.ticket-meta>span{color:var(--muted)}.message-thread{display:grid;gap:12px;padding:16px 0}.message-thread article{max-width:82%;border-radius:14px;background:#eef7ff;padding:12px 14px}.message-thread article.staff{justify-self:end;background:#fff7e8}.message-thread strong,.message-thread p,.message-thread small{display:block;margin:0}.message-thread p{margin-top:6px;white-space:pre-wrap}.message-thread small{margin-top:8px;color:var(--muted);font-size:12px}.ticket-reply-form{display:grid;gap:10px;border-top:1px solid var(--line);padding-top:14px}.ticket-reply-form textarea{min-height:98px;border:1px solid var(--line);border-radius:12px;background:#f8fbff;padding:12px;resize:vertical}.ticket-reply-form button{justify-self:start;min-height:40px;border:0;border-radius:12px;background:linear-gradient(135deg,var(--orange),#ffb000);color:#fff;padding:0 18px;font-weight:900}.modal-backdrop{position:fixed;inset:0;z-index:20;display:grid;place-items:center;background:#0f233f75;padding:24px}.ticket-modal{position:relative;width:min(920px,100%);max-height:calc(100vh - 48px);overflow:auto}.ticket-modal .panel{box-shadow:0 28px 80px #081c383d}.ticket-modal .panel+.panel{margin-top:14px}.ticket-status-panel{min-height:auto}.detail-list{display:grid;gap:0;margin:0;border:1px solid var(--line);border-bottom:0}.detail-list div{display:grid;grid-template-columns:138px minmax(0,1fr);border-bottom:1px solid var(--line)}.detail-list dt,.detail-list dd{margin:0;padding:12px 14px}.detail-list dt{background:#eef7ff;color:#31506c;font-weight:900}.detail-list dd{min-width:0}.detail-list a{color:var(--blue);overflow-wrap:anywhere}.detail-actions{display:flex;justify-content:flex-end;padding-top:16px}.detail-actions a{display:inline-flex;min-height:40px;align-items:center;border-radius:999px;background:linear-gradient(135deg,var(--blue),var(--cyan));color:#fff;padding:0 18px;font-weight:900;text-decoration:none}.modal-close{position:absolute;top:14px;right:14px;z-index:1;min-height:34px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ink);padding:0 12px;font-weight:900}.profile-card{display:flex;justify-content:space-between;gap:18px;padding:24px;background:linear-gradient(135deg,#123a68,#0d87eb);color:#fff}.profile-card span{color:#ffffffb3}.profile-card h2{margin:8px 0}.profile-card p{margin:0;color:#ffffffc7}.profile-card strong{display:block;margin-top:8px;font-size:26px}.panel{padding:22px}.panel-title{display:flex;align-items:center;gap:10px;margin-bottom:18px}.panel-heading-row{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px}.panel-heading-row .panel-title{margin-bottom:0}.panel-heading-row>span{color:var(--muted);font-size:14px}.panel-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px}.panel-actions span{color:var(--muted);font-size:14px}.panel-actions button{min-height:38px;border:0;border-radius:999px;background:linear-gradient(135deg,var(--blue),var(--cyan));color:#fff;padding:0 16px;font-weight:900}.status-filter-bar{display:flex;gap:8px;margin:0 0 16px;overflow-x:auto;padding-bottom:2px}.status-filter-bar button{min-height:36px;display:inline-flex;flex:0 0 auto;align-items:center;gap:7px;border:1px solid var(--line);border-radius:999px;background:#fff;color:#30445f;padding:0 12px;font-weight:800}.status-filter-bar button.active{border-color:#0877e873;background:#eef7ff;color:var(--blue)}.status-filter-bar em{min-width:22px;min-height:22px;display:grid;place-items:center;border-radius:999px;background:#edf3f8;color:var(--muted);font-size:12px;font-style:normal}.status-filter-bar button.active em{background:var(--blue);color:#fff}.panel-title svg{color:var(--blue)}.panel-title h2{margin:0;font-size:22px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.form-grid label{display:grid;gap:7px;color:#30445f;font-weight:700}.form-grid .full{grid-column:1 / -1}.form-grid input,.form-grid select,.form-grid textarea{width:100%;min-height:44px;border:1px solid var(--line);border-radius:12px;background:#f8fbff;color:var(--ink);padding:10px 12px;outline:0}.form-grid textarea{min-height:92px;resize:vertical}.form-grid button,.row-actions button{min-height:42px;border:0;border-radius:12px;background:linear-gradient(135deg,var(--orange),#ffb000);color:#fff;padding:0 16px;font-weight:900}.form-grid button{justify-self:start}.compact-form{margin-bottom:20px;border:1px solid #e4edf6;border-radius:16px;background:#fbfdff;padding:16px}.inline-claim{display:flex;flex-wrap:wrap;gap:8px}.inline-claim input{width:130px;min-height:34px;border:1px solid var(--line);border-radius:10px;background:#fff;padding:6px 10px}.procurement-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 42px;width:100%}.procurement-form label,.readonly-amount,.image-upload-field{min-width:0;display:grid;grid-template-columns:116px minmax(0,1fr);align-items:start;gap:12px 16px}.procurement-form .full{grid-column:1 / -1}.procurement-form label>span,.readonly-amount>span,.image-upload-field>span{padding-top:12px;color:#071527;font-weight:900}.procurement-form .required>span:before{content:"* ";color:#f04444}.procurement-form input,.procurement-form select,.procurement-form textarea{width:100%;min-height:46px;border:0;border-radius:999px;background:#e7f1fb;color:var(--ink);padding:11px 18px;outline:0}.product-link-control{display:grid;grid-template-columns:minmax(0,1fr) 92px;gap:10px}.product-link-control button{min-height:46px;border:0;border-radius:999px;background:linear-gradient(135deg,var(--blue),var(--cyan));color:#fff;font-weight:900}.procurement-form textarea{min-height:96px;border-radius:18px;resize:vertical}.procurement-form small{grid-column:2;color:#ff4d55;font-size:13px}.form-hint,.form-warning{margin:0;padding-left:132px;color:#ff4d55;font-weight:900}.readonly-amount strong{min-height:46px;display:flex;align-items:center;color:#475569}.image-upload-field{grid-template-rows:auto auto}.upload-box{width:168px;height:168px;display:grid;place-items:center;border:1px dashed #c9d3df;border-radius:12px;background:#fff;cursor:pointer}.upload-box input{display:none}.upload-box b{color:#7f8fa3;font-size:42px;font-weight:300}.image-upload-field small{grid-column:2;color:var(--muted)}.image-upload-field small b{color:#ff4d55}.procurement-form>button{justify-self:start;min-height:46px;border:0;border-radius:12px;background:linear-gradient(135deg,var(--orange),#ffb000);color:#fff;padding:0 22px;font-weight:900}button:disabled{opacity:.56;cursor:wait}.stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.stat-card{min-height:110px;display:grid;align-content:center;gap:8px;border-radius:16px;background:#fff;box-shadow:var(--shadow);padding:20px;border-left:5px solid var(--blue)}.stat-card.orange{border-left-color:var(--orange)}.stat-card.green{border-left-color:#16a36a}.stat-card.dark{border-left-color:#102541}.stat-card span{color:var(--muted)}.stat-card strong{font-size:30px}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse;min-width:980px;font-size:14px}th,td{border-bottom:1px solid #e6edf5;padding:10px 12px;text-align:left;vertical-align:top}th{color:var(--muted);font-size:12px;font-weight:800}td strong,td span,td small{display:block}td small{margin-top:3px;color:var(--muted);font-size:12px;line-height:1.35}td strong,td span{line-height:1.35}.amount-credit{color:#14865a;font-weight:900}.amount-debit{color:#d86b00;font-weight:900}mark{display:inline-grid;min-width:62px;place-items:center;border-radius:999px;background:#e8f3ff;color:#075cba;padding:4px 8px;font-size:13px;font-weight:800}.row-actions{display:flex;flex-wrap:wrap;gap:8px}.row-actions button{display:inline-flex;align-items:center;gap:6px}.row-actions button.secondary{background:#e6edf5;color:#334155}.row-actions button.danger{background:#ffe8e6;color:#b42318}.row-actions button{min-height:34px;border-radius:10px;padding:0 12px;font-size:13px}.address-table table{min-width:900px}.address-table td{font-size:13px}.checkbox-field{display:flex!important;grid-template-columns:none!important;align-items:center;gap:10px}.checkbox-field input{width:18px;min-height:18px}.checkbox-field span{font-weight:800}.permission-editor{display:grid;gap:12px}.permission-editor>strong{color:var(--ink);font-size:16px}.permission-editor fieldset{border:1px solid var(--line);border-radius:14px;background:#f8fbff;padding:12px}.permission-editor legend{padding:0 6px;color:#30445f;font-weight:900}.permission-editor fieldset>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 12px}.admin-staff-table table,.admin-role-table table{min-width:900px}.pagination{display:flex;align-items:center;justify-content:flex-end;gap:10px;padding-top:18px}.pagination button{min-height:38px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink);padding:0 14px;font-weight:800}.pagination span{color:var(--muted)}@media(max-width:980px){.app-shell{grid-template-columns:1fr}.sidebar{position:static;height:auto;max-height:72vh}.page-grid,.form-grid,.stat-grid,.procurement-form,.procurement-form label,.readonly-amount,.image-upload-field{grid-template-columns:1fr}.procurement-form small,.image-upload-field small{grid-column:1}.form-hint,.form-warning{padding-left:0}.product-link-control{grid-template-columns:1fr}.warehouse-card-header,.warehouse-code-note{display:grid}.warehouse-card-header>span{text-align:left}.warehouse-table div{grid-template-columns:112px minmax(0,1fr)}.ticket-grid{grid-template-columns:1fr}.message-thread article{max-width:100%}}