@import url('/shared/ui-text-fonts-v1.css');:root{color-scheme:light;--coffee:#805333;--latte:#e8c8a5;--cream:#fffaf3;--paper:#fbf6ea;--line:#e8d8c7;--ink:#65452f}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Yuanti SC','STYuanti','PingFang SC',sans-serif}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button{cursor:pointer;min-height:44px;border:1px solid var(--line);border-radius:12px;background:var(--cream);color:var(--coffee);padding:9px 13px}button:hover{background:#f5e5d2}button:disabled{opacity:.5;cursor:default}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #b87846;outline-offset:2px}button.primary,.ze-primary-button{background:var(--latte)!important;color:#51341f!important;border-color:#d2aa80!important}button.quiet{background:transparent}label{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:12px 0;font-size:14px}input[type=number],select{border:1px solid var(--line);border-radius:9px;background:white;color:var(--ink);padding:9px;min-height:44px;width:100px}select{width:130px}.unit{display:flex;align-items:center;gap:6px;font-size:12px}.two-fields{display:flex;gap:12px}.two-fields label{flex:1;display:block}.two-fields input{width:100%;margin-top:6px}.hint{font-size:12px;line-height:1.7;color:#8a6a51}fieldset{border:0;padding:0;margin:20px 0}legend{font-size:18px;font-weight:700}#feature-add{display:grid;gap:9px}#feature-list{display:flex;gap:6px;flex-wrap:wrap}#feature-list button[aria-pressed=true]{border-color:#a36b43;background:#f1d9be}#original-preview{display:block;max-width:180px;max-height:180px;margin:18px auto;border-radius:12px;background:white}#image-panel>button{width:100%;margin-top:8px}#canvas-area{display:flex;flex-direction:column;height:100%;min-height:0;background:var(--cream);border-radius:20px;border:1px solid var(--line);padding:18px}.canvas-top{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap}#canvas-title{font-family:ZaozuoHand,sans-serif;font-size:26px;margin:18px 4px 0;color:var(--coffee)}#stage{position:relative;flex:1;min-height:240px;overflow:hidden}#empty{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;flex-direction:column}#empty h3{font-family:ZaozuoHand,sans-serif;font-size:24px;font-weight:400;margin:10px 0 22px}#empty p{font-size:13px;color:#93765e}#drawing,#model-view{position:absolute;inset:0;width:100%;height:100%}#drawing{touch-action:none}#drawing [data-feature]{cursor:grab}#drawing [data-feature]:active{cursor:grabbing}.canvas-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px}#dimensions{font-size:12px;color:#8a6a51}#model-status,#error{font-size:12px;margin:6px 0;line-height:1.5}#model-status{color:#8a6a51}#error{color:#b04630}#error:empty,#model-status:empty{display:none}#history{display:flex;gap:4px}#history button{font-size:12px}#palette{display:grid;grid-template-columns:1fr 1fr;gap:10px}#palette label{border:1px solid var(--line);border-radius:12px;display:flex;flex-direction:column;padding:12px;margin:0}#palette input{width:70px;height:50px;border:0;background:none}#palette span{font-size:12px}#swap-colors{grid-column:1/3}.presets{display:flex;gap:8px;margin-top:18px;flex-wrap:wrap}.presets button{display:flex;flex-direction:column;gap:4px;font-size:12px;align-items:center}.presets i{width:26px;height:26px;border-radius:50%;border:1px solid #ddd}#boot{margin:50px;text-align:center}[hidden]{display:none!important}.zl-editor[data-editor=xiaowanyi]{--zl-accent:#a57048;--zl-accent-soft:#f1ddc6;--zl-ink:#65452f;--zl-paper:#fbf6ea}.zl-editor[data-editor=xiaowanyi] .zl-title{color:#805333}.zl-editor[data-editor=xiaowanyi] .zl-tool[aria-selected=true]{background:#f1ddc6;color:#805333}.zl-editor[data-editor=xiaowanyi] .zl-stage{padding:12px}.zl-editor[data-editor=xiaowanyi] .zl-panel-title{color:#805333}.zl-editor[data-editor=xiaowanyi] .ze-save-status{color:#896b53}.zl-editor[data-editor=xiaowanyi] .zl-inspector{background:#fffaf3}.zl-editor[data-editor=xiaowanyi] .zl-brand{min-width:0}details{margin:20px 0}summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-size:14px}
@media(max-width:760px){#canvas-area{padding:10px;border-radius:14px}.canvas-top{gap:6px}#canvas-title{font-size:21px;margin:10px 0 0}#stage{min-height:180px}#empty img{width:75px;height:75px}#empty h3{font-size:20px;margin:6px 0 14px}#empty p{font-size:11px}#history button{padding:6px;min-height:36px}#dimensions{max-width:48%;font-size:11px}.zl-editor[data-editor=xiaowanyi] .zl-stage{padding:7px}#model-status,#error{font-size:11px}.zl-editor[data-editor=xiaowanyi] .zl-panel{padding-bottom:20px}}
html body .zl-editor[data-editor=xiaowanyi].ze-standard-surface .zl-tool[aria-selected=true]{background:#f1ddc6!important}
html body .zl-editor[data-editor=xiaowanyi] .ze-view-modes{margin:0;background:#f4eadd;border-color:#e8d8c7}
html body .zl-editor[data-editor=xiaowanyi] .ze-view-modes button{color:#805333}
html body .zl-editor[data-editor=xiaowanyi] .ze-view-modes button[aria-pressed=true]{background:#805333;color:#fffaf3}
html body .zl-editor[data-editor=xiaowanyi] .ze-history button{color:#805333}

html body .zl-editor[data-editor=xiaowanyi] #flat-tab[aria-pressed=true],html body .zl-editor[data-editor=xiaowanyi] #model-tab[aria-pressed=true]{background:#805333!important;color:#fffaf3!important;border-color:#805333!important}
html body .zl-editor[data-editor=xiaowanyi] #download{background:#e8c8a5!important;color:#51341f!important;border-color:#d2aa80!important}
html body .zl-editor[data-editor=xiaowanyi] #download *{color:inherit!important}

#selection-tools{position:absolute;top:5px;left:50%;transform:translateX(-50%);z-index:3;display:flex;gap:4px;background:#fffaf3ee;border:1px solid #e8d8c7;border-radius:12px;padding:4px;white-space:nowrap}#selection-tools button{padding:6px 10px;min-height:36px;font-size:12px}#drawing [data-selection-action]{cursor:grab}#drawing [data-artwork]{cursor:pointer}

#selection-tools{position:relative;top:auto;left:auto;transform:none;margin:6px auto 0;flex-shrink:0;z-index:1}

@media(max-width:760px){#stage{min-height:140px}}

/* Keep device-pixel backing dimensions separate from the CSS viewport. */
#model-view canvas{display:block;width:100%;height:100%;touch-action:none}

#opener-deferred{margin:10px 4px 0}

/* Frame layout: title row, centered view controls, reserved action dock. */
#canvas-area{padding:0;border-radius:0;border:0;background:#fffaf0}
html body .zl-editor[data-editor=xiaowanyi] .zl-stage{padding:0}
html body .ze-standard-surface #canvas-title{font:400 22px/1.4 ZaobaLayout,sans-serif;margin:0;color:var(--coffee)}
html body .zl-editor[data-editor=xiaowanyi] .frame-canvas-toolbar{background:#fffaf0}
html body .zl-editor[data-editor=xiaowanyi] .ze-view-modes{margin:0 auto;background:#fffdf7}
#stage{margin:0;min-height:220px;background:radial-gradient(#dfd5c3 .8px,transparent .8px) center/20px 20px #fffaf0}
#dimensions{margin:0;padding:4px 18px;background:#fffaf0}
#opener-deferred{margin:4px 22px 8px}
#model-status,#error{margin:4px 18px}
#retry{margin:4px 18px}
html body .zl-editor[data-editor=xiaowanyi] .ze-selection-actions button:not(.ze-selection-remove){color:var(--coffee)}
#remove-opener{font-size:12px;min-height:36px;padding:6px 10px;background:transparent;border-color:transparent;text-decoration:underline;text-underline-offset:3px}
@media(max-width:760px){html body .ze-standard-surface #canvas-title{font-size:18px}#stage{min-height:140px}#opener-deferred{margin:4px 12px;font-size:11px}}

#boot{position:fixed;inset:0;z-index:1000;margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#fffaf1;font-size:14px;color:var(--coffee)}
#loading-indicator{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;z-index:5;pointer-events:none}
#loading-indicator:empty{display:none}
#loading-indicator .zm-inline{background:#fffaf1f5;border:1px solid var(--line);border-radius:20px;padding:18px 22px;max-width:calc(100% - 32px);box-shadow:0 8px 30px #80533312}
#loading-indicator .zm-inline p{font-size:12px;line-height:1.6;max-width:250px;margin:0;color:var(--coffee)}
@media(max-width:760px){#loading-indicator .zm-inline{padding:8px 14px}#loading-indicator .zm-art{margin-bottom:4px}}

/* Reserve the status line so starting a job cannot resize the drag viewport. */
#model-status:empty,#model-status{display:block;min-height:18px}

/* Feedback may change during dragging; keep the drawing viewport stable. */
#model-feedback{flex:0 0 64px;height:64px;overflow:auto;background:#fffaf0}#model-status:empty{display:none}#model-status{min-height:0}

#check-actions{display:flex;gap:8px;align-items:center;flex:0 0 48px;padding:0 18px;background:#fffaf0}#check-layout{font-size:12px;min-height:36px;padding:6px 14px}#cancel-check{font-size:12px;min-height:36px}#feature-list button{font-size:12px}#model-view canvas:focus-visible{outline:2px solid #b87846;outline-offset:-3px}

/* Match frames: manual check is the last row in the canvas top toolbar. */
html body .zl-editor[data-editor=xiaowanyi] .frame-canvas-toolbar #check-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;flex:0 0 auto;padding:0;background:transparent;min-height:44px}
#check-layout{font:inherit;font-size:12px;padding:6px 12px;min-height:44px;border:1px solid #d2b79b;border-radius:10px;background:#f1ddc6;color:var(--ink)}
@media(max-width:760px){html body .zl-editor[data-editor=xiaowanyi] .frame-canvas-toolbar #check-actions{gap:4px}}

/* Added is immediate; a checked slot is only shown for the current model. */
#open-opener.is-added:disabled{opacity:1;background:#ead1b1;color:#65452f;border-color:#b8885e}
#opener-state{font-size:12px;line-height:1.4;color:#754c30;background:#f3e3cf;border:1px solid #dfc3a4;border-radius:9px;padding:7px 10px}
@media(max-width:760px){#opener-state{font-size:11px;padding:6px 8px}}

#spring-state{font-size:12px;line-height:1.4;padding:7px 10px;border:1px solid #d9bda1;border-radius:8px;background:#f6e7d4;color:#765137}#spring-fields{padding:12px 0}#add-spring.is-added:disabled{opacity:1;background:#ead0aa;color:#65452f;border-color:#aa835d}

/* Explicit alignment labels share the reserved action row, with touch targets. */
html body .ze-compact-tools .ze-canvas-dock .ze-selection-actions button[id^="selection-center-"]{flex:0 0 68px;width:68px;min-width:68px;border-radius:10px!important;color:var(--ink,#865535)}
@media(max-width:760px){html body .ze-compact-tools .ze-canvas-dock{flex-wrap:wrap;flex-basis:auto;gap:0}html body .ze-compact-tools .ze-canvas-dock .ze-selection-actions{flex-wrap:wrap;max-width:100%!important}}