/* 揉PAin content studio. Presentation only; publishing remains in index.html. */
:root{--bg:#f4f3ef;--surface:#fffefa;--border:#d9dbd1;--text:#343632;--muted:#6c7067;--accent:#626a55;--accent-d:#4f5945;--warn:#92551c;--success:#426344;--sidebar-w:232px;--topbar-h:80px;--sans:'Noto Sans TC','Microsoft JhengHei','PingFang TC',sans-serif;--r:6px}
[hidden]{display:none!important}
body{font-size:15px}button,a,input,textarea,select,label{touch-action:manipulation}
button:disabled{opacity:.4;cursor:default}
:focus-visible{outline:3px solid #b68b50;outline-offset:3px}
.ph{display:inline-flex;width:1.2em;height:1.2em;align-items:center;justify-content:center;flex-shrink:0}
.ph svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
#loginPage{background:#f4f3ef;min-height:100dvh;border-top:8px solid #343632}
.login-logo{height:100px;width:130px;object-fit:contain;margin-bottom:26px}
.login-box{max-width:440px;padding:36px;border-radius:8px;border-color:#d4cabb;box-shadow:0 12px 38px #392b2208}
.login-title{font-family:Georgia,'PMingLiU',serif;font-size:26px;line-height:1.6;font-weight:500}
.login-sub{font-size:14px;line-height:1.9;margin:14px 0 28px}
.login-footnote{font-size:12px;color:var(--muted);margin-top:24px;line-height:1.8;border-top:1px solid var(--border);padding-top:18px}
.field-label,.form-label{font-size:14px;color:#514536}
.btn-primary{min-height:48px;font-weight:700}
#topBar{left:var(--sidebar-w);padding:0 32px;gap:16px;height:var(--topbar-h)}
.topbar-logo{display:none}.topbar-module{font-size:17px;font-weight:700}
.topbar-status{font-size:12px;white-space:normal;max-width:160px}
.tb-btn{min-height:44px;padding:10px 14px;font-size:13px;white-space:nowrap}
.tb-btn[onclick="saveDraft()"]{background:var(--accent);color:white;border-color:var(--accent)}
.tb-btn-success{background:transparent;color:var(--success);border:1px solid var(--border)}
#sidebar{top:0;padding:28px 14px;background:#343632;color:#f4f3ef;border:0;z-index:120}
.studio-brand{padding:0 16px 28px;border-bottom:1px solid #ffffff24;margin-bottom:24px}
.studio-brand strong{font-family:Georgia,'PMingLiU',serif;font-size:28px;font-weight:500;display:block}
.studio-brand p{font-size:12px;color:#cbbca8;margin-top:4px}
.nav-section{font-size:12px;letter-spacing:0;color:#c7b9a6;padding:12px 16px 8px}
.nav-item{width:100%;text-align:left;min-height:48px;padding:12px 16px;margin:3px 0;font-size:14px;color:#e8e0d3;border-left:2px solid transparent;border-radius:4px;transition:background .15s}
.nav-item:hover{background:#ffffff0d;color:white}.nav-item.active{background:#ffffff13;color:#fff8e9;border-left-color:#d4b484}
.nav-item i{font-size:19px}.studio-sidebar-foot{margin:28px 16px 0;padding-top:20px;border-top:1px solid #ffffff24;color:#c7b9a6;font-size:12px;line-height:1.9}
#mainContent{padding:36px clamp(24px,4vw,64px) 64px;max-width:1440px;width:calc(100% - var(--sidebar-w))}
.studio-heading{font-family:Georgia,'PMingLiU',serif;font-size:30px;line-height:1.5;font-weight:500;margin-bottom:8px}
.module-header{border:0;border-bottom:1px solid var(--border);background:none;padding:0 0 24px;border-radius:0;margin-bottom:28px;align-items:center}
.module-header-text{font-size:14px;line-height:1.8;max-width:65ch}.module-header-link{font-size:13px;min-height:44px}
.form-section{padding:28px 30px;border-radius:7px;margin-bottom:24px}
.form-section-title{font-size:17px;margin-bottom:24px}.form-row{margin-bottom:22px}
.text-input{min-height:46px;padding:11px 13px;border:1px solid #cfc5b8;background:#fffefa;line-height:1.6;font-size:15px}
.field-hint,.img-note,.tr-sub{font-size:12px;line-height:1.8;margin-top:6px}
.form-label{margin-bottom:8px}.card-fields{gap:18px 22px;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.card-fields>div{min-width:0}.card-fields:has(.img-uploader)>div:has(.img-uploader){grid-column:1/-1}
.img-uploader{gap:18px;flex-wrap:wrap}.img-preview{width:144px;height:108px;object-fit:contain;border-radius:4px;background:#f0ece5}
#home-heroImg-preview{width:240px;height:120px}.img-preview:not([src]),.img-preview[src=""]{visibility:hidden}
.img-upload-btn{min-height:44px;font-size:13px;color:var(--text);background:var(--surface)}
.icon-btn{width:44px;height:44px;flex-shrink:0}.card-item{padding:20px;border-radius:5px}
.card-item-header{gap:12px;flex-wrap:wrap;margin-bottom:18px}.card-item-name-preview{font-size:16px;min-width:80px;overflow-wrap:anywhere}
.card-item-num{background:#eee7dc;color:var(--muted);border-radius:4px}.card-item-actions{margin-left:auto}
.studio-fold{min-height:44px;padding:8px 12px;border:1px solid var(--border);border-radius:5px;color:var(--accent);font-size:13px}
.studio-collapsed>.card-item-header{margin-bottom:0}
.studio-collapsed>:not(.card-item-header){display:none!important}
.studio-collapsed .card-item-actions{display:none}
.card-item-header>.status-badge{white-space:normal;overflow-wrap:anywhere;max-width:100%;margin-left:0}
@media(max-width:760px){.card-item-header>.status-badge{order:3;flex:0 1 auto;width:fit-content;align-self:flex-start}}
.admin-cat-tabs{flex-wrap:wrap;overflow:visible;min-width:0;gap:8px}.admin-cat-tab,.btn-add-cat{min-height:44px;border-radius:5px;font-size:13px}
.cat-tabs-header{margin-bottom:22px}.schedule-field{flex:1;min-width:155px}.schedule-field input[type=datetime-local]{max-width:none;min-height:44px;font-size:14px}
.item-status-row{padding:14px;gap:16px}.item-toggle-label{height:44px;border:11px solid var(--surface);box-sizing:content-box;width:40px;height:22px;border-radius:24px}
.toggle-switch{height:44px}.toggle-track{top:10px;bottom:10px}.toggle-input{display:block;position:absolute;width:1px;height:1px;opacity:0}.toggle-input:focus-visible+.item-toggle-label,.toggle-switch:has(input:focus-visible){outline:3px solid #b68b50;outline-offset:3px}
.pub-btn,.btn-add-item{min-height:44px}.guide-card{bottom:28px;max-width:280px;background:#343632;box-shadow:0 5px 22px #34363220}.guide-card-close{width:44px;height:44px;top:0;right:0;color:#fff}.guide-card-title{padding-right:28px}
.studio-close,.studio-backdrop{display:none}.studio-search{margin:0 0 20px}.studio-search input{margin-top:6px}.studio-search p{font-size:12px;color:var(--muted);margin-top:6px}
@media(min-width:1100px){#module-home{max-width:960px}#module-home.active{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(280px,1fr);gap:0 24px}#module-home>.studio-heading,#module-home>.module-header{grid-column:1/-1}#module-home>.form-section{align-self:start}}
@media(max-width:1100px) and (min-width:761px){:root{--sidebar-w:200px}#topBar{padding:0 16px;gap:8px}.topbar-status{max-width:104px}.tb-btn{padding:10px}.topbar-actions{gap:5px}}
@media(max-width:760px){:root{--topbar-h:112px}#topBar{left:0;height:112px;padding:8px 16px;display:grid;grid-template-columns:44px 1fr auto;grid-template-rows:44px 44px;gap:6px 8px}.menu-toggle{width:44px;height:44px;display:flex}.topbar-module{font-size:15px}.topbar-status{display:block;font-size:11px;max-width:128px}.topbar-actions{grid-column:1/-1;display:grid;grid-template-columns:1.15fr 1.15fr .8fr .8fr;gap:6px}.tb-btn{justify-content:center;padding:8px 6px;min-height:44px;font-size:12px}.tb-btn span{display:inline}.tb-btn i{display:none}#sidebar{width:min(304px,85vw);top:0;z-index:220;padding-top:24px;transition:transform .18s}.studio-close{display:flex;position:absolute;right:12px;top:16px;color:white;border:1px solid #ffffff38;background:none}.studio-backdrop:not([hidden]){display:block;position:fixed;inset:0;background:#21180f70;z-index:210;width:100%;height:100%;border:0}.studio-brand{padding-right:48px}#mainContent{width:100%;padding:24px 16px 48px;margin-left:0}.studio-heading{font-size:27px}.module-header{display:block;padding-bottom:18px;margin-bottom:22px}.module-header-link{margin-top:8px}.form-section{padding:20px 16px;margin-bottom:18px}.card-fields{grid-template-columns:minmax(0,1fr);gap:16px}.card-item{padding:16px 12px}.card-item-header{gap:8px}.card-item-actions{order:4;width:100%;justify-content:flex-end;border-top:1px solid var(--border);padding-top:8px}.img-preview{width:120px;height:96px}.admin-cat-tabs{flex-basis:100%}.cat-tabs-header{align-items:flex-start}.login-box{padding:28px 24px}.login-title{font-size:24px}.guide-card{bottom:20px;right:16px;left:16px;max-width:none}#toast{left:16px;right:16px;bottom:16px}.schedule-fields{flex-basis:100%}.schedule-field{min-width:0;flex-basis:100%}.pub-action-row>.pub-btn{justify-content:center}}
/* Drawer state must settle immediately on a viewport change. */
#sidebar{transition:none}
.guide-card{position:relative;inset:auto;max-width:none;margin:0 0 24px;padding:20px 24px;box-shadow:none;border-radius:6px}
.customer-preview-shell{border:1px solid var(--border);background:var(--bg);overflow:hidden}
#customerPreview{display:block;width:100%;height:min(78vh,900px);border:0;background:var(--bg)}
@media(max-width:760px){#customerPreview{height:70vh}}
.guide-step{display:inline-flex;max-width:300px;margin:0 20px 8px 0;vertical-align:top}
@media(max-width:760px){.guide-step{display:flex;max-width:none;margin-right:0}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* Bread product workspace: one working list, with the existing editors inline. */
#module-breads .module-header{margin-bottom:20px}
.bread-workspace-tabs{display:flex;gap:8px;border-bottom:1px solid var(--border);margin-bottom:24px}
.bread-workspace-tabs button{min-height:48px;padding:12px 24px;font-weight:700;color:var(--muted);border-bottom:3px solid transparent}
.bread-workspace-tabs button[aria-selected="true"]{color:var(--text);border-bottom-color:var(--accent);background:#ece5d9}
#module-breads>.form-section{padding:0;border:0;background:transparent}
#module-breads>.form-section>.form-section-title{font-size:18px;margin-bottom:6px}
#module-breads>.form-section>.form-section-title,#module-breads>.form-section>.field-hint{display:none}
.bread-category-picker{display:none}
.bread-search{margin:18px 0 14px;max-width:680px}
.bread-search label{font-size:13px;color:var(--text);display:block;margin-bottom:7px}
.bread-search-line{display:flex;gap:8px}.bread-search-line input{min-width:0;flex:1}
.bread-search-line button{min-height:44px;padding:8px 16px;border:1px solid var(--border);border-radius:5px;background:var(--surface)}
.bread-search p{font-size:12px;color:var(--muted);margin-top:8px}
.bread-search-empty{padding:24px;border:1px dashed var(--border);margin:12px 0;color:var(--muted)}
.bread-category-settings{margin:0 0 14px;border-bottom:1px solid var(--border)}
.bread-category-settings summary{min-height:44px;padding:10px 4px;cursor:pointer;color:var(--muted);font-size:13px}
.bread-category-settings[open]{background:var(--surface);padding:0 16px 16px;border:1px solid var(--border);border-radius:5px}
.bread-category-settings>.card-item{border:0;padding:8px 0;margin:0!important}
#module-breads .card-list{gap:0;background:var(--surface);border:1px solid var(--border);border-radius:6px;overflow:hidden}
#module-breads .card-list>.card-item{border:0;border-bottom:1px solid var(--border);border-radius:0;padding:0;background:transparent}
#module-breads .card-list>.card-item:last-child{border-bottom:0}
#module-breads .card-list>.card-item>.card-item-header{display:grid;grid-template-columns:56px minmax(120px,1fr) 90px minmax(130px,190px) 64px;gap:12px;align-items:center;margin:0;padding:12px 16px}
#module-breads .card-item-header>.card-item-num{display:none}
#module-breads .card-item-header>.bread-row-image{grid-column:1;grid-row:1;width:56px;height:56px;background:#eee9e0;border-radius:4px;overflow:hidden}
.bread-row-image img{width:100%;height:100%;object-fit:contain}.bread-row-image span{display:none}
.bread-row-image.bread-no-image span{display:flex;width:100%;height:100%;align-items:center;justify-content:center;text-align:center;font-size:10px;color:var(--muted);padding:4px}
#module-breads .card-item-header>.card-item-name-preview{grid-column:2;grid-row:1;font-size:14px;font-weight:600;min-width:0}
#module-breads .card-item-header>.bread-row-price{grid-column:3;grid-row:1;white-space:nowrap;font-size:13px;font-variant-numeric:tabular-nums}
#module-breads .card-item-header>.status-badge{grid-column:4;grid-row:1;justify-self:start;line-height:1.6;font-size:12px}
#module-breads .card-item-header>.studio-fold{grid-column:5;grid-row:1;padding:8px 10px;background:var(--surface)}
#module-breads .card-item-header>.card-item-actions{grid-column:1/-1;grid-row:2;width:100%;justify-content:flex-end;margin:0;padding-top:12px;border-top:1px solid var(--border)}
#module-breads .card-list>.card-item:not(.studio-collapsed){background:#f7f3ec}
#module-breads .card-list>.card-item>.card-fields{padding:8px 20px 24px}
#module-breads .card-list>.card-item>.item-status-row{margin:0 20px 16px;background:var(--surface)}
#module-breads .admin-cat-tabs{gap:6px}
#module-breads .cat-tabs-header{margin:18px 0 10px}
#module-breads .btn-add-item{background:transparent}
@media(max-width:1100px){
 #module-breads .card-list>.card-item>.card-item-header{grid-template-columns:52px minmax(80px,1fr) 80px 60px;gap:8px 12px}
 #module-breads .card-item-header>.bread-row-image{grid-row:1/3;width:52px;height:52px}
 #module-breads .card-item-header>.card-item-name-preview{grid-column:2/4;grid-row:1}
 #module-breads .card-item-header>.bread-row-price{grid-column:2;grid-row:2}
 #module-breads .card-item-header>.status-badge{grid-column:3/5;grid-row:2;justify-self:end}
 #module-breads .card-item-header>.studio-fold{grid-column:4;grid-row:1}
 #module-breads .card-item-header>.card-item-actions{grid-row:3}
}
@media(max-width:600px){
 .bread-category-picker{display:flex;flex:1;min-width:0;align-items:center;gap:8px;font-size:12px}
 .bread-category-picker span{white-space:nowrap}.bread-category-picker select{min-width:0;flex:1;font-size:16px}
 #module-breads #admin-cat-tabs{display:none}
 #module-breads .cat-tabs-header{flex-wrap:nowrap;gap:8px;margin-top:0}
 #module-breads .btn-add-cat{padding:6px 10px;font-size:12px}
 .bread-workspace-tabs{margin-bottom:18px}.bread-workspace-tabs button{flex:1;padding:12px}
 #module-breads .card-list>.card-item>.card-item-header{padding:12px;grid-template-columns:48px minmax(0,1fr) 60px;gap:6px 10px}
 #module-breads .card-item-header>.bread-row-image{grid-row:1/4;width:48px;height:48px;align-self:start}
 #module-breads .card-item-header>.card-item-name-preview{grid-column:2;grid-row:1;line-height:1.6}
 #module-breads .card-item-header>.bread-row-price{grid-column:2;grid-row:2;font-size:12px}
 #module-breads .card-item-header>.status-badge{grid-column:2/4;grid-row:3;justify-self:start;font-size:11px}
 #module-breads .card-item-header>.studio-fold{grid-column:3;grid-row:1/3}
 #module-breads .card-item-header>.card-item-actions{grid-row:4}
 #module-breads .card-list>.card-item>.card-fields{padding:6px 14px 20px}
 #module-breads .card-list>.card-item>.item-status-row{margin:0 14px 12px}
}