/* GOSU 支援服務｜共用外框與樣式（v2，參考 Apple 支援服務的視覺：白底、留白、置中大標、淡灰區塊、圓角卡片、藍色連結與膠囊按鈕）
 * 用在 /lw-support（首頁、我的回報、登入）與回報表單 /helpdesk/lw-report-6 */
:root{
  --g-ink:#1d1d1f;--g-ink2:#6e6e73;--g-line:#d2d2d7;--g-line2:#e8e8ed;--g-bg2:#f5f5f7;
  --g-link:#0066cc;--g-btn:#0071e3;--g-btnh:#0077ed;--g-max:1024px;--g-wide:1200px;
  --g-font:-apple-system,BlinkMacSystemFont,"SF Pro TC","SF Pro Text","PingFang TC","Helvetica Neue","Noto Sans TC","Microsoft JhengHei",Arial,sans-serif;
  --lw-navy:#1d1d1f;--lw-max:1200px
}

/* 換頁時頁首固定不動，只有內容淡入 */
@view-transition{navigation:auto}
.lwc-top{view-transition-name:lwc-top}
::view-transition-old(root){animation:.18s ease-in both lwc-out}
::view-transition-new(root){animation:.34s cubic-bezier(.2,.8,.2,1) .05s both lwc-in}
@keyframes lwc-out{to{opacity:0}}
@keyframes lwc-in{from{opacity:0;transform:translateY(8px)}}
/* 不支援換頁轉場的瀏覽器（Firefox、舊版 Safari）：內容區自己淡入 */
html.lwc-fade #lw-app,html.lwc-fade #wrap > .row,html.lwc-fade #wrap > .lwc-note{animation:lwc-in .34s cubic-bezier(.2,.8,.2,1) both}
@media(prefers-reduced-motion:reduce){::view-transition-old(root),::view-transition-new(root){animation:none}html.lwc-fade #lw-app,html.lwc-fade #wrap > .row,html.lwc-fade #wrap > .lwc-note{animation:none}}

/* 官網原本的頁首、頁尾、浮動按鈕，以及回報表單自己的橫幅、捲動頁首、頁尾，在這兩頁都不顯示 */
header#top,footer#bottom,.floating-button,#top_menu_collapse_mobile,
header.lw-hero,.lw-ssr-hero,.lw-main .lw-note,.lw-bar,.lw-footer{display:none !important}
#wrapwrap main{padding-top:0 !important}
html,body{background:#fff !important}
body,#wrap,#wrap button,#wrap input,#wrap select,#wrap textarea{font-family:var(--g-font) !important}
#wrap{color:var(--g-ink);-webkit-font-smoothing:antialiased}
#wrap a{color:var(--g-link)}

/* 頁首：半透明白底、細分隔線，左邊名稱、右邊功能 */
.lwc-top{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.86);-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px);border-bottom:1px solid var(--g-line2);width:100vw;margin-left:calc(50% - 50vw)}
.lwc-top-in{max-width:var(--g-wide);margin:0 auto;padding:0 22px;height:52px;display:flex;align-items:center;gap:24px}
.lwc-brand{font-size:21px;font-weight:600;letter-spacing:.01em;color:var(--g-ink) !important;text-decoration:none !important;white-space:nowrap}
.lwc-nav{display:flex;gap:20px;align-items:center;height:100%}
.lwc-tab{font-size:15px;color:var(--g-ink) !important;opacity:.72;text-decoration:none !important;white-space:nowrap;display:inline-flex;align-items:center;gap:6px;height:100%;border-bottom:2px solid transparent;border-top:2px solid transparent}
.lwc-tab:hover{opacity:1}
.lwc-tab.on{opacity:1;font-weight:600;border-bottom-color:var(--g-ink)}
.lwc-tab .n{display:inline-block;min-width:18px;padding:0 6px;border-radius:999px;background:var(--g-btn);color:#fff;font-size:11px;line-height:18px;text-align:center;font-weight:600}
.lwc-tab .n:empty{display:none}
.lwc-user{margin-left:auto;font-size:12px;color:var(--g-ink2);white-space:nowrap;display:flex;align-items:center;gap:10px}
.lwc-user b{color:var(--g-ink);font-weight:500}
.lwc-user button,.lwc-user a{background:none;border:0;padding:0;color:var(--g-link) !important;cursor:pointer;font-size:12px;text-decoration:none !important}
.lwc-user button:hover,.lwc-user a:hover{text-decoration:underline !important}
@media(max-width:734px){.lwc-top-in{gap:12px;padding:0 14px;height:48px}.lwc-brand{font-size:16px}.lwc-nav{gap:12px}.lwc-tab{font-size:13px}.lwc-user .lwc-em,.lwc-user .lwc-exp{display:none}}

/* 頁首下方的提醒文字（回報表單用） */
.lwc-note{max-width:var(--g-wide);margin:14px auto 6px;padding:0 22px;font-size:12px;color:var(--g-ink2);line-height:1.6}
.lwc-note b{color:var(--g-ink);font-weight:600}
.lwc-note .lwc-chip{display:inline-block;margin-right:8px;padding:1px 9px;border-radius:999px;background:#fff4e5;color:#b45309;font-weight:600}

/* 首頁：置中大標、兩張大卡片、淡灰「其他協助」 */
.lwc-hero{text-align:center;padding:64px 22px 40px}
.lwc-hero h1{font-size:48px;line-height:1.08;font-weight:600;letter-spacing:-.003em;margin:0;color:var(--g-ink)}
.lwc-hero p{font-size:21px;line-height:1.38;color:var(--g-ink2);margin:14px 0 0}
.lwc-cards{max-width:var(--g-max);margin:0 auto;padding:0 22px;display:grid;grid-template-columns:1fr 1fr;gap:20px}
.lwc-card{display:flex;flex-direction:column;background:var(--g-bg2);border-radius:18px;padding:34px 32px 30px;text-decoration:none !important;color:var(--g-ink) !important;transition:transform .2s ease,box-shadow .2s ease;min-height:220px}
.lwc-card:hover{transform:scale(1.012);box-shadow:0 4px 18px rgba(0,0,0,.08)}
.lwc-card .ic{width:44px;height:44px;border-radius:12px;background:#fff;display:flex;align-items:center;justify-content:center;margin-bottom:18px}
.lwc-card .ic svg{width:24px;height:24px;stroke:var(--g-btn);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.lwc-card h2{font-size:28px;font-weight:600;margin:0 0 8px;letter-spacing:.004em;color:var(--g-ink)}
.lwc-card p{font-size:17px;line-height:1.47;color:var(--g-ink2);margin:0}
.lwc-card .go{margin-top:auto;padding-top:20px;color:var(--g-link);font-size:17px}
.lwc-card .go .n:not(:empty){display:inline-block;margin-left:6px;padding:0 8px;border-radius:999px;background:var(--g-btn);color:#fff;font-size:12px;line-height:20px}
.lwc-more{max-width:var(--g-max);margin:44px auto 0;padding:0 22px}
.lwc-more h3{font-size:24px;font-weight:600;margin:0 0 16px;color:var(--g-ink)}
.lwc-more .g{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.lwc-more .g > div{border-top:1px solid var(--g-line);padding-top:14px;font-size:14px;line-height:1.5;color:var(--g-ink2)}
.lwc-more .g b{display:block;color:var(--g-ink);font-size:15px;font-weight:600;margin-bottom:4px}
@media(max-width:734px){.lwc-hero{padding:40px 16px 28px}.lwc-hero h1{font-size:34px}.lwc-hero p{font-size:17px}.lwc-cards{grid-template-columns:1fr;padding:0 16px;gap:14px}.lwc-card{min-height:0;padding:26px 22px 22px}.lwc-card h2{font-size:24px}.lwc-more{padding:0 16px}.lwc-more .g{grid-template-columns:1fr}}
html.lw-route-app .lwc-home{display:none}

/* 頁尾：淡灰、小字 */
.lwc-foot{width:100vw;margin-left:calc(50% - 50vw);margin-top:64px;background:var(--g-bg2);font-size:12px;line-height:1.5;color:var(--g-ink2)}
.lwc-foot-in{max-width:var(--g-wide);margin:0 auto;padding:18px 22px 22px}
.lwc-foot-in p{margin:0 0 10px;padding-bottom:10px;border-bottom:1px solid var(--g-line)}
.lwc-foot-in .r{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.lwc-foot a{color:var(--g-ink2) !important;text-decoration:none !important}
.lwc-foot a:hover{text-decoration:underline !important}

/* 回報表單：跟支援服務同寬，字型、配色、圓角、按鈕統一 */
#wrap .row.mb16 > .col-md-8{flex:0 0 100% !important;max-width:var(--g-wide) !important;margin:0 auto;padding-left:22px !important;padding-right:22px !important}
#wrap.container{max-width:calc(var(--g-wide) + 44px) !important;margin-top:0 !important}
#wrap .lw-card{border-radius:18px !important;border:1px solid var(--g-line2) !important;box-shadow:none !important;background:#fff !important}
#wrap .lw-card-title{font-size:21px !important;font-weight:600 !important;color:var(--g-ink) !important}
#wrap .lw-card-hint{color:var(--g-ink2) !important}
#wrap .lw-card-n{background:var(--g-ink) !important;color:#fff !important}
#wrap .form-control,#wrap .form-select{border-radius:12px !important;border:1px solid var(--g-line) !important;min-height:44px;font-size:16px !important;color:var(--g-ink) !important;box-shadow:none !important}
#wrap textarea.form-control{min-height:110px}
#wrap .form-control:focus,#wrap .form-select:focus{border-color:var(--g-btn) !important;box-shadow:0 0 0 4px rgba(0,113,227,.16) !important}
#wrap .btn-primary{background:var(--g-btn) !important;border-color:var(--g-btn) !important;border-radius:980px !important;padding:10px 22px !important;font-weight:500}
#wrap .btn-primary:hover{background:var(--g-btnh) !important;border-color:var(--g-btnh) !important}
#wrap .btn-outline-primary{border-radius:980px !important;color:var(--g-btn) !important;border-color:var(--g-btn) !important}
#wrap .btn-outline-primary:hover{background:var(--g-btn) !important;color:#fff !important}
#wrap .lw-nav{border:0 !important;background:transparent !important}
#wrap .lw-pill{border-radius:10px !important;border:0 !important;background:transparent !important;color:var(--g-ink) !important}
#wrap .lw-pill:hover{background:var(--g-bg2) !important}
#wrap .lw-pill-done{color:#1d7f3d !important}
#wrap .lw-pill-n{background:var(--g-line2) !important;color:var(--g-ink) !important}
#wrap .lw-pill-done .lw-pill-n{background:#1d7f3d !important;color:#fff !important}
#wrap .lw-guide{border-radius:18px !important;border:0 !important;background:var(--g-bg2) !important;box-shadow:none !important}
#wrap .lw-g-head{color:var(--g-ink2) !important}
#wrap .lw-badge,#wrap .lw-req{border-radius:999px !important}
#wrap .lw-who{border-radius:14px !important;border-color:var(--g-line2) !important;background:var(--g-bg2) !important}

/* 頁尾固定在畫面最下方：內容不滿一頁時，頁尾也貼齊瀏覽器底部 */
#wrap{display:flex !important;flex-direction:column;min-height:100vh}
#wrap > .lwc-foot{margin-top:auto !important}
#wrap > #lw-app{flex:0 0 auto;width:100%;margin-bottom:64px}
#wrap > .row{flex:0 0 auto;margin-bottom:64px}

/* ===== 客服中心頁（/lw-support）：登入、我的回報、處理進度、往來紀錄 ===== */
#lw-app .lw-view{max-width:1200px;margin:0 auto;padding:0 22px}
@media(max-width:734px){#lw-app .lw-view{padding:0 16px}}
#lw-app .lw-hint{color:#6e6e73;font-size:14px;margin-top:8px;line-height:1.5}
#lw-app .lw-err{color:#e30000;font-size:14px;margin-top:10px;display:none}
#lw-app .lw-err.info{color:#6e6e73}
#lw-app .lw-ok{color:#1d7f3d;font-size:14px;margin-top:8px}
#lw-app .lw-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px;align-items:center}
#lw-app .lw-btn{display:inline-block;background:#0071e3;color:#fff !important;border:0;border-radius:980px;padding:11px 22px;font-size:17px;line-height:1.2;cursor:pointer;text-decoration:none !important}
#lw-app .lw-btn:hover{background:#0077ed}
#lw-app .lw-btn:disabled{opacity:.45;cursor:default}
#lw-app .lw-btn2{background:none;border:0;color:#0066cc;font-size:17px;cursor:pointer;padding:0}
#lw-app .lw-btn2:disabled{color:#86868b;cursor:default}
#lw-app .lw-link{background:none;border:0;padding:0;color:#0066cc;cursor:pointer;font-size:14px;text-decoration:none}
#lw-app .lw-link:hover{text-decoration:underline}
#lw-app .lw-in{width:100%;height:56px;border:1px solid #d2d2d7;border-radius:12px;padding:0 16px;font-size:17px;color:#1d1d1f;background:#fff;outline:none}
#lw-app .lw-in:focus{border-color:#0071e3;box-shadow:0 0 0 4px rgba(0,113,227,.16)}
#lw-app textarea.lw-in{height:auto;min-height:120px;padding:14px 16px;line-height:1.5;resize:vertical}
#lw-app .lw-auth{max-width:480px;margin:0 auto;padding:56px 22px 0;text-align:center}
#lw-app .lw-auth h1{font-size:40px;line-height:1.1;font-weight:600;margin:0 0 10px;color:#1d1d1f}
#lw-app .lw-auth .sub{font-size:17px;line-height:1.47;color:#6e6e73;margin:0 0 28px}
#lw-app .lw-auth form{text-align:left}
#lw-app .lw-code{text-align:center;font-size:28px;letter-spacing:12px}
@media(max-width:734px){#lw-app .lw-auth{padding-top:36px}#lw-app .lw-auth h1{font-size:30px}}
#lw-app .lw-view{padding-top:28px}
@media(max-width:734px){#lw-app .lw-view{padding-top:18px}}
#lw-app .lw-seg{display:inline-flex;flex-wrap:wrap;gap:2px;background:#e8e8ed;border-radius:10px;padding:2px;margin-bottom:16px}
#lw-app .lw-seg button{border:0;background:none;border-radius:8px;padding:6px 12px;font-size:13px;color:#1d1d1f;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
#lw-app .lw-seg button.on{background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.12);font-weight:600}
#lw-app .lw-seg i{width:7px;height:7px;border-radius:50%;display:inline-block}
#lw-app .lw-split{display:grid;grid-template-columns:360px minmax(0,1fr);gap:28px;align-items:start}
#lw-app .lw-side{position:sticky;top:68px}
@media(max-width:899px){#lw-app .lw-split{display:block}#lw-app .lw-split.detail .lw-side{display:none}#lw-app .lw-split:not(.detail) .lw-pane{display:none}#lw-app .lw-side{position:static}}
#lw-app .lw-list{border:1px solid #d2d2d7;border-radius:18px;overflow:hidden;background:#fff}
#lw-app .lw-li{display:grid;grid-template-columns:8px minmax(0,1fr) auto 10px;gap:3px 12px;align-items:center;width:100%;text-align:left;background:#fff;border:0;border-top:1px solid #e8e8ed;padding:14px 16px;cursor:pointer;color:#1d1d1f}
#lw-app .lw-li:first-child{border-top:0}
#lw-app .lw-li:hover{background:#fafafc}
#lw-app .lw-li.on{background:#f5f5f7}
#lw-app .lw-li .dot{width:8px;height:8px;border-radius:50%}
#lw-app .lw-li .tt{font-weight:600;font-size:15px;line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#lw-app .lw-li .st{font-size:12px;color:#6e6e73;white-space:nowrap}
#lw-app .lw-li .chev{color:#86868b;font-size:16px;grid-row:1 / 3;grid-column:4}
#lw-app .lw-li .sub{grid-column:2 / 4;font-size:12px;color:#6e6e73}
#lw-app .d-wait{background:#f56300}#lw-app .d-work{background:#0071e3}#lw-app .d-vendor{background:#8e44ad}#lw-app .d-done{background:#1d7f3d}
#lw-app .lw-empty{background:#f5f5f7;border-radius:18px;color:#6e6e73;font-size:15px;text-align:center;padding:44px 22px;line-height:1.5}
#lw-app .lw-empty b{color:#1d1d1f}
#lw-app .lw-d{border:1px solid #d2d2d7;border-radius:18px;padding:30px 32px;background:#fff}
@media(max-width:734px){#lw-app .lw-d{padding:22px 18px}}
#lw-app .lw-meta{font-size:13px;color:#6e6e73}
#lw-app .lw-d h2{font-size:28px;line-height:1.2;font-weight:600;margin:6px 0 12px;color:#1d1d1f}
@media(max-width:734px){#lw-app .lw-d h2{font-size:22px}}
#lw-app .badge2{display:inline-flex;align-items:center;gap:6px;font-size:14px;color:#1d1d1f}
#lw-app .lw-ball{margin-top:18px;padding:14px 16px;border-radius:12px;background:#f5f5f7;font-size:15px;line-height:1.5}
#lw-app .lw-sec{margin:30px 0 10px;font-weight:600;font-size:19px;color:#1d1d1f}
#lw-app .rich{overflow-x:auto;word-break:break-word}
#lw-app .rich table{max-width:100%;border-collapse:collapse}
#lw-app .rich img{max-width:100%;height:auto}
#lw-app .rich p{margin:0 0 8px}
#lw-app .rich h1,#lw-app .rich h2,#lw-app .rich h3,#lw-app .rich h4{font-size:16px;font-weight:600;margin:10px 0 6px;color:#1d1d1f}
#lw-app .rich ul,#lw-app .rich ol{padding-left:22px;margin:0 0 8px}
#lw-app .lw-desc{font-size:17px;line-height:1.55;color:#1d1d1f}
#lw-app .lw-kv{margin-top:12px;border-top:1px solid #e8e8ed}
#lw-app .lw-kv .r{display:grid;grid-template-columns:minmax(120px,210px) minmax(0,1fr);gap:12px;padding:11px 0;border-bottom:1px solid #e8e8ed;font-size:15px}
#lw-app .lw-kv .k{color:#6e6e73}
@media(max-width:560px){#lw-app .lw-kv .r{grid-template-columns:1fr;gap:2px}}
#lw-app .lw-back{display:none;margin-bottom:14px;font-size:17px}
@media(max-width:899px){#lw-app .lw-back{display:inline-block}}
#lw-app .lw-foot{color:#6e6e73;font-size:12px;margin-top:18px;line-height:1.5}
#lw-app .lw-steps{list-style:none;display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin:22px 0 0;padding:0}
#lw-app .lw-steps li{position:relative;text-align:center;font-size:13px;color:#86868b;padding-top:26px}
#lw-app .lw-steps li:before{content:"";position:absolute;top:9px;left:-50%;right:50%;height:2px;background:#d2d2d7}
#lw-app .lw-steps li:first-child:before{display:none}
#lw-app .lw-steps li i{position:absolute;top:2px;left:50%;margin-left:-8px;width:16px;height:16px;border-radius:50%;background:#fff;border:2px solid #d2d2d7;z-index:1}
#lw-app .lw-steps li.done{color:#1d1d1f}
#lw-app .lw-steps li.done i{background:#1d1d1f;border-color:#1d1d1f}
#lw-app .lw-steps li.done:before,#lw-app .lw-steps li.now:before{background:#1d1d1f}
#lw-app .lw-steps li.now{color:#0071e3;font-weight:600}
#lw-app .lw-steps li.now i{border-color:#0071e3;background:#0071e3;box-shadow:0 0 0 4px rgba(0,113,227,.18)}
#lw-app .lw-steps li.skip{color:#c7c7cc}
@media(max-width:560px){#lw-app .lw-steps li{font-size:11px}}
#lw-app .lw-tl{position:relative;margin-top:6px;padding-left:22px}
#lw-app .lw-tl:before{content:"";position:absolute;left:6px;top:8px;bottom:8px;width:2px;background:#e8e8ed}
#lw-app .ti{position:relative;padding:12px 0 16px}
#lw-app .ti + .ti{border-top:1px solid #f0f0f2}
#lw-app .ti .pt{position:absolute;left:-21px;top:17px;width:12px;height:12px;border-radius:50%;background:#fff;border:2px solid #86868b}
#lw-app .ti.me .pt{border-color:#0071e3;background:#0071e3}
#lw-app .ti.sys .pt{border-color:#1d7f3d}
#lw-app .ti .th{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;color:#6e6e73;margin-bottom:8px}
#lw-app .ti .th b{font-size:15px;color:#1d1d1f;font-weight:600}
#lw-app .ti .new{background:#0071e3;color:#fff;border-radius:999px;font-size:11px;padding:1px 8px}
#lw-app .ti .rich{font-size:15px;line-height:1.55}
#lw-app .ti.me .rich{background:#e8f1fd;border-radius:14px;padding:12px 14px}
/* 個資同意的勾選框：跟「記住我的基本資料」一樣用一般勾選框（原本套用的樣式邊框太淡） */
#helpdesk_ticket_form .lw-consent-box input[type=checkbox]{-webkit-appearance:checkbox;appearance:auto;width:18px;height:18px;margin:3px 0 0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;float:none}
/* 回報問題頁的內容寬度與左右邊界跟「我的回報」一致（最寬 1200、左右各留 22px，手機 16px）；剛載入時的預覽版面也套用，避免先窄後寬 */
#wrap#wrap .row > div:has(#helpdesk_ticket_form){flex:0 0 100% !important;width:100% !important;max-width:var(--g-wide) !important;margin-left:auto !important;margin-right:auto !important;padding-left:22px !important;padding-right:22px !important}
#wrap#wrap .lw-layout,#wrap#wrap .lw-ssr-layout{width:100% !important;max-width:none !important;margin-left:0 !important;margin-right:0 !important}
@media(max-width:734px){#wrap#wrap .row > div:has(#helpdesk_ticket_form){padding-left:16px !important;padding-right:16px !important}}
/* 回報問題頁：表單整理好之前先不顯示（預覽版面隱藏但保留位置，頁首頁尾照常顯示），整理好後淡入 */
html:not(.lw-ready) .lw-ssr{visibility:hidden !important}
html.lw-ready .lw-layout{animation:lwFormIn .2s ease-out}
@keyframes lwFormIn{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){html.lw-ready .lw-layout{animation:none}}
/* 我的回報：補充說明的附件（共用上傳元件 lw-upload.js） */
#lw-app .lw-rp-up{margin:10px 0 4px;padding:12px 14px;border:1px dashed var(--g-line,#d2d2d7);border-radius:14px;background:#fbfbfd}
#lw-app .lw-rp-up.lw-drop{border-color:var(--g-blue,#0071e3);background:#f0f6ff}
#lw-app .lw-rp-up .lw-up-pick,#lw-app .lw-rp-up .lw-up-paste{font:inherit;font-size:14px;border-radius:980px;padding:6px 14px;margin:0 8px 0 0;cursor:pointer;border:1px solid var(--g-blue,#0071e3);background:#fff;color:var(--g-blue,#0071e3)}
#lw-app .lw-rp-up .lw-up-paste{border-style:dashed}
#lw-app .lw-rp-up .lw-up-tip{display:block;font-size:12px;color:var(--g-ink2,#6e6e73);margin:8px 0 0;line-height:1.6}
#lw-app .lw-up-list:empty{display:none}
#lw-app .lw-up-list{margin-top:8px}
#lw-app .lw-up-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;border:1px solid #e8e8ed;border-radius:12px;padding:8px 10px;margin-top:6px;font-size:13px;background:#fff}
#lw-app .lw-up-thumb{width:48px;height:48px;object-fit:cover;border-radius:8px;border:1px solid #e8e8ed;flex:0 0 auto;cursor:zoom-in;background:#f5f5f7;display:inline-flex;align-items:center;justify-content:center;font-size:22px}
#lw-app .lw-up-name{flex:1 1 140px;min-width:0;word-break:break-all;color:#1d1d1f}
#lw-app .lw-up-size{color:#86868b}
#lw-app .lw-up-bar{flex:1 1 100%;height:4px;background:#e8e8ed;border-radius:2px;overflow:hidden}
#lw-app .lw-up-bar i{display:block;height:100%;width:0;background:var(--g-blue,#0071e3);transition:width .2s}
#lw-app .lw-up-msg{color:#6e6e73}
#lw-app .lw-up-ok .lw-up-bar{display:none}
#lw-app .lw-up-ok .lw-up-msg{color:#1d7d3a}
#lw-app .lw-up-err{border-color:#ffb4ab;background:#fff5f4}
#lw-app .lw-up-err .lw-up-msg{color:#c4281c}
#lw-app .lw-up-rm{margin-left:auto;border:1px solid #ffb4ab;color:#c4281c;background:#fff;border-radius:980px;padding:2px 12px;font-size:12px;cursor:pointer}
#lw-app .lw-up-rm:disabled{opacity:.6;cursor:wait}
#lw-app .lw-files{margin-top:6px;font-size:13px;color:#6e6e73}
/* 預覽與標註畫面（跟回報表單同一套） */
.lw-lb{position:fixed;inset:0;z-index:3000;background:rgba(10,16,35,.92);display:none;flex-direction:column}
.lw-lb-bar{display:flex;align-items:center;gap:12px;justify-content:space-between;padding:10px 14px;background:#101d40;color:#fff;flex-wrap:wrap}
.lw-lb-name{font-size:14px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.lw-lb-tools{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.lw-lb-tools button{background:rgba(255,255,255,.12);color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:8px;padding:6px 10px;font-size:14px;cursor:pointer;min-width:40px}
.lw-lb-tools button:hover{background:rgba(255,255,255,.22)}
.lw-lb-tools button:disabled{opacity:.35;cursor:default}
.lw-lb-tools .lw-lb-close{background:#f5a000;color:#101828;border-color:#f5a000;font-weight:800}
.lw-lb-tools .lw-lb-edit{background:#1f5bb5;border-color:#1f5bb5}
.lw-lb-tools .lw-lb-del{background:rgba(225,29,72,.18);border-color:#fda29b;color:#fff}
.lw-lb-tools .lw-lb-up{background:#12805c;border-color:#12805c}
.lw-lb-zoom{color:#fff;font-size:13px;min-width:48px;text-align:center}
.lw-lb-stage{flex:1;display:flex;align-items:center;justify-content:center;overflow:hidden;touch-action:none}
.lw-lb-media{max-width:92vw;max-height:78vh;transform-origin:center center;transition:transform .08s;user-select:none;border-radius:6px;background:#fff}
.lw-lb-file{color:#fff;text-align:center;font-size:15px}
.lw-lb-hint{color:#cbd5e1;font-size:12px;text-align:center;padding:8px}
.lw-lb-etools{gap:10px}
.lw-lb-grp{display:inline-flex;gap:4px;padding-right:8px;border-right:1px solid rgba(255,255,255,.2)}
.lw-lb-grp:last-child{border-right:0}
.lw-lb-tools button.on{background:#fff;color:#101d40;border-color:#fff}
.lw-lb-tools .lw-sw{min-width:28px;width:28px;height:28px;padding:0;border-radius:50%;border:2px solid rgba(255,255,255,.5)}
.lw-lb-tools .lw-sw.on{outline:3px solid #f5a000;outline-offset:1px}
.lw-lb-canvas{max-width:94vw;max-height:76vh;background:#fff;border-radius:6px;cursor:crosshair;touch-action:none}
#lw-app .lw-ths{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
#lw-app .lw-th{width:120px;height:90px;object-fit:cover;border-radius:10px;border:1px solid #e8e8ed;background:#f5f5f7;cursor:zoom-in}
#lw-app .lw-up-bar{height:6px;border-radius:3px}
#lw-app .lw-up-msg{font-variant-numeric:tabular-nums}
#lw-app .lw-up-row:not(.lw-up-ok):not(.lw-up-err) .lw-up-bar{background-image:linear-gradient(90deg,transparent,rgba(0,113,227,.28),transparent);background-size:50% 100%;background-repeat:no-repeat;animation:lwUpRun 1.1s linear infinite}
@keyframes lwUpRun{from{background-position:-50% 0}to{background-position:150% 0}}
#lw-app .lw-files-list{display:flex;flex-direction:column;gap:6px}
#lw-app .lw-fl{display:flex;align-items:center;gap:10px;width:100%;text-align:left;font:inherit;font-size:14px;padding:9px 12px;border:1px solid #e8e8ed;border-radius:12px;background:#fff;cursor:pointer;color:#1d1d1f}
#lw-app .lw-fl:hover{border-color:var(--g-blue,#0071e3)}
#lw-app .lw-fl .nm{flex:1;min-width:0;word-break:break-all;color:var(--g-blue,#0071e3)}
#lw-app .lw-fl .sz{color:#86868b;font-size:12px}
#lw-app .lw-fl.busy{opacity:.6;cursor:progress}
.lw-pdf{position:fixed;inset:0;z-index:3000;background:rgba(10,16,35,.85);display:flex;flex-direction:column}
.lw-pdf-bar{display:flex;align-items:center;gap:10px;padding:10px 14px;background:#101d40;color:#fff}
.lw-pdf-bar .nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:700;font-size:14px}
.lw-pdf-bar a,.lw-pdf-bar button{font:inherit;font-size:14px;border-radius:8px;padding:6px 12px;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.12);color:#fff !important;text-decoration:none !important;cursor:pointer}
.lw-pdf-bar .lw-pdf-x{background:#f5a000;border-color:#f5a000;color:#101828 !important;font-weight:800}
.lw-pdf iframe{flex:1;width:100%;border:0;background:#fff}
