#editor{--bg:#f5f3ec;--panel:#fffefa;--text:#30463c;--muted:#788177;--green:#496e59;--tint:#edf1e8;--border:#e6e8df;--canvas:#f7f5ef}
#help,#editor-help,#theme,#editor-theme{display:inline-flex;align-items:center;justify-content:center;gap:7px;background:transparent;border:0;color:var(--text);min-height:40px;padding:8px;font-weight:500}
#theme,#editor-theme{width:40px;flex:none}
.header-icon{display:block;width:17px;height:17px;flex:none;background:center/contain no-repeat}
.header-book{background-image:url('/miniprogram/core/assets/ui-book.svg')}
#home-import.import-action{background:transparent;border:0;padding:10px 0 10px 10px;color:var(--text);gap:7px;font-weight:400}
.library-samples{background:transparent;border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:18px 0;border-radius:0}
.library-samples>span{font-size:14px;font-weight:500;color:var(--text)}
.library-samples .sample-card{display:flex;align-items:center;justify-content:flex-start;gap:10px;background:var(--panel);border:1px solid var(--border);border-radius:12px;min-height:56px;padding:8px 12px;color:var(--text);font-weight:400}
.sample-thumb{width:36px;height:36px;object-fit:contain;flex:none}
.sample-arrow{margin-left:auto;font-size:23px;font-weight:300;color:var(--muted)}
@media(max-width:650px){.library-samples .sample-card{flex:1;min-width:0}}
.header-theme-icon{width:23px;height:23px;background-image:url('/miniprogram/core/assets/ui-sun.svg')}
.dark .header-theme-icon{background-image:url('/miniprogram/core/assets/ui-moon.svg')}
.dark .header-icon{filter:brightness(0) invert(.85)}
.dark #editor{--bg:#1d2721;--panel:#27332b;--text:#ecede4;--muted:#acb5a8;--green:#acc6a5;--tint:#354337;--border:#414e42;--canvas:#242f28}
.craft-group{border-bottom:1px solid var(--border)}
.craft-group summary{display:flex;align-items:center;gap:8px;list-style:none;cursor:pointer;padding:16px 0;font-size:14px;font-weight:600}
.craft-group summary::-webkit-details-marker{display:none}
.craft-group summary:after{content:'＋';margin-left:auto;font-weight:400;color:var(--muted)}
.craft-group[open]>summary:after{content:'−'}
.craft-group summary:focus-visible{outline:2px solid var(--green);outline-offset:2px;border-radius:6px}
.section-number{font-size:10px;color:var(--muted);font-weight:400}
.craft-body{padding:0 0 12px}
#editor .controls,#editor .materials{border:0;background:var(--panel)}
#editor .upload-box{background:var(--tint);border-color:#acbba4}
#editor .image-actions button,#editor .source-row .icon-btn{background:var(--bg);border-color:transparent;color:var(--text)}
#editor .image-actions button[aria-pressed=true]{background:var(--green);color:var(--panel)}
#editor .field-title{color:var(--muted)}
#editor input[type=number],#editor select{background:var(--bg);color:var(--text);border:0;border-radius:8px}
#editor .size-presets button{background:var(--bg);color:var(--text);border:1px solid transparent}
#editor .size-presets button[aria-pressed=true]{background:#f2e5d0;border-color:#d7bd90;color:#6b5536}
#editor .field-title output{background:transparent;font-weight:600}
#editor .preview-panel{border:0;background:var(--panel)}
#editor .viewport{border:0;background-color:var(--canvas);background-image:radial-gradient(#89957c24 1px,transparent 1px);background-size:12px 12px}
#editor .tabs{background:var(--bg)}
#editor .preview-foot{background:transparent}
#editor .print-options{border:0}
.empty-beads{display:grid;grid-template-columns:repeat(2,16px);gap:4px;transform:rotate(-9deg);margin:0 auto 16px;width:36px}
.empty-beads i{width:16px;height:16px;border:5px solid #8ba181;border-radius:50%}
.empty-beads i:nth-child(2){border-color:#dabb91}.empty-beads i:nth-child(3){border-color:#cda298}.empty-beads i:nth-child(4){border-color:#b7c5aa}
#preview-empty strong{font-size:12px;font-weight:500;color:var(--text)}#preview-empty small{display:block;font-size:10px;margin-top:8px}
#viewport:has(#preview-empty:not([hidden])) #canvas-wrap{display:none}
@media(max-width:650px){
body.mobile-studio{background:#f5f3ec}body.mobile-studio.dark{background:#1d2721}
body.mobile-studio .editor-nav .action-btn{background:transparent;border-color:transparent}
body.mobile-studio #back-library{background:var(--panel);border-color:var(--border)}
body.mobile-studio .controls,body.mobile-studio .materials{padding:4px 8px 12px;border-radius:12px}
body.mobile-studio .craft-group summary{font-size:13px;padding:14px 0;gap:6px}
body.mobile-studio .upload-box{min-height:86px;margin-top:6px}
body.mobile-studio .sample-row{margin-bottom:0}
body.mobile-studio .field-note{font-size:9px;line-height:1.6}
body.mobile-studio .primary{font-weight:600;min-height:40px;border-radius:9px}
body.mobile-studio .preview-panel{border-radius:13px}
body.mobile-studio .stats{border-bottom:0;padding:10px 0}
body.mobile-studio .preview-foot{max-height:30px;font-size:9px}
body.mobile-studio .tool-btn{background:var(--panel);border-color:var(--border)}
}
#editor .size-inline{display:inline-flex;align-items:center;gap:3px;color:var(--green)}
#editor .size-inline input{width:58px;min-width:0;padding:4px 2px;border:0;border-bottom:1px dashed var(--border);border-radius:0;background:transparent;color:var(--green);text-align:right;font:inherit;font-weight:600;appearance:textfield}
#editor .size-inline input::-webkit-inner-spin-button{appearance:none}
#editor #loading.cat-loading{position:absolute;inset:0;z-index:8;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--panel);color:var(--text);padding:12px;text-align:center}
#editor #loading[hidden]{display:none}
.loading-cat{width:110px;height:110px;object-fit:contain;animation:cat-hop 1.1s steps(5,end) infinite;transform-origin:center bottom}
.cat-shadow{display:block;width:48px;height:7px;border-radius:50%;background:#81927a33;animation:cat-shadow-hop 1.1s steps(5,end) infinite;margin:6px 0 18px}
.cat-title{font-size:13px;font-weight:500}.cat-progress{font-size:11px;color:var(--muted);margin-top:8px}
@keyframes cat-hop{0%,100%{transform:translateY(0) scale(1.05,.95)}35%,55%{transform:translateY(-20px) rotate(-5deg) scale(.97,1.03)}80%{transform:translateY(0) scale(1.08,.92)}}
@keyframes cat-shadow-hop{0%,80%,100%{transform:scaleX(1);opacity:.8}40%,55%{transform:scaleX(.65);opacity:.35}}
@media(prefers-reduced-motion:reduce){.loading-cat,.cat-shadow{animation:none}}
.chart-map-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.chart-map-row canvas{flex:none;cursor:crosshair;border:1px solid var(--border);image-rendering:pixelated}.chart-map-row span{flex:1;min-width:70px;font-size:11px;line-height:1.6}
.collection-heading{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.month-filter{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--green)}.month-filter input{max-width:145px;padding:7px;border:1px solid var(--border);border-radius:8px;background:var(--panel);color:var(--text)}.project-actions{flex-wrap:wrap}.delete-project{color:#ae5140!important;background:transparent!important}.collection-heading h2{margin:0}
.craft-group summary:after{display:flex;align-items:center;justify-content:center;flex:none;width:28px;height:28px;border:1px solid var(--border);border-radius:8px;background:var(--tint);color:var(--green);font-size:18px}
.preview-stage{position:relative;min-width:0}.preview-stage .floating-selection{position:absolute;z-index:5;bottom:10px;left:12px;right:12px;margin:0;padding:12px;border:1px solid var(--border);border-radius:12px;background:var(--panel);box-shadow:0 4px 18px #243c3524;max-height:48%;overflow:auto;font-size:12px}
.floating-selection .selection-actions{display:flex;gap:6px;flex-wrap:wrap}.floating-selection .action-btn{padding:6px;font-size:11px;min-height:30px}.floating-selection .recolor-row{display:flex;gap:6px;flex-wrap:wrap}.floating-selection .recolor-row .primary{padding:8px;font-size:12px}.floating-selection .field-note{display:none}
@media(max-width:650px){body.mobile-studio .preview-stage{flex:1;min-height:90px;height:0;overflow:hidden}body.mobile-studio .preview-stage .viewport{height:100%;width:calc(100% - 8px)}body.mobile-studio .floating-selection{left:6px;right:6px;padding:9px}body.mobile-studio .floating-selection .recolor-row label{width:100%}body.mobile-studio .floating-selection .recolor-row .primary{width:100%}}
.preview-stage .floating-selection .selection-actions .action-btn{width:auto;flex:1 1 42%;margin:0;padding:6px 3px;font-size:10px}.preview-stage .floating-selection .selection-actions{margin:6px 0}.preview-stage .floating-selection .color-pending{display:none}.preview-stage .floating-selection .recolor-row{margin:6px 0}.preview-stage .floating-selection .recolor-row select{padding:6px}.preview-stage .floating-selection .recolor-row .primary{margin:0}
.preview-stage .floating-selection .recolor-row label{display:flex;align-items:center;gap:8px;white-space:nowrap;width:100%}.preview-stage .floating-selection .recolor-row select{flex:1;min-width:0;margin:0;min-height:34px}.preview-stage .floating-selection{pointer-events:auto;z-index:20}
.color-chip{width:20px;height:20px;border:1px solid #80908055;border-radius:5px;flex:none;box-sizing:border-box}.color-picker-trigger{display:flex;align-items:center;gap:8px;flex:1;min-width:0;border:1px solid var(--border);border-radius:8px;padding:8px 10px;background:var(--tint);color:var(--text);cursor:pointer}.color-picker-trigger>span:last-child{margin-left:auto}
dialog.color-sheet{width:min(520px,calc(100% - 24px));box-sizing:border-box;max-height:85vh;padding:20px;border:1px solid var(--border);border-radius:20px;background:var(--panel);color:var(--text)}dialog.color-sheet::backdrop{background:#15261c66}.color-sheet-header{display:flex;align-items:center;justify-content:space-between;gap:16px}.color-sheet-header button{padding:8px 14px;background:var(--tint);color:var(--text);border:0;border-radius:8px;cursor:pointer}.color-search{box-sizing:border-box;width:100%;margin:14px 0;padding:12px;background:var(--tint);color:var(--text);border:1px solid var(--border);border-radius:10px}.color-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;max-height:48vh;overflow:auto}.color-choice{display:flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding:8px 4px;border:1px solid var(--border);border-radius:8px;background:var(--bg);color:var(--text);font-size:12px;cursor:pointer}.color-choice-active{border:2px solid var(--green);background:var(--tint)}.color-sheet-note{font-size:11px;color:var(--muted);margin-bottom:0}
.color-grid .add-color{font-size:25px;border-style:dashed;color:var(--green)}.custom-color-form{padding:18px 0}.custom-color-form>input{box-sizing:border-box;width:100%;padding:12px;background:var(--tint);color:var(--text);border:1px solid var(--border);border-radius:10px}.custom-color-value{display:flex;align-items:center;gap:12px;margin:14px 0}.custom-color-value input{width:60px;height:42px}.custom-color-buttons{display:flex;gap:10px}.custom-color-buttons button{flex:1;padding:10px;background:var(--tint);color:var(--text);border:1px solid var(--border);border-radius:8px;cursor:pointer}.color-choice span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.color-grid[hidden]{display:none}
/* Language selector sits beside the home subtitle, above the primary action. */
.subtitle-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.subtitle-row>p{flex:1;min-width:0}.language-picker{flex:none}.language-picker select{min-height:36px;width:auto;padding:6px 9px;color:var(--green,#416c57);background:var(--panel,#fffefa);border:1px solid var(--border,#e5e8df);border-radius:7px;font:inherit;font-size:12px;cursor:pointer}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.language-picker select:focus-visible{outline:2px solid #789271;outline-offset:3px}html[lang=en] .eyebrow{letter-spacing:0}html[lang=en] .editor-nav{flex-wrap:wrap}html[lang=en] button{white-space:normal;overflow-wrap:break-word}html[lang=en] .tabs{flex-wrap:wrap}html[lang=en] .library-intro h1{font-size:clamp(26px,5vw,44px)}

/* Standalone website actions */
.topbar{flex-wrap:wrap}.site-dialog{max-height:85dvh;overflow:auto}.site-dialog p{line-height:1.7}.site-dialog input{min-width:0;width:100%;box-sizing:border-box}.site-dialog .modal-actions{flex-wrap:wrap}footer{flex-wrap:wrap;gap:8px 20px}footer .text-btn{font:inherit;padding:0}footer .site-filing{color:inherit;font-size:12px;text-decoration:none}footer .site-filing:hover{text-decoration:underline}#site-share{white-space:nowrap}