body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--bg);min-width:320px;margin:0;overflow-x:hidden}#root{min-height:100dvh}.sidebar-collapse-button{display:none}@media (width>=1400px){.sidebar-collapse-button{border:1px solid color-mix(in srgb, var(--accent) 22%, var(--border));background:color-mix(in srgb, var(--accent-soft) 42%, var(--surface-solid));min-height:38px;color:var(--accent-strong);cursor:pointer;font:inherit;white-space:nowrap;transition:border-color .15s var(--ease-out), background-color .15s var(--ease-out), box-shadow .15s var(--ease-out);border-radius:11px;flex:none;justify-content:center;align-items:center;gap:4px;padding:0 10px 0 12px;font-size:.72rem;font-weight:720;display:inline-flex;box-shadow:inset 0 1px #ffffff94}.sidebar-collapse-button svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2px;width:15px;height:15px}.sidebar-collapse-button:focus-visible{outline:3px solid color-mix(in srgb, var(--accent) 46%, transparent);outline-offset:3px}.sidebar-collapse-button:active{border-color:color-mix(in srgb, var(--accent) 38%, var(--border));background:color-mix(in srgb, var(--accent-soft) 78%, var(--surface-solid))}}@media (width>=1400px) and (hover:hover) and (pointer:fine){.sidebar-collapse-button:hover{border-color:color-mix(in srgb, var(--accent) 38%, var(--border));background:color-mix(in srgb, var(--accent-soft) 72%, var(--surface-solid));box-shadow:0 6px 16px #1e4b7a1a,inset 0 1px #ffffffad}}@media (prefers-reduced-motion:reduce){.sidebar-collapse-button{transition-duration:1ms}}.style-favorites{--favorites-accent:#1769d2;min-height:0;color:var(--text,#152238);flex-direction:column;gap:16px;display:flex}.style-favorites button{font:inherit}.style-favorites-header,.style-favorites-selection,.style-favorite-title-row,.style-favorite-actions,.style-favorites-footer{align-items:center;display:flex}.style-favorites-header{justify-content:space-between;gap:16px}.style-favorites-header h2{margin:0;font-size:1.12rem}.style-favorites-header p,.style-favorites-footer p{color:var(--muted,#718096);margin:4px 0 0;font-size:.82rem;line-height:1.45}.style-favorites-warning{color:#7c5700;background:#fff5d9;border-radius:10px;margin:0;padding:10px 12px;font-size:.82rem}.style-favorites-storage-note{border:1px solid color-mix(in srgb, #d49116 24%, var(--border,#d9e1ec));background:color-mix(in srgb, #fff4cf 52%, var(--surface,#fff));color:color-mix(in srgb, #72500c 82%, var(--text,#152238));border-radius:11px;align-items:flex-start;gap:9px;padding:10px 11px;font-size:.75rem;line-height:1.5;display:flex}.style-favorites-storage-note svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.7px;flex:none;width:17px;height:17px;margin-top:1px}.style-favorites-empty{border:1px dashed var(--border,#d9e1ec);min-height:150px;color:var(--muted,#718096);text-align:center;border-radius:14px;align-content:center;place-items:center;gap:10px;display:grid}.style-favorites-empty svg,.favorite-current-button svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px;width:20px;height:20px}.style-favorites-empty p{max-width:24rem;margin:0;font-size:.88rem}.style-favorites-selection{color:var(--muted,#718096);justify-content:space-between;gap:12px;font-size:.82rem}.style-favorites-selection>div{gap:4px;display:flex}.style-favorites-selection button,.style-favorite-actions button{color:var(--favorites-accent);cursor:pointer;background:0 0;border:0}.style-favorites-selection button:disabled{opacity:.45;cursor:default}.style-favorites-list{gap:10px;min-height:0;margin:0;padding:0;list-style:none;display:grid;overflow:auto}.style-favorites-list>li{border:1px solid var(--border,#d9e1ec);background:var(--surface,#fff);border-radius:14px;grid-template-columns:24px minmax(0,1fr);gap:10px;padding:12px;display:grid}.style-favorites-list>li.is-color{grid-template-columns:50px minmax(0,1fr)}.style-favorite-color-swatch{border:1px solid color-mix(in srgb, var(--border,#d9e1ec) 82%, transparent);border-radius:13px;width:50px;height:50px;box-shadow:inset 0 1px #ffffff61,0 6px 14px #1d3c5d1f}.style-favorite-select{cursor:pointer;width:20px;height:20px;position:relative}.style-favorite-select input{opacity:0;position:absolute}.style-favorite-check{border:1.5px solid var(--border-strong,#aab8cb);border-radius:6px;width:18px;height:18px;display:block}.style-favorite-select input:checked+.style-favorite-check{border-color:var(--favorites-accent);background:var(--favorites-accent);box-shadow:inset 0 0 0 4px var(--surface,#fff)}.style-favorite-select input:focus-visible+.style-favorite-check,.style-favorites button:focus-visible,.favorite-current-button:focus-visible{outline:2px solid var(--favorites-accent);outline-offset:2px}.style-favorite-body{min-width:0}.style-favorite-title-row{justify-content:space-between;gap:8px}.style-favorite-title-row strong{text-overflow:ellipsis;white-space:nowrap;font-size:.9rem;overflow:hidden}.style-favorite-title-row>span{color:var(--muted,#718096);flex:none;font-size:.72rem}.style-favorite-swatches{border:1px solid color-mix(in srgb, var(--border,#d9e1ec) 75%, transparent);border-radius:8px;height:28px;margin-top:9px;display:flex;overflow:hidden}.style-favorite-swatches span{flex:1;min-width:16px}.style-favorite-color-values{gap:6px;margin-top:9px;display:grid}.style-favorite-color-values>span{border:1px solid color-mix(in srgb, var(--border,#d9e1ec) 72%, transparent);background:color-mix(in srgb, var(--surface,#fff) 62%, var(--surface-2,#f3f7fb));border-radius:8px;grid-template-columns:34px minmax(0,1fr);align-items:center;gap:8px;min-height:30px;padding:5px 8px;display:grid}.style-favorite-color-values>.favorite-hex-value{grid-template-columns:34px minmax(0,1fr) auto}.style-favorite-color-values small{color:var(--muted,#718096);letter-spacing:.04em;font-size:.62rem;font-weight:750}.style-favorite-color-values code{color:var(--text,#152238);font-variant-numeric:tabular-nums;text-overflow:ellipsis;white-space:nowrap;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.72rem;overflow:hidden}.favorite-hex-copy{border:1px solid color-mix(in srgb, var(--favorites-accent) 22%, var(--border,#d9e1ec));background:color-mix(in srgb, var(--favorites-accent) 5%, var(--surface,#fff));min-height:28px;color:var(--favorites-accent);cursor:pointer;white-space:nowrap;transition:transform .14s var(--ease-out,cubic-bezier(.23, 1, .32, 1)), background-color .14s var(--ease-out,cubic-bezier(.23, 1, .32, 1)), border-color .14s var(--ease-out,cubic-bezier(.23, 1, .32, 1));border-radius:7px;justify-content:center;align-items:center;gap:4px;padding:4px 7px;font-size:.68rem;font-weight:700;line-height:1;display:inline-flex}.favorite-hex-copy svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.7px;flex:none;width:13px;height:13px}.style-favorite-actions{flex-wrap:wrap;justify-content:flex-end;gap:12px;margin-top:8px;font-size:.78rem}.style-favorite-actions button.style-favorite-edit{border:1px solid color-mix(in srgb, var(--favorites-accent) 24%, var(--border,#d9e1ec));background:color-mix(in srgb, var(--favorites-accent) 7%, var(--surface,#fff));border-radius:8px;min-height:30px;padding:4px 9px;font-weight:700}.style-favorite-actions button.danger{color:#b74444}.style-favorites-footer{background:var(--surface,#fff);grid-template-columns:1fr 1fr;gap:8px;padding-top:12px;display:grid;position:sticky;bottom:0}.style-favorites-footer button,.favorite-current-button{cursor:pointer;border-radius:11px;min-height:40px}.style-favorites-footer button{border:1px solid var(--border,#d9e1ec);padding:0 12px;font-weight:650}.style-favorites-footer button:disabled,.favorite-current-button:disabled{opacity:.45;cursor:not-allowed}.style-favorites-secondary{background:var(--surface,#fff);color:inherit}.style-favorites-primary{background:var(--favorites-accent);color:#fff;border-color:var(--favorites-accent)!important}.style-favorites-footer p{grid-column:1/-1}.favorite-current-button{border:1px solid color-mix(in srgb, #e14c73 28%, var(--border,#d9e1ec));background:color-mix(in srgb, #e14c73 7%, var(--surface,#fff));color:#b92e58;align-items:center;gap:7px;padding:0 12px;font-size:.84rem;font-weight:650;display:inline-flex}@media (hover:hover) and (pointer:fine){.favorite-hex-copy:hover{border-color:color-mix(in srgb, var(--favorites-accent) 42%, var(--border,#d9e1ec));background:color-mix(in srgb, var(--favorites-accent) 10%, var(--surface,#fff));transform:translateY(-1px)}.style-favorites-secondary:hover{border-color:var(--border-strong,#aab8cb)}.style-favorites-selection button:hover,.style-favorite-actions button:hover{text-decoration:underline}.style-favorite-actions button.style-favorite-edit:hover{border-color:color-mix(in srgb, var(--favorites-accent) 42%, var(--border,#d9e1ec));background:color-mix(in srgb, var(--favorites-accent) 12%, var(--surface,#fff));text-decoration:none}.favorite-current-button:hover:not(:disabled){background:color-mix(in srgb, #e14c73 12%, var(--surface,#fff))}}@media (pointer:coarse){.favorite-hex-copy,.style-favorite-actions button.style-favorite-edit{min-height:44px;padding-inline:9px}}@media (width<=620px){.picker-header-actions .favorite-current-button{justify-content:center;width:42px;padding:0}.picker-header-actions .favorite-current-button span{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}}@media (prefers-reduced-motion:reduce){.favorite-hex-copy{transition-duration:1ms}.style-favorites *,.favorite-current-button{scroll-behavior:auto}}:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--bg:#edf5fd;--surface:#ffffffe0;--surface-solid:#fff;--surface-2:#f1f6fb;--text:#10223a;--muted:#64748b;--border:#53749c33;--accent:#1769e0;--accent-strong:#0b55c7;--accent-soft:#e7f1ff;--accent-glow:#3686ff2e;--shadow:0 18px 50px #1d47761f, 0 2px 8px #1d47760f;--shadow-soft:0 8px 24px #1d477617, 0 1px 3px #1d47760f;--radius:20px;--touch:44px;--ease-out:cubic-bezier(.23, 1, .32, 1);--ease-in-out:cubic-bezier(.77, 0, .175, 1);--ease-drawer:cubic-bezier(.32, .72, 0, 1);--ease-drawer-smooth:cubic-bezier(.22, .75, .18, 1);color:var(--text);background:var(--bg);font-family:SF Pro Text,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-weight:400;line-height:1.45}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--bg:#07111f;--surface:#0d1b2ee6;--surface-solid:#10223a;--surface-2:#132943;--text:#edf6ff;--muted:#92a8c1;--border:#97bce62b;--accent:#73adff;--accent-strong:#9cc5ff;--accent-soft:#142e50;--accent-glow:#4a97ff38;--shadow:0 22px 60px #00000052, 0 2px 8px #00000038;--shadow-soft:0 10px 28px #00000040}}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}button,input,textarea{font:inherit}.app{flex-direction:column;min-height:100dvh;display:flex}.topbar{background:var(--surface);border-bottom:1px solid var(--border);z-index:10;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:16px;padding:20px 24px 12px;display:flex;position:sticky;top:0}.brand{align-items:center;gap:12px;min-width:0;display:flex}.brand-logo{border:1px solid color-mix(in srgb, #d8cfb8 60%, var(--border));object-fit:cover;background:#f6f1e6;border-radius:10px;flex:none;width:56px;height:56px;box-shadow:0 1px 3px #3e342426}.brand-copy{min-width:0}.brand h1{letter-spacing:0;margin:0;font-family:Songti SC,STSong,Georgia,Times New Roman,serif;font-size:1.35rem;font-weight:700}.brand p{color:var(--muted);max-width:42rem;margin:4px 0 0;font-size:.92rem}.top-actions{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.topic-field{color:var(--muted);flex-direction:column;gap:4px;min-width:160px;font-size:.75rem;display:flex}.lang-toggle{background:var(--surface-2);border:1px solid var(--border);border-radius:999px;padding:3px;display:inline-flex}.lang-toggle button{color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:999px;min-height:36px;padding:8px 12px}.lang-toggle button.active{background:var(--surface);color:var(--text);box-shadow:0 1px 3px #00000014}.btn{border:1px solid var(--border);background:var(--surface);color:var(--text);min-height:var(--touch);cursor:pointer;border-radius:9px;padding:0 16px;transition:background .15s,border-color .15s}.btn.primary{background:var(--accent);color:#fff;border-color:#0000}.btn.ghost{background:0 0}.input,.textarea{border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:8px;width:100%;min-height:42px;padding:10px 12px}.input.mono,.rgb-field .input{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.textarea{resize:vertical;min-height:180px;line-height:1.5}.tabs{background:var(--surface);border-bottom:1px solid var(--border);-webkit-overflow-scrolling:touch;gap:8px;padding:12px 24px;display:flex;overflow-x:auto}.tab{color:var(--muted);white-space:nowrap;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:999px;min-height:42px;padding:0 16px}.tab.active{background:var(--accent-soft);color:var(--accent);border-color:#0000;font-weight:600}.main{flex:1;width:100%;max-width:1280px;margin:0 auto;padding:20px 24px 32px}.editor-split{grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr);align-items:stretch;gap:20px;display:grid}.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);min-height:420px;padding:18px}.panel-title{margin-bottom:14px;font-family:Songti SC,STSong,Georgia,Times New Roman,serif;font-size:1.05rem;font-weight:650}.color-grid{gap:12px;display:grid}.color-grid.square{grid-template-columns:repeat(4,minmax(0,1fr))}.color-grid.circle{grid-template-columns:repeat(auto-fill,minmax(88px,1fr))}.color-cell{cursor:pointer;min-height:var(--touch);background:0 0;border:0;border-radius:10px;flex-direction:column;align-items:center;gap:8px;padding:6px;display:flex}.color-chip{aspect-ratio:1.35;border:1px solid #00000014;border-radius:8px;place-items:center;width:100%;display:grid;box-shadow:inset 0 0 0 1px #ffffff26}.color-grid.circle .color-chip{aspect-ratio:1;border-radius:999px;width:56px;height:56px}.chip-index{color:#0000008c;text-shadow:0 1px #ffffff59;font-size:.95rem;font-weight:700}.color-chip[data-index-tone=light] .chip-index{color:#fff;text-shadow:0 1px 2px #000000b8,0 0 1px #00000075}.color-chip[data-index-tone=dark] .chip-index{color:#000;text-shadow:0 1px #ffffff6b}.color-label{color:var(--muted);flex-direction:column;align-items:center;gap:2px;font-size:.78rem;display:flex}.label-main{color:var(--text);font-weight:500}.label-sub{opacity:.85;font-size:.7rem}.drop-hint{color:var(--muted);margin:18px 0 0;font-size:.85rem}.picker-panel{flex-direction:column;gap:14px;display:flex}.picker-header{justify-content:space-between;align-items:center;gap:12px;display:flex}.picker-header h2{margin:0;font-family:Songti SC,STSong,Georgia,Times New Roman,serif;font-size:1.1rem}.picker-swatch-lg{border:1px solid var(--border);border-radius:8px;width:48px;height:48px}.meta-row{color:var(--muted);flex-wrap:wrap;gap:10px 16px;font-size:.85rem;display:flex}.react-colorful{border-radius:8px;overflow:hidden;width:100%!important;height:220px!important}.field-row{grid-template-columns:48px 1fr;align-items:center;gap:10px;display:grid}.hex-input-group{grid-template-columns:minmax(74px,1fr) auto auto;gap:6px;display:grid}.hex-action,.sampler-action-button,.image-import-button,.expanded-close-button,.expanded-sampler-floating-zoom button{border:1px solid var(--border);background:var(--surface);color:var(--text);cursor:pointer;transition:transform .14s var(--ease-out), background-color .14s var(--ease-out), border-color .14s var(--ease-out);border-radius:8px}.hex-action{min-height:42px;color:var(--muted);padding:0 10px;font-size:.8rem;font-weight:600}.hex-action:active,.sampler-action-button:active,.image-import-button:active,.expanded-close-button:active,.expanded-sampler-floating-zoom button:active{transform:scale(.97)}.hex-action:focus-visible,.sampler-action-button:focus-visible,.image-import-button:focus-visible,.image-sampler-canvas:focus-visible,.expanded-close-button:focus-visible,.expanded-sampler-floating-zoom button:focus-visible,.expanded-sampler-canvas:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.clipboard-status{min-height:1.2em;color:var(--muted);grid-column:2;font-size:.76rem}.rgb-row{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.rgb-field{color:var(--muted);flex-direction:column;gap:6px;font-size:.8rem;display:flex}.image-sampler{border-top:1px solid var(--border);flex-direction:column;gap:10px;margin-top:2px;padding-top:16px;display:flex}.image-sampler-header{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.image-sampler-header h3{letter-spacing:0;margin:0;font-family:Songti SC,STSong,Georgia,Times New Roman,serif;font-size:.96rem}.image-sampler-header p{color:var(--muted);margin:3px 0 0;font-size:.8rem}.image-sampler-actions{flex-wrap:wrap;flex:none;justify-content:flex-end;gap:6px;max-width:390px;display:flex}.sampler-action-button{min-height:32px;padding:0 9px;font-size:.76rem;font-weight:600}.sampler-action-button.magnify{align-items:center;gap:6px;display:inline-flex}.sampler-action-button.subtle{color:var(--muted);background:0 0;border-color:#0000}.sampler-action-button.image-palette-button{color:#fff;background:linear-gradient(#2c82ef,#1767d8);border-color:#0000;flex:1 0 auto;justify-content:center;align-items:center;gap:7px;min-height:40px;padding:0 14px;font-size:.78rem;font-weight:720;display:inline-flex;box-shadow:0 7px 18px #1767d838}.sampler-action-button.image-palette-button:disabled{background:color-mix(in srgb, var(--surface-2) 86%, var(--accent-soft));box-shadow:none;color:var(--muted);cursor:not-allowed;opacity:.72;border-color:#53749c29}@media (hover:hover) and (pointer:fine){.sampler-action-button.image-palette-button:not(:disabled):hover{background:linear-gradient(#398df5,#1c70e5);border-color:#0000;box-shadow:0 9px 22px #1767d847}}.image-sampler-dropzone{border:1px dashed color-mix(in srgb, var(--border) 70%, var(--muted));background:var(--surface-2);min-height:164px;transition:background-color .16s var(--ease-out), border-color .16s var(--ease-out);border-radius:10px;justify-content:center;align-items:center;padding:16px;display:flex;overflow:hidden}.image-sampler-dropzone.has-image{background-image:linear-gradient(45deg,#7f7f7f14 25%,#0000 25%),linear-gradient(-45deg,#7f7f7f14 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#7f7f7f14 75%),linear-gradient(-45deg,#0000 75%,#7f7f7f14 75%);background-position:0 0,0 8px,8px -8px,-8px 0;background-size:16px 16px;border-style:solid;min-height:0;padding:10px}.image-sampler-empty{color:var(--muted);text-align:center;flex-direction:column;align-items:center;gap:5px;font-size:.78rem;display:flex}.image-sampler-empty strong{color:var(--text);font-size:.9rem}.image-sampler-empty-icon,.image-sampler-tool-icon{color:var(--accent);place-items:center;display:grid}.image-sampler-empty-icon{background:var(--accent-soft);border-radius:8px;width:38px;height:38px;margin-bottom:2px}.image-sampler-empty-icon svg,.image-sampler-tool-icon svg,.image-import-button svg,.sampler-action-button svg,.expanded-close-button svg,.expanded-sampler-hint svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;width:19px;height:19px}.sampler-action-button svg{width:15px;height:15px}.image-import-button{align-items:center;gap:7px;min-height:38px;margin-top:7px;padding:0 13px;font-size:.82rem;font-weight:650;display:inline-flex}.image-import-button:disabled{cursor:wait;opacity:.55}.image-sampler-stage{border-radius:8px;flex:0 auto;max-width:100%;display:none;position:relative;overflow:hidden;box-shadow:0 2px 10px #3e342426}.image-sampler-stage.visible{display:block}.image-sampler-canvas{cursor:crosshair;touch-action:none;width:100%;height:100%;display:block}.image-sampler-marker{pointer-events:none;border:3px solid #fff;border-radius:999px;width:30px;height:30px;position:absolute;top:0;left:0;box-shadow:0 0 0 1px #0000008c,0 4px 12px #00000047}.image-sampler-instruction{background:var(--surface-2);border-radius:8px;align-items:center;gap:9px;min-width:0;padding:9px 10px;display:flex}.image-sampler-tool-icon{flex:none}.image-sampler-copy{min-width:0;color:var(--muted);flex-direction:column;flex:auto;font-size:.73rem;display:flex}.image-sampler-copy strong{color:var(--text);text-overflow:ellipsis;white-space:nowrap;font-size:.78rem;overflow:hidden}.sampled-color-readout{border:1px solid var(--border);background:var(--surface);border-radius:6px;flex:none;align-items:center;gap:6px;padding:5px 7px;display:inline-flex}.sampled-color-readout>span{border:1px solid #0000001f;border-radius:4px;width:15px;height:15px}.sampled-color-readout code{color:var(--text);font-size:.72rem}.sampler-status{min-height:1.2em;color:var(--muted);margin:0;font-size:.75rem}.expanded-sampler-backdrop{z-index:1000;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:1;transition:opacity .18s var(--ease-out);background:#1c1812a8;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.expanded-sampler-dialog{border:1px solid color-mix(in srgb, var(--border) 78%, transparent);background:var(--surface);opacity:1;transform-origin:50%;width:min(1180px,100%);height:min(820px,100dvh - 40px);min-height:min(560px,100dvh - 40px);transition:opacity .18s var(--ease-out), transform .18s var(--ease-out);border-radius:12px;grid-template-rows:auto minmax(0,1fr);display:grid;overflow:hidden;transform:scale(1);box-shadow:0 28px 80px #14100a66}@starting-style{.expanded-sampler-backdrop{opacity:0}.expanded-sampler-dialog{opacity:0;transform:scale(.98)}}.expanded-sampler-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;gap:20px;padding:15px 16px 15px 20px;display:flex}.expanded-sampler-header h2{letter-spacing:0;margin:0;font-family:Songti SC,STSong,Georgia,Times New Roman,serif;font-size:1rem}.expanded-sampler-header p{color:var(--muted);margin:3px 0 0;font-size:.78rem}.expanded-sampler-toolbar{flex:none;align-items:center;display:flex}.expanded-close-button{border-radius:9px;place-items:center;width:38px;height:38px;padding:0;display:grid}.expanded-close-button svg{width:19px;height:19px}.expanded-sampler-body{background:#241f19;min-height:0;position:relative;overflow:hidden}.expanded-sampler-viewport{overscroll-behavior:contain;scrollbar-color:#ffffff47 transparent;position:absolute;inset:0;overflow:auto}.expanded-sampler-surface{box-sizing:border-box;place-items:center;width:max-content;min-width:100%;height:max-content;min-height:100%;padding:24px;display:grid}.expanded-sampler-stage{background-color:#faf7f0;background-image:linear-gradient(45deg,#7f7f7f14 25%,#0000 25%),linear-gradient(-45deg,#7f7f7f14 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#7f7f7f14 75%),linear-gradient(-45deg,#0000 75%,#7f7f7f14 75%);background-position:0 0,0 8px,8px -8px,-8px 0;background-size:16px 16px;border-radius:8px;flex:none;position:relative;overflow:hidden;box-shadow:0 12px 36px #00000042}.expanded-sampler-canvas{cursor:crosshair;touch-action:none;width:100%;height:100%;display:block}.expanded-sampler-marker{pointer-events:none;border:3px solid #fff;border-radius:999px;width:34px;height:34px;position:absolute;top:0;left:0;box-shadow:0 0 0 1px #000000b3,0 5px 16px #00000059}.expanded-sampler-floating-zoom{z-index:4;color:#fff;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#1e1b16e0;border:1px solid #ffffff38;border-radius:999px;grid-template-columns:38px 62px 38px;align-items:center;padding:4px;display:grid;position:absolute;bottom:18px;left:50%;transform:translate(-50%);box-shadow:0 10px 28px #00000047}.expanded-sampler-floating-zoom button{width:38px;height:38px;color:inherit;background:0 0;border-color:#0000;border-radius:999px;place-items:center;padding:0;font-size:1.15rem;line-height:1;display:grid}.expanded-sampler-floating-zoom button:disabled{cursor:default;opacity:.32}.expanded-sampler-floating-zoom output{color:#ffffffd1;text-align:center;font-variant-numeric:tabular-nums;font-size:.75rem;font-weight:650}.expanded-sampler-hint,.expanded-color-preview{z-index:3;color:#fff;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#1e1b16db;border:1px solid #ffffff38;position:absolute;bottom:18px;box-shadow:0 10px 28px #0000003d}.expanded-sampler-hint{color:#ffffffc7;border-radius:9px;align-items:center;gap:8px;max-width:min(360px,100% - 36px);padding:9px 11px;font-size:.73rem;display:inline-flex;left:18px}.expanded-sampler-hint svg{color:#a9bfd2;flex:none;width:17px;height:17px}.expanded-color-preview{border-radius:9px;grid-template-columns:auto 28px auto;align-items:center;gap:9px;min-height:46px;padding:7px 9px 7px 12px;display:grid;right:18px}.expanded-color-preview-label{color:#ffffffad;font-size:.72rem}.expanded-color-swatch{background-color:#0000;background-image:linear-gradient(45deg,#5b6472 25%,#0000 25%),linear-gradient(-45deg,#5b6472 25%,#0000 25%),linear-gradient(45deg,#0000 75%,#5b6472 75%),linear-gradient(-45deg,#0000 75%,#5b6472 75%);background-position:0 0,0 6px,6px -6px,-6px 0;background-repeat:repeat,repeat,repeat,repeat;background-size:12px 12px;background-attachment:scroll,scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box,border-box;border:2px solid #ffffffc7;border-radius:6px;width:28px;height:28px}.expanded-color-preview code{color:#fff;letter-spacing:.02em;min-width:68px;font-size:.8rem;font-weight:650}@media (hover:hover) and (pointer:fine){.hex-action:hover,.sampler-action-button:hover,.image-import-button:hover,.expanded-close-button:hover{border-color:color-mix(in srgb, var(--border) 55%, var(--accent));background:var(--surface-2)}.expanded-sampler-floating-zoom button:not(:disabled):hover{background:#ffffff1f}}.opacity-row{flex-direction:column;gap:8px;font-size:.9rem;display:flex}.opacity-row input[type=range]{width:100%;accent-color:var(--accent);min-height:28px}.hint{color:var(--muted);margin:0;font-size:.85rem}.empty{color:var(--muted);text-align:center;padding:40px 12px}.ocr-panel{flex-direction:column;gap:16px;display:flex}.ocr-intro h2{margin:0 0 6px;font-family:Songti SC,STSong,Georgia,Times New Roman,serif}.ocr-intro p{color:var(--muted);margin:0 0 6px}.ocr-layout{grid-template-columns:minmax(140px,180px) minmax(0,1.35fr) minmax(280px,.95fr);align-items:stretch;gap:16px;display:grid}.ocr-targets{flex-direction:column;gap:8px;display:flex}.ocr-target,.template-card{text-align:left;border:1px solid var(--border);background:var(--surface);cursor:pointer;min-height:var(--touch);box-sizing:border-box;overflow-wrap:anywhere;word-break:break-word;white-space:normal;border-radius:9px;width:100%;padding:12px 14px;line-height:1.35}.ocr-target.selected,.template-card.selected{border-color:var(--accent);background:var(--accent-soft);color:var(--text);box-shadow:inset 0 0 0 1px var(--accent)}.ocr-editor{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);flex-direction:column;min-width:0;min-height:480px;padding:16px;display:flex}.ocr-editor .textarea{flex:1;min-height:320px}.field-label{margin-bottom:8px;font-weight:600;display:block}.ocr-templates{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);flex-direction:column;gap:12px;min-width:0;padding:16px;display:flex}.ocr-templates h3,.template-preview h4{margin:0}.ocr-templates h3{font-family:Songti SC,STSong,Georgia,Times New Roman,serif}.template-list{flex-direction:column;gap:8px;display:flex}.template-card{font-size:.95rem;font-weight:600;display:block}.ocr-apply{width:100%}.template-preview{border-top:1px solid var(--border);flex-direction:column;gap:8px;padding-top:4px;display:flex}.template-desc{color:var(--muted);overflow-wrap:anywhere;margin:0;font-size:.88rem;line-height:1.45}.sample-output{background:var(--surface-2);white-space:pre-wrap;word-break:break-word;overflow-wrap:anywhere;border-radius:8px;max-height:220px;margin:0;padding:12px;font-size:.86rem;line-height:1.5;overflow:auto}.footer{color:var(--muted);text-align:center;padding:12px 24px 20px;font-size:.85rem}.toast{color:#fff;box-shadow:var(--shadow);z-index:50;text-align:center;background:#2c2822;border-radius:999px;max-width:min(90vw,420px);padding:12px 18px;position:fixed;bottom:24px;left:50%;transform:translate(-50%)}@media (prefers-color-scheme:dark){.toast{color:#2c2822;background:#e9e2d2}.chip-index{color:#fffc;text-shadow:0 1px 1px #00000059}}@media (width<=1100px){.ocr-layout{grid-template-columns:minmax(140px,170px) minmax(0,1fr)}.ocr-templates{grid-column:1/-1}}@media (width<=980px){.editor-split,.ocr-layout{grid-template-columns:1fr}.ocr-targets{flex-flow:wrap}.ocr-target{flex:auto;min-width:120px}.ocr-editor{min-height:360px}}@media (width<=640px){.topbar,.tabs,.main,.footer{padding-left:14px;padding-right:14px}.brand h1{font-size:1.15rem}.brand{gap:10px}.brand-logo{border-radius:12px;width:48px;height:48px}.color-grid.square{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.panel{min-height:unset;padding:14px}.react-colorful{height:200px!important}.hex-input-group{grid-template-columns:minmax(70px,1fr) auto auto}.hex-action{padding:0 8px}.image-sampler-header{flex-direction:column;align-items:stretch}.image-sampler-header p{display:none}.image-sampler-actions{justify-content:flex-start;width:100%;max-width:none}.sampler-action-button.image-palette-button{flex-basis:100%}.expanded-sampler-backdrop{padding:0}.expanded-sampler-dialog{border:0;border-radius:0;width:100%;height:100dvh;min-height:100dvh}.expanded-sampler-header{padding:12px 12px 12px 16px}.expanded-sampler-header p{display:none}.expanded-sampler-surface{padding:16px}.expanded-sampler-hint{display:none}.expanded-sampler-floating-zoom{bottom:76px}.expanded-color-preview{bottom:14px;right:12px}.expanded-color-preview-label{display:none}}@media (prefers-reduced-motion:reduce){.hex-action,.sampler-action-button,.image-import-button,.expanded-close-button,.expanded-sampler-floating-zoom button{transition-property:background-color,border-color}.hex-action:active,.sampler-action-button:active,.image-import-button:active,.expanded-close-button:active,.expanded-sampler-floating-zoom button:active{transform:none}.expanded-sampler-backdrop,.expanded-sampler-dialog{transition:opacity 1ms linear}.expanded-sampler-dialog{transform:none}}.tab[data-tab=handwriting] svg{color:#a56de2}.handwriting-subtabs{background:color-mix(in srgb, var(--surface-2) 86%, transparent);border:1px solid #53749c29;border-radius:15px;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;margin-bottom:18px;padding:5px;display:grid}.handwriting-subtabs button{min-width:0;min-height:42px;color:var(--muted);cursor:pointer;transition:transform .14s var(--ease-out), color .14s var(--ease-out), background-color .14s var(--ease-out), border-color .14s var(--ease-out), box-shadow .14s var(--ease-out);background:0 0;border:1px solid #0000;border-radius:11px;justify-content:center;align-items:center;gap:6px;padding:0 9px;font-size:.76rem;font-weight:650;display:inline-flex;overflow:hidden}.handwriting-subtabs button span{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.handwriting-subtabs button svg,.palette-action svg,.color-surprise-button svg,.palette-add-icon{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;flex:none;width:17px;height:17px}.handwriting-subtabs button[data-tab=highlight] svg{color:#a56de2}.handwriting-subtabs button[data-tab=brush] svg{color:#ff715b}.handwriting-subtabs button[data-tab=pencil] svg{color:#f5a623}.handwriting-subtabs button[data-tab=pen] svg{color:#36a56f}.handwriting-subtabs button.active{background:var(--surface-solid);box-shadow:0 5px 14px #1e4b7a1a, inset 0 -2px 0 var(--accent);color:var(--text);border-color:#1769e029}.panel-heading-actions{flex-wrap:wrap;flex:0 auto;justify-content:flex-end;align-items:center;gap:7px;min-width:0;display:flex}.palette-action,.color-surprise-button{background:var(--surface-solid);min-height:36px;color:var(--muted);cursor:pointer;white-space:nowrap;transition:transform .14s var(--ease-out), color .14s var(--ease-out), background-color .14s var(--ease-out), border-color .14s var(--ease-out), box-shadow .14s var(--ease-out);border:1px solid #53749c2e;border-radius:11px;justify-content:center;align-items:center;gap:6px;padding:0 10px;font-size:.72rem;font-weight:700;display:inline-flex}.palette-arrange-control{z-index:12;flex:none;position:relative}.palette-arrange-trigger[aria-expanded=true]{border-color:color-mix(in srgb, var(--accent) 44%, var(--border));background:var(--accent-soft);color:var(--accent-strong);box-shadow:0 5px 14px #1e4b7a1a}.palette-arrange-chevron{border-left:1px solid color-mix(in srgb, currentColor 18%, transparent);align-self:stretch;align-items:center;margin-left:1px;padding-left:5px;display:inline-flex}.palette-action .palette-arrange-chevron svg{width:12px;height:12px;transition:transform .14s var(--ease-out)}.palette-arrange-trigger[aria-expanded=true] .palette-arrange-chevron svg{transform:rotate(180deg)}.palette-arrange-menu{z-index:20;background:color-mix(in srgb, var(--surface-solid) 96%, transparent);transform-origin:100% 0;width:min(302px,100vw - 48px);animation:palette-arrange-menu-in .14s var(--ease-out);-webkit-backdrop-filter:blur(20px)saturate(135%);backdrop-filter:blur(20px)saturate(135%);border:1px solid #53749c33;border-radius:15px;gap:4px;padding:7px;display:grid;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 18px 44px #193d6733,inset 0 1px #ffffffb8}.palette-arrange-menu[data-placement=top]{transform-origin:100% 100%;animation-name:palette-arrange-menu-in-top;top:auto;bottom:calc(100% + 8px)}@keyframes palette-arrange-menu-in{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}@keyframes palette-arrange-menu-in-top{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.palette-arrange-option{min-width:0;min-height:54px;color:var(--text);cursor:pointer;text-align:left;transition:color .14s var(--ease-out), background-color .14s var(--ease-out), border-color .14s var(--ease-out);background:0 0;border:1px solid #0000;border-radius:11px;grid-template-columns:34px minmax(0,1fr);align-items:center;gap:10px;padding:7px 9px;display:grid}.palette-arrange-option-icon{background:var(--accent-soft);width:34px;height:34px;color:var(--accent-strong);border-radius:10px;place-items:center;display:grid}.palette-arrange-option-icon svg{fill:none;stroke:currentColor;stroke-width:1.7px;stroke-linecap:round;stroke-linejoin:round;width:19px;height:19px}.palette-arrange-option-copy{gap:3px;min-width:0;display:grid}.palette-arrange-option-copy>span{align-items:center;gap:7px;min-width:0;display:flex}.palette-arrange-option-copy strong{font-size:.76rem;font-weight:740}.palette-arrange-option-copy>small{color:var(--muted);font-size:.66rem;line-height:1.4}.palette-arrange-recommended{background:color-mix(in srgb, var(--accent) 12%, transparent);color:var(--accent-strong);border-radius:999px;padding:2px 5px;font-size:.58rem;font-weight:720}.palette-arrange-option:focus-visible{outline:3px solid var(--accent-glow);outline-offset:-1px}.random-palette-action,.color-surprise-button{color:#6f46bc;background:linear-gradient(135deg,#f1ebffeb,#e6f3ffeb);border-color:#8e64e233}.remove-palette-action{padding-inline:9px}.picker-header-actions{flex:none;align-items:center;gap:9px;display:flex}.color-surprise-button{min-height:42px}.palette-action:active,.color-surprise-button:active,.handwriting-subtabs button:active{transform:scale(.97)}.random-palette-action:active svg,.color-surprise-button:active svg{transform:rotate(18deg)scale(1.08)}.color-grid.palette .color-cell{gap:6px;min-width:0;padding:4px 2px}.color-grid.palette .color-chip{aspect-ratio:1;border-radius:999px;width:40px;height:40px}.color-grid.palette .color-label{width:100%;min-width:0;font-size:.68rem}.color-grid.palette .label-main{text-overflow:ellipsis;white-space:nowrap;width:100%;overflow:hidden}.palette-add-cell:disabled{cursor:default;opacity:.42}.palette-add-chip{border:1.5px dashed color-mix(in srgb, var(--muted) 58%, transparent);color:var(--accent-strong);box-shadow:none;background:color-mix(in srgb, var(--surface-2) 88%, transparent)!important}.palette-add-chip:after{display:none}.palette-add-icon{width:20px;height:20px}.palette-action:focus-visible,.color-surprise-button:focus-visible,.handwriting-subtabs button:focus-visible{outline:3px solid var(--accent-glow);outline-offset:2px}@media (hover:hover) and (pointer:fine){.palette-action:hover,.color-surprise-button:hover,.handwriting-subtabs button:hover{border-color:color-mix(in srgb, var(--border) 48%, var(--accent));background-color:var(--surface-solid);box-shadow:0 5px 14px #1e4b7a1a}.palette-arrange-option:hover{border-color:color-mix(in srgb, var(--border) 55%, var(--accent));background:var(--accent-soft)}.palette-add-cell:hover .palette-add-chip{border-color:var(--accent);background:var(--accent-soft)!important}}@media (prefers-color-scheme:dark){.random-palette-action,.color-surprise-button{color:#d6beff;background:linear-gradient(135deg,#452c6fc2,#193e63c2);border-color:#a47eef3d}.handwriting-subtabs button.active,.palette-action{background-color:var(--surface-solid)}}@media (width<=700px){.topbar{min-height:0}.topbar-inner{grid-template-columns:1fr;grid-template-areas:"brand""actions""workflow"}.hero-visual{display:none}.top-actions{align-items:flex-end}.top-actions .topic-field{flex:auto;min-width:0}.top-actions .lang-toggle{flex:none;align-self:flex-end}.tabs{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;display:grid;overflow:visible}.tab{width:100%;min-width:0;min-height:44px;padding-inline:7px}.tab>span:not(.tab-active-surface){text-overflow:ellipsis;min-width:0;overflow:hidden}.panel{overflow:visible}.drop-hint{display:none}.panel-heading{flex-direction:column;align-items:stretch;gap:10px}.panel-heading-actions{justify-content:flex-start;width:100%}.palette-arrange-menu{transform-origin:0 0;left:0;right:auto}.palette-arrange-menu[data-placement=top]{transform-origin:0 100%}.panel-heading-actions .panel-count{margin-left:auto}}@media (width<=520px){.handwriting-subtabs{grid-template-columns:repeat(2,minmax(0,1fr))}.color-grid.palette{grid-template-columns:repeat(4,minmax(0,1fr))}.picker-header{align-items:flex-start}.picker-header-actions{gap:7px}.color-surprise-button{padding-inline:8px}.picker-swatch-lg{border-radius:14px;width:48px;height:48px}}@media (pointer:coarse){.palette-action,.color-surprise-button,.handwriting-subtabs button{min-height:44px}}@media (prefers-reduced-motion:reduce){.palette-action,.color-surprise-button,.handwriting-subtabs button,.palette-add-chip,.palette-action svg,.color-surprise-button svg{transition-duration:1ms}.palette-action:active,.color-surprise-button:active,.handwriting-subtabs button:active,.random-palette-action:active svg,.color-surprise-button:active svg{transform:none}.palette-arrange-menu{animation-duration:1ms}.palette-action .palette-arrange-chevron svg{transition-duration:1ms}}.export-control{background:#ecf4fce6;border:1px solid #53749c33;border-radius:14px;align-items:center;gap:5px;min-height:40px;padding:4px;display:inline-flex;box-shadow:inset 0 1px #ffffffb8}.export-scope-options{align-items:center;gap:2px;display:inline-flex}.export-scope-options button,.export-submit{min-height:32px;color:var(--muted);cursor:pointer;transition:color .14s var(--ease-out), background-color .14s var(--ease-out), box-shadow .14s var(--ease-out), transform .14s var(--ease-out);background:0 0;border:0;border-radius:9px;justify-content:center;align-items:center;gap:4px;padding:0 8px;font-size:.68rem;font-weight:680;display:inline-flex}.export-scope-options button svg,.export-submit svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px;width:14px;height:14px}.export-scope-options button[aria-pressed=true]{background:var(--surface-solid);box-shadow:0 3px 9px #1e4b7a1c, inset 0 -2px 0 var(--accent);color:var(--accent-strong)}.export-scope-options button:focus-visible,.export-submit:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.export-submit{color:#fff;background:linear-gradient(#2478eb,#1260cf);min-width:70px;padding:0 11px;font-size:.72rem;font-weight:720;box-shadow:0 5px 13px #1463d338}.export-submit:active,.export-scope-options button:active{transform:scale(.96)}.material-library{z-index:1;border-bottom:1px solid var(--border);background:linear-gradient(90deg, #ffffffe6, #f6fbffd6), var(--surface-solid);position:relative;overflow:hidden}.material-library-inner{width:100%;max-width:1280px;margin:0 auto;padding:25px 24px 23px}.material-library-header,.material-library-controls,.material-library-title-group,.material-card-topline,.material-card-actions,.material-pack-link,.material-source-link{align-items:center;display:flex}.material-library-header{justify-content:space-between;gap:18px}.material-library-heading-row{flex:auto;justify-content:space-between;align-items:flex-start;gap:12px;min-width:0;display:flex}.material-library-title-group{align-items:flex-start;gap:13px;min-width:0}.material-library-icon{background:var(--accent-soft);width:46px;height:46px;color:var(--accent-strong);border:1px solid #1769e029;border-radius:15px;flex:none;place-items:center;display:grid;box-shadow:inset 0 1px #fff9}.material-library-icon svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.7px;width:25px;height:25px}.material-library-header h2{letter-spacing:-.03em;margin:2px 0 0;font-size:1.24rem;font-weight:760;line-height:1.25}.material-library-header p{color:var(--muted);margin:4px 0 0;font-size:.8rem}.material-pack-link{background:var(--accent-soft);min-height:40px;color:var(--accent-strong);transition:transform .16s var(--ease-out), border-color .16s var(--ease-out), box-shadow .16s var(--ease-out);border:1px solid #1769e033;border-radius:11px;flex:none;gap:7px;padding:0 13px;font-size:.76rem;font-weight:700;text-decoration:none}.material-pack-link svg,.material-source-link svg,.material-card-actions svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px;flex:none;width:15px;height:15px}.material-library-controls{justify-content:space-between;gap:16px;margin-top:18px}.material-filters{border:1px solid var(--border);background:var(--surface-2);border-radius:12px;gap:4px;padding:4px;display:inline-flex}.material-filters button{min-height:34px;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:9px;align-items:center;gap:6px;padding:0 10px;font-size:.73rem;font-weight:680;display:inline-flex}.material-filters button span{font-variant-numeric:tabular-nums;text-align:center;background:#6382a51a;border-radius:999px;min-width:20px;padding:2px 5px;font-size:.61rem}.material-filters button[aria-pressed=true]{background:var(--surface-solid);color:var(--accent-strong);box-shadow:0 3px 11px #1e4b7a1a}.material-filters button[aria-pressed=true] span{background:var(--accent-soft)}.material-browse-controls{align-items:center;gap:9px;display:inline-flex}.material-scroll-hint{background:var(--accent-soft);min-height:34px;color:var(--accent-strong);white-space:nowrap;border:1px solid #1769e026;border-radius:999px;align-items:center;gap:6px;padding:0 10px;font-size:.69rem;font-weight:700;display:inline-flex}.material-scroll-hint svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.7px;width:16px;height:16px}.material-rail-buttons{gap:5px;display:inline-flex}.material-rail-buttons button{border:1px solid var(--border);background:var(--surface-solid);width:36px;height:36px;color:var(--text);cursor:pointer;transition:transform .16s var(--ease-out), background-color .16s var(--ease-out), border-color .16s var(--ease-out), opacity .16s var(--ease-out);border-radius:11px;place-items:center;padding:0;display:grid;box-shadow:0 4px 12px #1d477614}.material-rail-buttons button.next:not(:disabled){background:var(--accent);color:#fff;animation:material-next-cue 1.4s var(--ease-in-out) 2 .5s;border-color:#0000;box-shadow:0 6px 15px #1769e038}.material-rail-buttons button:disabled{box-shadow:none;cursor:default;opacity:.34}.material-rail-buttons svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:2px;width:18px;height:18px}.material-rail-shell{margin-top:13px;position:relative;overflow:hidden}.material-rail-shell:before,.material-rail-shell:after{z-index:2;background:linear-gradient(90deg, var(--surface-solid), transparent);pointer-events:none;content:"";opacity:1;width:42px;transition:opacity .16s var(--ease-out);position:absolute;inset:0 auto 0 0}.material-rail-shell:after{background:linear-gradient(270deg, var(--surface-solid), transparent);inset:0 0 0 auto}.material-rail-shell.at-start:before,.material-rail-shell.at-end:after{opacity:0}.material-rail{overscroll-behavior-inline:contain;scroll-snap-type:inline proximity;scrollbar-width:none;grid-auto-columns:minmax(246px,.82fr);grid-auto-flow:column;gap:12px;padding:2px 1px 4px;display:grid;overflow-x:auto}.material-rail::-webkit-scrollbar{display:none}.material-rail-progress{min-height:22px;color:var(--muted);font-variant-numeric:tabular-nums;grid-template-columns:minmax(80px,190px) auto;justify-content:end;align-items:center;gap:9px;margin-top:8px;font-size:.65rem;font-weight:680;display:grid}.material-progress-track{background:#53749c21;border-radius:999px;width:190px;height:5px;position:relative;overflow:hidden}.material-progress-track span{border-radius:inherit;height:100%;transition:left .12s linear, width .16s var(--ease-out);background:linear-gradient(90deg,#2478eb,#61a8f7);position:absolute;top:0;box-shadow:0 0 0 1px #1769e014}.material-card{background:var(--surface-solid);scroll-snap-align:start;min-height:210px;transition:transform .18s var(--ease-out), border-color .18s var(--ease-out), box-shadow .18s var(--ease-out);border:1px solid #53749c2e;border-radius:16px;flex-direction:column;padding:13px;display:flex;overflow:hidden;box-shadow:0 7px 20px #1d477612}.material-card-topline{justify-content:space-between;gap:8px}.material-scope{color:#506b89;letter-spacing:.04em;background:#edf3fb;border-radius:999px;align-items:center;min-height:23px;padding:0 8px;font-size:.61rem;font-weight:760;display:inline-flex}.material-scope-excerpt{color:#a84a2c;background:#fff0e8}.material-scope-handwriting{color:#247653;background:#e8f7ef}.material-scope-all{color:#6548a5;background:#eeeafd}.material-source-link{color:var(--muted);gap:3px;font-size:.64rem;font-weight:650;text-decoration:none}.material-source-link svg{width:12px;height:12px}.material-swatches{background:var(--surface-2);border:1px solid #18335217;border-radius:12px;grid-template-columns:repeat(8,1fr);height:55px;margin-top:12px;display:grid;overflow:hidden}.material-swatches span{min-width:0;box-shadow:inset -1px 0 #ffffff40}.material-card-copy{min-width:0;padding:11px 2px 9px}.material-card-copy p{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;margin:0;font-size:.63rem;font-weight:630;overflow:hidden}.material-card-copy h3{color:var(--text);letter-spacing:-.02em;text-overflow:ellipsis;white-space:nowrap;margin:3px 0 0;font-size:.92rem;font-weight:730;overflow:hidden}.material-card-actions{gap:6px;margin-top:auto}.material-card-actions button,.material-card-actions a{border:1px solid var(--border);background:var(--surface-2);min-height:35px;color:var(--text);cursor:pointer;border-radius:10px;flex:1 1 0;justify-content:center;align-items:center;gap:5px;padding:0 8px;font-size:.68rem;font-weight:680;text-decoration:none;display:inline-flex}.material-card-actions button{background:var(--accent);color:#fff;border-color:#0000}.material-card-actions button:disabled{cursor:wait;opacity:.58}@media (hover:hover) and (pointer:fine){.export-scope-options button:hover:not([aria-pressed=true]){color:var(--text);background:#fff9}.export-submit:hover{background:linear-gradient(#2d82f6,#1769df);transform:translateY(-1px);box-shadow:0 7px 17px #1463d347}.material-rail-buttons button:hover:not(:disabled){border-color:#1769e052;transform:translateY(-2px)}.material-card:hover{border-color:#1769e040;transform:translateY(-3px);box-shadow:0 13px 28px #1d47761f}.material-pack-link:hover{border-color:#1769e061;transform:translateY(-2px);box-shadow:0 7px 16px #1769e01f}.material-source-link:hover{color:var(--accent-strong)}}@media (prefers-color-scheme:dark){.export-control,.material-library{background:#0c1c30}.export-control{background:#0f2238eb;border-color:#8bb6e529;box-shadow:inset 0 1px #ffffff0a}.export-scope-options button[aria-pressed=true]{background:#17314f}.material-library{background:linear-gradient(90deg,#091728f5,#0c1e33ed)}.material-library-icon{box-shadow:none}.material-card{background:#10243d}.material-rail-shell:before{background:linear-gradient(90deg,#0a192b,#0000)}.material-rail-shell:after{background:linear-gradient(270deg,#0b1c30,#0000)}.material-scope{color:#afc3d9;background:#1a334f}.material-scope-excerpt{color:#ffb59d;background:#a44a2c3d}.material-scope-handwriting{color:#8eddb9;background:#24765345}.material-scope-all{color:#c8b5ff;background:#6548a54d}}@media (width<=700px){.export-control{flex:100%;order:4;justify-content:space-between}.export-scope-options{flex:auto}.export-scope-options button{flex:1 1 0}.export-submit{flex:none}.material-library-inner{padding:20px 14px 18px}.material-library-header{flex-direction:column;align-items:flex-start}.material-pack-link{margin-left:59px}.material-library-controls{flex-direction:column;align-items:stretch;gap:8px}.material-filters{width:100%;overflow-x:auto}.material-filters button{flex:1 0 auto;justify-content:center}.material-browse-controls{justify-content:space-between}.material-rail{grid-auto-columns:minmax(245px,84vw)}.material-rail-progress{grid-template-columns:minmax(80px,1fr) auto}.material-progress-track{width:100%}}@media (width<=420px){.material-library-icon{border-radius:13px;width:42px;height:42px}.material-library-header h2{font-size:1.12rem}.material-library-header p{font-size:.74rem}.material-pack-link{justify-content:center;width:calc(100% - 55px);margin-left:55px}}@media (pointer:coarse){.export-control{min-height:54px;padding:5px}.export-scope-options button,.export-submit,.material-pack-link,.material-scroll-hint,.material-filters button,.material-card-actions button,.material-card-actions a{min-height:44px}.material-rail-buttons button{width:44px;height:44px}}@media (prefers-reduced-motion:reduce){.material-card,.material-pack-link,.material-rail-buttons button,.export-scope-options button,.export-submit{transition-duration:1ms}.material-rail-buttons button.next:not(:disabled){animation:none}}@keyframes material-next-cue{0%,to{transform:translate(0)}50%{transform:translate(3px)}}.app{isolation:isolate;background:linear-gradient(180deg, #edf5fdb8, #edf5fdf0 38%, var(--bg) 76%), url(/knowledge-graph-background.webp) center top / max(1440px, 100vw) auto no-repeat, var(--bg);min-height:100dvh;position:relative;overflow-x:clip}.topbar{z-index:2;border-bottom:1px solid var(--border);background:linear-gradient(90deg,#fafdfffc 0%,#f8fcfff5 42%,#f8fcff80 70%,#eef7ff29 100%);min-height:214px;padding:0;display:block;position:relative;top:auto;overflow:hidden}.topbar:after{content:"";background:linear-gradient(90deg,#0000,#2677df61,#0000);height:1px;position:absolute;inset:auto 0 0}.topbar-inner{z-index:1;grid-template-columns:minmax(340px,1fr) minmax(520px,auto);grid-template-areas:"brand actions""workflow workflow";gap:20px 28px;width:100%;max-width:1280px;margin:0 auto;padding:25px 24px 20px;display:grid;position:relative}.brand{grid-area:brand;align-items:center;gap:15px}.brand-logo{background:#bde9ff;border:1px solid #ffffffb8;border-radius:18px;width:64px;height:64px;box-shadow:0 12px 28px #156bcf33,0 0 0 1px #3184e617}.brand-copy{flex-direction:column;min-width:0;display:flex}.brand-eyebrow,.panel-kicker{color:var(--accent-strong);letter-spacing:.13em;text-transform:uppercase;font-size:.68rem;font-weight:760;line-height:1.35}.brand h1{letter-spacing:-.035em;margin:3px 0 0;font-family:inherit;font-size:clamp(1.4rem,2.2vw,1.72rem);font-weight:760;line-height:1.15}.brand p{max-width:34rem;color:var(--muted);margin:5px 0 0;font-size:.88rem;line-height:1.45}.top-actions{width:fit-content;max-width:100%;box-shadow:var(--shadow-soft);-webkit-backdrop-filter:blur(20px)saturate(135%);backdrop-filter:blur(20px)saturate(135%);background:#ffffffc2;border:1px solid #6289b433;border-radius:18px;grid-area:actions;justify-content:flex-start;place-self:center start;gap:8px;padding:9px}.topic-field{min-width:170px;color:var(--muted);letter-spacing:.03em;gap:3px;padding-left:4px;font-size:.67rem;font-weight:650}.topic-field .input{background:#ecf4fce6;border-color:#0000;min-height:34px;padding:6px 9px;font-size:.82rem}.lang-toggle{--lang-segment-width:30px;background:#e2eefa94;border-color:#53749c24;border-radius:12px;align-items:center;gap:0;padding:3px 3px 3px 20px;display:inline-flex;position:relative}.lang-toggle:before{z-index:0;width:var(--lang-segment-width);background:var(--accent-soft);box-shadow:inset 0 -2px 0 var(--accent), 0 2px 7px #1e4b7a14;content:"";pointer-events:none;transition:transform .24s var(--ease-out), background-color .18s var(--ease-out);will-change:transform;border-radius:9px;position:absolute;inset:3px auto 3px 20px;transform:translate(0)}.lang-toggle[data-locale=en]:before{transform:translateX(var(--lang-segment-width))}.lang-toggle button{z-index:1;min-width:var(--lang-segment-width);min-height:30px;transition:color .14s var(--ease-out), background-color .14s var(--ease-out), box-shadow .14s var(--ease-out);border-radius:9px;padding:4px 3px;font-size:.68rem;font-weight:650;position:relative}.lang-toggle-symbol{z-index:2;width:13px;height:13px;color:var(--muted);pointer-events:none;place-items:center;display:grid;position:absolute;top:50%;left:5px;transform:translateY(-50%)}.lang-toggle-symbol svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.6px;width:13px;height:13px}.lang-toggle[data-locale=zh] .lang-toggle-symbol{color:var(--accent-strong)}.lang-toggle button.active{box-shadow:none;color:var(--accent-strong);background:0 0}.btn{min-height:40px;transition:transform .14s var(--ease-out), background-color .14s var(--ease-out), border-color .14s var(--ease-out), box-shadow .14s var(--ease-out);background:#ffffffbd;border-color:#53749c33;border-radius:12px;justify-content:center;align-items:center;gap:7px;padding:0 12px;font-size:.78rem;font-weight:680;display:inline-flex;box-shadow:0 1px 2px #1e4b7a0a}.btn svg,.tab svg,.footer svg,.local-badge svg{fill:none;stroke:currentColor;stroke-width:1.8px;stroke-linecap:round;stroke-linejoin:round;flex:none;width:16px;height:16px}.btn.primary{color:#fff;background:linear-gradient(#2478eb,#1260cf);border-color:#0000;box-shadow:0 7px 18px #1463d33d}.btn.ghost{color:var(--muted);background:0 0;border-color:#0000}.btn:active,.tab:active,.color-cell:active{transform:scale(.97)}.workflow-strip{-webkit-backdrop-filter:blur(18px)saturate(125%);backdrop-filter:blur(18px)saturate(125%);background:#ffffffb3;border:1px solid #638dbc2e;border-radius:16px;grid-area:workflow;justify-self:start;align-items:center;width:fit-content;max-width:100%;min-height:50px;padding:7px 10px;display:flex;box-shadow:0 8px 24px #1e4b7a12}.local-badge{color:#13734e;background:#e1f7eee0;border-radius:10px;flex:none;align-items:center;gap:7px;min-height:34px;padding:0 10px;font-size:.72rem;font-weight:720;display:inline-flex}.local-status-group{flex:none;align-items:center;gap:6px;display:flex}.session-warning-badge{color:#7a560b;white-space:nowrap;background:#fff5d0e6;border:1px solid #cb8b1033;border-radius:10px;align-items:center;gap:7px;min-height:34px;padding:0 10px;font-size:.7rem;font-weight:720;display:inline-flex}.session-warning-badge svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px;width:14px;height:14px}.local-badge svg{width:14px;height:14px}.workflow-divider{background:var(--border);width:1px;height:24px;margin:0 8px}.workflow-strip ol{align-items:center;gap:0;margin:0;padding:0;list-style:none;display:flex}.workflow-strip li{color:var(--muted);white-space:nowrap;align-items:center;gap:7px;font-size:.72rem;display:flex;position:relative}.workflow-strip li:not(:last-child):after{content:"";background:linear-gradient(90deg,#1769e061,#1769e014);width:28px;height:1px;margin:0 9px}.workflow-strip li>span{color:var(--accent);font-variant-numeric:tabular-nums;font-size:.62rem;font-weight:760}.workflow-strip li strong{color:var(--text);font-weight:650}.tabs-bar{z-index:20;border-bottom:1px solid var(--border);-webkit-backdrop-filter:blur(22px)saturate(145%);backdrop-filter:blur(22px)saturate(145%);background:#f6fbffd6;position:sticky;top:0;box-shadow:0 5px 20px #2353850d}.tabs{scrollbar-width:none;background:0 0;border:0;gap:6px;width:100%;max-width:1280px;margin:0 auto;padding:9px 24px}.tabs::-webkit-scrollbar{display:none}.tab{min-height:44px;color:var(--muted);transition:transform .14s var(--ease-out), color .14s var(--ease-out), background-color .14s var(--ease-out), box-shadow .14s var(--ease-out);border-radius:12px;flex:none;justify-content:center;align-items:center;gap:7px;padding:0 13px;font-size:.82rem;font-weight:620;display:inline-flex}.tab svg{width:17px;height:17px}.tab.active{background:var(--surface-solid);box-shadow:0 5px 16px #2353851c, inset 0 -2px 0 var(--accent);color:var(--accent-strong);border-color:#4980c11f;font-weight:720}.tab[data-tab=brush] svg{color:#ff715b}.tab[data-tab=pencil] svg{color:#f5a623}.tab[data-tab=pen] svg{color:#36a56f}.tab[data-tab=highlight] svg{color:#a56de2}.tab[data-tab=ocr] svg{color:#3488e8}.main{max-width:1280px;padding:28px 24px 42px}.editor-split{grid-template-columns:minmax(0,1.06fr) minmax(340px,.94fr);gap:22px}.panel{border-radius:var(--radius);background:var(--surface);min-height:450px;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(20px)saturate(120%);backdrop-filter:blur(20px)saturate(120%);border-color:#5880ad33;padding:20px;position:relative;overflow:hidden}.panel:before,.ocr-panel:before{opacity:.85;content:"";background:linear-gradient(90deg,#ff6b62 0 14%,#ffbf3e 14% 28%,#65bd72 28% 42%,#3c9df0 42% 56%,#8a68e8 56% 70%,#0000 92%);height:3px;position:absolute;inset:0 0 auto}.right-panel:before{background:linear-gradient(90deg, var(--accent) 0%, #69b8f7 44%, transparent 90%)}.panel-heading{justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:17px;display:flex}.panel-title{letter-spacing:-.025em;margin:3px 0 0;font-family:inherit;font-size:1.18rem;font-weight:740;line-height:1.25}.panel-count{background:var(--surface-2);min-height:32px;color:var(--muted);border:1px solid #547eae29;border-radius:999px;align-items:baseline;gap:4px;padding:6px 10px;font-size:.69rem;font-weight:600;display:inline-flex}.panel-count strong{color:var(--accent-strong);font-variant-numeric:tabular-nums;font-size:.9rem}.color-grid{gap:14px}.color-cell{transition:transform .14s var(--ease-out), background-color .14s var(--ease-out), border-color .14s var(--ease-out);border:1px solid #0000;border-radius:15px;gap:9px;padding:7px}.color-cell.selected .color-chip{outline:2px solid var(--accent);outline-offset:3px}.color-chip{border-color:#0b243e14;border-radius:14px;position:relative;overflow:hidden;box-shadow:inset 0 1px #ffffff4d,0 5px 12px #1d3c5d1a}.color-chip:after{pointer-events:none;content:"";background:linear-gradient(145deg,#ffffff2e,#0000 38%,#00000009);position:absolute;inset:0}.color-grid.circle .color-chip{width:60px;height:60px;box-shadow:inset 0 1px #ffffff61,0 8px 18px #1d3c5d24}.chip-index{z-index:1;font-variant-numeric:tabular-nums;font-size:.82rem;position:relative}.label-main{font-weight:620}.drop-hint{border-top:1px solid var(--border);color:var(--muted);text-align:center;margin-top:19px;padding-top:14px;font-size:.78rem}.picker-panel{gap:15px}.picker-header h2,.image-sampler-header h3,.expanded-sampler-header h2,.ocr-intro h2,.ocr-templates h3{letter-spacing:-.02em;font-family:inherit}.picker-header h2{margin-top:3px;font-size:1.18rem;font-weight:740}.picker-swatch-lg{border:3px solid var(--surface-solid);width:54px;height:54px;box-shadow:0 7px 18px #1e43692e, 0 0 0 1px var(--border);border-radius:16px}.meta-row{background:var(--surface-2);border:1px solid #527dae24;border-radius:11px;gap:8px;padding:9px 11px;font-size:.77rem}.react-colorful{border:1px solid #355d8b1f;border-radius:16px;box-shadow:0 9px 22px #1e43691f;height:228px!important}.react-colorful__saturation{border-radius:16px 16px 0 0}.react-colorful__hue{border-radius:999px;height:17px;margin-top:10px}.input,.textarea{transition:border-color .14s var(--ease-out), box-shadow .14s var(--ease-out), background-color .14s var(--ease-out);background:#ffffffd1;border-color:#53749c38;border-radius:12px;outline:none}.input:focus,.textarea:focus{border-color:var(--accent);background:var(--surface-solid);box-shadow:0 0 0 3px var(--accent-glow)}.field-row{grid-template-columns:50px 1fr}.field-row>span,.rgb-field>span,.opacity-row>span{color:var(--muted);font-size:.76rem;font-weight:650}.hex-action,.sampler-action-button,.image-import-button,.expanded-close-button{background:#ffffffbd;border-radius:11px;font-weight:650}.image-sampler{background:linear-gradient(145deg,#f7fbffe0,#ebf4fdb3);border:1px solid #53749c2b;border-radius:18px;gap:12px;margin-top:3px;padding:17px}.image-sampler-header h3{font-size:.98rem;font-weight:720}.image-sampler-dropzone{background:radial-gradient(circle at 50% 34%,#6db5ff1f,#0000 48%),#ffffffb3;border-color:#3d79c052;border-radius:16px;min-height:246px;padding:20px}.image-sampler-dropzone.dragging{border-color:var(--accent);background:var(--accent-soft)}.image-sampler-illustration{object-fit:cover;border:1px solid #659ad326;border-radius:28px;width:116px;height:116px;margin-bottom:8px;box-shadow:0 13px 30px #285c9124}.image-sampler-empty{gap:7px;font-size:.77rem}.image-sampler-empty strong{font-size:.94rem;font-weight:720}.image-import-button{background:var(--accent-soft);min-height:40px;color:var(--accent-strong);border-color:#0000;padding:0 14px}.image-sampler-instruction{background:#ffffffa8;border:1px solid #53749c24;border-radius:12px}.sampled-color-readout{background:var(--surface-solid);border-radius:9px}.image-sampler-stage{border-radius:13px;box-shadow:0 11px 26px #1a3d622b}.expanded-sampler-backdrop{-webkit-backdrop-filter:blur(13px)saturate(120%);backdrop-filter:blur(13px)saturate(120%);background:#050f1eb8}.expanded-sampler-dialog{background:var(--surface-solid);border-color:#86b1e133;border-radius:20px;box-shadow:0 34px 100px #020a167a}.expanded-sampler-header{background:var(--surface);padding:16px 17px 16px 21px}.expanded-sampler-header h2{font-size:1.04rem;font-weight:730}.expanded-sampler-body{background:#07111f}.expanded-sampler-stage{background-color:#f4f8fc;border-radius:14px}.expanded-sampler-floating-zoom,.expanded-sampler-hint,.expanded-color-preview{background:#0a1b30de;border-color:#a0c7f233;box-shadow:0 12px 34px #0000004d}.expanded-sampler-hint svg{color:#73adff}.ocr-panel{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(20px)saturate(120%);backdrop-filter:blur(20px)saturate(120%);padding:22px;position:relative;overflow:hidden}.ocr-layout{gap:18px}.ocr-target,.template-card,.ocr-editor,.ocr-templates{background:#ffffffbd;border-color:#53749c30;border-radius:14px}.ocr-target,.template-card{transition:border-color .14s var(--ease-out), background-color .14s var(--ease-out), transform .14s var(--ease-out)}.ocr-target.selected,.template-card.selected{box-shadow:inset 3px 0 0 var(--accent);border-color:#1769e059}.sample-output{border-radius:12px}.footer{color:var(--muted);justify-content:center;align-items:center;gap:7px;padding:4px 24px 25px;font-size:.78rem;display:flex}.footer svg{color:#238060;width:14px;height:14px}.toast{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#091c32f0;border:1px solid #ffffff1f;border-radius:13px;box-shadow:0 15px 38px #00142d47}.btn:focus-visible,.tab:focus-visible,.lang-toggle button:focus-visible,.color-cell:focus-visible,.ocr-target:focus-visible,.template-card:focus-visible{outline:3px solid var(--accent-glow);outline-offset:2px}@media (hover:hover) and (pointer:fine){.btn:hover{background:var(--surface-solid);border-color:#1769e052;box-shadow:0 5px 14px #1e4b7a1a}.btn.primary:hover{filter:none;background:linear-gradient(#3184f2,#1769df);box-shadow:0 9px 22px #1463d34d}.btn.ghost:hover{background:#e8f1facc;border-color:#0000}.tab:hover:not(.active){color:var(--text);background:#deedfbad}.color-cell:hover{background:#e7f1fbb8;border-color:#53749c1f}.ocr-target:hover,.template-card:hover{background:var(--surface-solid);border-color:#1769e047}}@media (prefers-color-scheme:dark){.app{background:linear-gradient(180deg, #07111fbd, #07111ff5 38%, var(--bg) 76%), url(/knowledge-graph-background.webp) center top / max(1440px, 100vw) auto no-repeat, var(--bg)}.topbar{background:linear-gradient(90deg,#07111ffc 0%,#07111ff2 45%,#07111fb8 76%,#07111f73 100%)}.top-actions,.workflow-strip{background:#0c1b2ecc;border-color:#8bb6e526}.topic-field .input,.input,.textarea,.hex-action,.sampler-action-button,.expanded-close-button,.ocr-target,.template-card,.ocr-editor,.ocr-templates{background:#0e2035d1}.lang-toggle{background:#132a44e6}.tab.active,.sampled-color-readout,.lang-toggle:before{background:#17314f}.tabs-bar{background:#081322db}.local-badge{color:#8be3bd;background:#144e3b8f}.session-warning-badge{color:#f6d785;background:#5f461380;border-color:#f4bf4d33}.image-sampler{background:linear-gradient(145deg,#122740e0,#0a192bbd)}.image-sampler-dropzone{background:radial-gradient(circle at 50% 34%,#4997f01f,#0000 48%),#091728b8}.image-sampler-instruction{background:#0b1b2fc2}.toast{color:#0b1d33;background:#e7f3fff2}}@media (width<=1080px){.topbar-inner{grid-template-columns:1fr;grid-template-areas:"brand""actions""workflow";gap:15px}.top-actions{justify-content:flex-start;justify-self:stretch;width:100%;max-width:none}.topbar-sidebar-launchers{grid-area:4/1;justify-self:end;margin:0}.topic-field{flex:190px}.workflow-strip{width:100%}.workflow-strip ol{flex:1;justify-content:space-around}.editor-split{grid-template-columns:1fr}}@media (width<=700px){.topbar{background:linear-gradient(90deg,#f9fdfffa,#f7fcffed 68%,#f3faffb3);min-height:0}.topbar-inner,.tabs,.main,.footer{padding-left:14px;padding-right:14px}.topbar-inner{gap:13px;padding-top:17px;padding-bottom:14px}.brand-logo{border-radius:15px;width:52px;height:52px}.brand h1{font-size:1.23rem}.brand p{max-width:18rem;font-size:.78rem}.top-actions{border-radius:15px;gap:7px;padding:8px}.topic-field{flex-basis:100%;padding-left:0}.btn{flex:auto;padding:0 10px}.lang-toggle{flex:none}.history-button{flex:0 0 40px}.workflow-strip{grid-template-columns:1fr;gap:7px;padding:8px;display:grid}.workflow-divider{display:none}.local-badge{justify-self:start}.local-status-group{flex-wrap:wrap;justify-self:start}.workflow-strip ol{grid-template-columns:repeat(3,1fr);width:100%;display:grid}.workflow-strip li{white-space:normal;text-align:center;justify-content:center;gap:4px}.workflow-strip li:not(:last-child):after{width:13px;margin:0;position:absolute;right:-7px}.tabs{padding-top:7px;padding-bottom:7px}.tab{min-height:42px;padding:0 11px;font-size:.78rem}.main{padding-top:18px;padding-bottom:28px}.editor-split{gap:15px}.panel,.ocr-panel{border-radius:18px;min-height:0;padding:16px}.panel-title{font-size:1.08rem}.color-grid{gap:9px}.color-cell{border-radius:12px;padding:5px}.color-chip{border-radius:11px}.react-colorful{height:205px!important}.image-sampler{border-radius:15px;padding:13px}.image-sampler-dropzone{min-height:220px}.image-sampler-illustration{border-radius:24px;width:104px;height:104px}.expanded-sampler-dialog{border-radius:0}}@media (width<=420px){.brand p{display:none}.btn{font-size:.74rem}.btn.ghost{flex:0 0 40px;padding:0;font-size:0}.btn.ghost svg{width:17px;height:17px}.workflow-strip li strong{font-size:.67rem}.workflow-strip li>span{display:none}.panel-count{padding:5px 8px}}@media (prefers-color-scheme:dark) and (width<=700px){.topbar{background:linear-gradient(90deg,#07111ffc,#07111ff0 68%,#07111fc2)}}@media (pointer:coarse){.btn,.lang-toggle button,.hex-action,.sampler-action-button,.image-import-button,.expanded-close-button,.expanded-sampler-floating-zoom button{min-height:44px}.expanded-close-button,.expanded-sampler-floating-zoom button{width:44px;height:44px}.expanded-sampler-floating-zoom{grid-template-columns:44px 62px 44px}}@media (prefers-reduced-motion:reduce){.btn,.tab,.color-cell,.lang-toggle button,.ocr-target,.template-card{transition-duration:1ms}.btn:active,.tab:active,.color-cell:active{transform:none}}.topbar{background:radial-gradient(circle at 82% 18%,#5daeff33,#0000 31%),radial-gradient(circle at 62% 100%,#7e67e81a,#0000 34%),linear-gradient(135deg,#fbfdff 0%,#f2f8ff 54%,#e6f2ff 100%);min-height:286px}.topbar:before{pointer-events:none;content:"";background-image:radial-gradient(#2e68aa1f .7px,#0000 .7px);background-size:18px 18px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(90deg,#0000 35%,#000 66%,#0000 100%);mask-image:linear-gradient(90deg,#0000 35%,#000 66%,#0000 100%)}.topbar-inner{grid-template:"brand visual""actions visual""workflow workflow"/minmax(580px,1.08fr) minmax(450px,.92fr);gap:13px 28px;padding-top:22px;padding-bottom:20px}.brand,.top-actions,.workflow-strip{animation:header-element-enter .48s var(--ease-out) both}.top-actions{animation-delay:70ms}.history-actions{animation:toolbar-actions-enter .36s var(--ease-out) .15s both;flex:none;align-items:center;gap:5px;display:inline-flex}.history-button{min-width:40px;padding:0 9px}.history-button:disabled{cursor:not-allowed;opacity:.38;box-shadow:none}.workflow-strip{animation-delay:.14s}.editor-quick-actions{animation:toolbar-actions-enter .36s var(--ease-out) .19s both}.hero-visual{grid-area:visual;align-self:stretch;min-height:238px;position:relative}.hero-connections{fill:none;stroke:#286fc44d;stroke-width:1.5px;stroke-linecap:round;stroke-dasharray:7 8;width:calc(100% + 10px);height:calc(100% - 5px);animation:9s linear infinite hero-connection-drift;position:absolute;inset:5px -5px 0;overflow:visible}.hero-connections circle{fill:#fff;stroke:#3f8eea;stroke-width:2px;stroke-dasharray:none;transform-box:fill-box;transform-origin:50%;animation:hero-node-pulse 3.6s var(--ease-in-out) infinite}.hero-connections circle:nth-of-type(2){animation-delay:.45s}.hero-connections circle:nth-of-type(3){animation-delay:.9s}.hero-connections circle:nth-of-type(4){animation-delay:1.35s}.hero-card-slot{opacity:0;width:190px;animation:hero-card-enter .64s var(--ease-out) forwards;position:absolute}.hero-card-slot-excerpt{z-index:1;animation-delay:60ms;top:43px;left:0}.hero-card-slot-palette{z-index:3;animation-delay:.125s;top:3px;left:33%}.hero-card-slot-structure{z-index:2;animation-delay:.19s;top:54px;right:-2px}.hero-ui-card{animation:hero-card-float 6.2s var(--ease-in-out) infinite;background:#fff;border:1px solid #4f79a933;border-radius:16px;margin:0;padding:7px;box-shadow:0 18px 38px #264f7b29,0 2px 7px #264f7b14}.hero-card-slot-excerpt .hero-ui-card{--hero-rotation:-2.4deg;animation-delay:-1.2s}.hero-card-slot-palette .hero-ui-card{--hero-rotation:.7deg;animation-duration:5.6s;animation-delay:-3.1s}.hero-card-slot-structure .hero-ui-card{--hero-rotation:2.2deg;animation-duration:6.8s;animation-delay:-4.4s}.hero-ui-card figcaption{color:#425b79;letter-spacing:.01em;align-items:center;gap:7px;min-height:27px;padding:1px 5px 6px;font-size:.66rem;font-weight:720;display:flex}.hero-ui-card figcaption span{color:#1769e0;font-variant-numeric:tabular-nums;background:#e7f1ff;border-radius:7px;place-items:center;width:20px;height:20px;font-size:.57rem;display:grid}.hero-ui-media{aspect-ratio:1.5;background:#f5f9fd;border:1px solid #466e9e24;border-radius:11px;position:relative;overflow:hidden}.hero-ui-media:after{border-radius:inherit;pointer-events:none;content:"";position:absolute;inset:0;box-shadow:inset 0 1px #ffffffd6}.hero-ui-media img{object-fit:cover;width:100%;height:100%;display:block;transform:scale(1.035)}.tab{isolation:isolate;position:relative;overflow:visible}.tab.active{box-shadow:none;background:0 0;border-color:#0000}.tab>svg,.tab>span:not(.tab-active-surface){z-index:1;position:relative}.tab-active-surface{z-index:0;border-radius:inherit;background:var(--surface-solid);box-shadow:0 5px 16px #2353851c, inset 0 -2px 0 var(--accent);opacity:1;transition:opacity .15s var(--ease-out), transform .18s var(--ease-out);border:1px solid #4980c124;position:absolute;inset:0;transform:scale(1)}@starting-style{.tab-active-surface{opacity:0;transform:scale(.94)}}.color-cell{isolation:isolate;position:relative}.tab-stage{animation:editor-stage-in .22s var(--ease-out) both}.color-cell.selected{background:0 0;border-color:#0000}.color-selection-surface{z-index:0;border-radius:inherit;background:color-mix(in srgb, var(--accent-soft) 72%, transparent);box-shadow:none;transform-origin:50%;animation:selection-surface-enter .22s var(--ease-out) both;border:1px solid #1769e029;position:absolute;inset:2px}.color-cell>:not(.color-selection-surface){z-index:1;position:relative}.color-chip{transition:background .18s var(--ease-out), transform .18s var(--ease-out), box-shadow .18s var(--ease-out), outline-color .14s var(--ease-out)}.color-cell.selected .color-chip{outline:2px solid var(--accent);outline-offset:-3px;transform:none}.picker-swatch-lg{transition:background .18s var(--ease-out), transform .18s var(--ease-out), box-shadow .18s var(--ease-out)}.image-sampler-stage.visible{animation:sampler-stage-enter .26s var(--ease-out) both}.image-sampler-instruction{opacity:1;transition:opacity .22s var(--ease-out), transform .22s var(--ease-out);transform:translateY(0)}@starting-style{.image-sampler-instruction{opacity:0;transform:translateY(7px)}}.image-sampler-illustration{transition:transform .22s var(--ease-out), box-shadow .22s var(--ease-out)}.toast{opacity:1;transition:opacity .18s var(--ease-out), transform .22s var(--ease-out);transform:translate(-50%)translateY(0)scale(1)}@starting-style{.toast{opacity:0;transform:translate(-50%)translateY(14px)scale(.97)}}@media (hover:hover) and (pointer:fine){.brand-logo{transition:transform .18s var(--ease-out), box-shadow .18s var(--ease-out)}.brand:hover .brand-logo{transform:translateY(-2px)rotate(-2deg)scale(1.02);box-shadow:0 15px 32px #156bcf3d,0 0 0 1px #3184e61c}.color-cell:hover .color-chip{transform:translateY(-3px)scale(1.015);box-shadow:inset 0 1px #ffffff5c,0 10px 22px #1d3c5d29}.color-cell.selected:hover .color-chip{transform:none}.picker-swatch-lg:hover{box-shadow:0 11px 24px #1e436938, 0 0 0 1px var(--border);transform:translateY(-2px)rotate(2deg)}.image-sampler-dropzone:hover .image-sampler-illustration{transform:translateY(-4px)scale(1.025);box-shadow:0 17px 34px #285c9130}}@keyframes header-element-enter{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes hero-card-enter{0%{opacity:0;transform:translateY(20px)scale(.95)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes hero-card-float{0%,to{transform:translateY(0) rotate(var(--hero-rotation))}50%{transform:translateY(-7px) rotate(calc(var(--hero-rotation) * .7))}}@keyframes hero-connection-drift{to{stroke-dashoffset:-120px}}@keyframes hero-node-pulse{0%,to{opacity:.66;transform:scale(.88)}50%{opacity:1;transform:scale(1.15)}}@keyframes editor-stage-in{0%{opacity:0;transform:translateY(9px)scale(.992)}}@keyframes sampler-stage-enter{0%{opacity:0;transform:translateY(8px)scale(.98)}}@keyframes toolbar-actions-enter{0%{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}@keyframes selection-surface-enter{0%{opacity:0;transform:scale(.94)}to{opacity:1;transform:scale(1)}}@media (prefers-color-scheme:dark){.topbar{background:radial-gradient(circle at 82% 18%,#3e89e333,#0000 31%),radial-gradient(circle at 62% 100%,#7660d224,#0000 34%),linear-gradient(135deg,#081526 0%,#0a1b30 54%,#0d2745 100%)}.topbar:before{background-image:radial-gradient(#8fbcee1f .7px,#0000 .7px)}.hero-ui-card{background:#0c1c30;border-color:#8bb6e52e;box-shadow:0 20px 42px #00000047}.hero-ui-card figcaption{color:#b7cce4}.hero-ui-card figcaption span{color:#85b7ff;background:#15375f}.hero-ui-media{background:#dceeff;border-color:#8bb6e51f}}@media (width<=1080px){.topbar-inner{grid-template-columns:minmax(280px,.72fr) minmax(430px,1.28fr);grid-template-areas:"brand visual""actions actions""workflow workflow"}.hero-visual{min-height:180px}.hero-card-slot{width:166px}.hero-card-slot-excerpt{top:35px}.hero-card-slot-palette{top:0;left:32%}.hero-card-slot-structure{top:39px}.topbar-sidebar-launchers{grid-area:4/1;justify-self:end;margin:0}}@media (width<=760px){.topbar{background:radial-gradient(circle at 86% 22%,#5daeff33,#0000 38%),linear-gradient(145deg,#fbfdff 0%,#edf7ff 100%)}.topbar-inner{grid-template-columns:1fr;grid-template-areas:"brand""visual""actions""workflow"}.hero-visual{min-height:154px}.hero-connections{opacity:.65;width:100%;height:100%;inset:0}.hero-card-slot{width:116px}.hero-card-slot-excerpt{top:22px;left:0}.hero-card-slot-palette{top:0;left:calc(50% - 58px)}.hero-card-slot-structure{top:24px;right:0}.hero-ui-card{border-radius:13px;padding:5px}.hero-ui-card figcaption{gap:4px;min-height:22px;padding:0 3px 4px;font-size:.56rem}.hero-ui-card figcaption span{border-radius:5px;width:16px;height:16px;font-size:.48rem}.hero-ui-media{border-radius:9px}}@media (prefers-color-scheme:dark) and (width<=760px){.topbar{background:radial-gradient(circle at 86% 22%,#3e89e32e,#0000 38%),linear-gradient(145deg,#081526 0%,#0b2038 100%)}}@media (prefers-reduced-motion:reduce){.brand,.top-actions,.workflow-strip,.history-actions,.editor-quick-actions,.hero-card-slot,.hero-ui-card,.hero-connections,.hero-connections circle,.image-sampler-stage.visible{animation:none}.lang-toggle:before,.color-selection-surface{transition:none;animation:none}.hero-card-slot{opacity:1}.tab-stage{animation:none}.image-sampler-instruction,.toast,.tab-active-surface,.color-chip,.picker-swatch-lg,.image-sampler-illustration{transition-property:opacity,background-color,border-color,box-shadow}}@media (width<=700px){.topbar{min-height:0}.topbar-inner{grid-template-columns:1fr;grid-template-areas:"brand""actions""workflow"}.hero-visual{display:none}.tab{min-height:44px;padding-inline:7px}.panel{overflow:visible}.panel-heading{flex-direction:column;align-items:stretch;gap:10px}.drop-hint{display:none}}@media (width>=701px) and (width<=820px){.workflow-strip{grid-template-columns:1fr;gap:7px;min-height:0;display:grid}.workflow-divider{display:none}.workflow-strip .local-status-group{flex-wrap:wrap}.workflow-strip ol{grid-template-columns:repeat(3,minmax(0,1fr));width:100%;display:grid}.workflow-strip li{text-align:center;white-space:normal;justify-content:center;min-width:0}.workflow-strip li:not(:last-child):after{width:13px;margin:0;position:absolute;right:-7px}}.workspace-shell{flex:1;width:100%;min-width:0;position:relative}.workspace-primary{flex-direction:column;min-width:0;min-height:100%;display:flex}.tabs-bar-inner{align-items:center;width:100%;max-width:1280px;margin:0 auto;display:flex}.tabs-bar-inner .tabs{flex:0 auto;width:auto;min-width:0;max-width:none;margin:0}.sidebar-launchers{flex:none;align-items:center;gap:6px;margin-right:24px;display:flex}.topbar-sidebar-launchers{z-index:2;-webkit-backdrop-filter:blur(18px)saturate(125%);backdrop-filter:blur(18px)saturate(125%);background:#ffffffb3;border:1px solid #638dbc2e;border-radius:16px;grid-area:3/2;place-self:center end;margin:0;padding:5px;box-shadow:0 8px 24px #1e4b7a12}.editor-quick-actions{flex-wrap:wrap;flex:none;align-items:center;gap:8px;min-width:0;margin-left:auto;margin-right:24px;display:inline-flex}.editor-quick-actions>.btn,.editor-quick-actions .export-control{min-height:40px}.reset-preset-action{color:var(--muted);white-space:nowrap}@media (width>=701px){.sidebar-launchers{margin-left:auto;margin-right:24px;position:static;transform:none}.topbar-sidebar-launchers{margin:0}}@media (width<=1080px){.topbar-sidebar-launchers{grid-area:4/1;justify-self:end;margin:0}}@media (width>=701px) and (width<=900px){.tabs-bar-inner{flex-wrap:wrap}.tabs-bar-inner .tabs{flex:1 0 100%;order:1}.tabs-bar-inner .history-actions{order:2;margin-left:14px}.tabs-bar-inner .editor-quick-actions{flex:auto;order:3;margin:0 14px 0 8px}}.materials-toggle,.materials-close{background:color-mix(in srgb, var(--surface-solid) 86%, transparent);color:var(--accent-strong);cursor:pointer;border:1px solid #1769e02e;justify-content:center;align-items:center;display:inline-flex}.materials-toggle{min-height:40px;box-shadow:none;white-space:nowrap;transition:border-color .15s var(--ease-out), background-color .15s var(--ease-out), box-shadow .15s var(--ease-out), transform .15s var(--ease-out);background:0 0;border-color:#0000;border-radius:12px;flex:none;gap:7px;margin-right:0;padding:0 12px;font-size:.76rem;font-weight:720}.favorites-toggle{color:#a52f55;position:relative}.favorites-toggle strong{background:color-mix(in srgb, #d7436d 11%, var(--surface-solid));font-variant-numeric:tabular-nums;border-radius:999px;place-items:center;min-width:19px;height:19px;padding:0 5px;font-size:.62rem;line-height:1;display:inline-grid}.materials-toggle.active{background:color-mix(in srgb, var(--surface-solid) 88%, var(--accent-soft));box-shadow:0 5px 16px #2353851a, inset 0 -2px 0 var(--accent);border-color:#1769e057}.sidebar-toggle-chevron{place-items:center;width:16px;height:16px;margin-right:-3px;display:grid}.sidebar-toggle-chevron svg{width:14px;height:14px}.materials-toggle svg,.materials-close svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px;width:18px;height:18px}.materials-backdrop{z-index:30;cursor:default;opacity:0;pointer-events:none;transition:opacity .3s var(--ease-out);background:#05142747;border:0;position:fixed;inset:0}.materials-sidebar{z-index:40;background:color-mix(in srgb, var(--surface-solid) 95%, var(--bg));opacity:0;pointer-events:none;transform-origin:100%;visibility:hidden;will-change:transform, opacity;width:min(380px,100vw - 24px);min-height:0;transition:transform .42s var(--ease-drawer-smooth), opacity .26s var(--ease-out), visibility 0s linear .42s;border:1px solid #53749c33;border-radius:22px;flex-direction:column;display:flex;position:fixed;top:12px;bottom:12px;right:12px;overflow:hidden;transform:translate(calc(100% + 30px))scale(.985);box-shadow:0 28px 80px #0a2b503d}.workspace-shell.materials-open .materials-backdrop{opacity:1;pointer-events:auto}.workspace-shell.materials-open .materials-sidebar{opacity:1;pointer-events:auto;visibility:visible;transition:transform .46s var(--ease-drawer-smooth), opacity .3s var(--ease-out), visibility 0s linear 0s;transform:translate(0)scale(1)}.sidebar-toolbar{z-index:6;border-bottom:1px solid var(--border);background:color-mix(in srgb, var(--surface-solid) 90%, transparent);-webkit-backdrop-filter:blur(18px)saturate(135%);backdrop-filter:blur(18px)saturate(135%);flex:none;align-items:center;gap:8px;padding:12px;display:flex}.sidebar-view-switcher{border:1px solid var(--border);background:var(--surface-2);border-radius:12px;flex:auto;grid-template-columns:repeat(2,minmax(0,1fr));gap:3px;padding:3px;display:grid}.sidebar-view-switcher button{min-width:0;min-height:36px;color:var(--muted);cursor:pointer;white-space:nowrap;background:0 0;border:0;border-radius:9px;justify-content:center;align-items:center;gap:6px;padding:0 8px;font-size:.7rem;font-weight:700;display:inline-flex;overflow:hidden}.sidebar-view-switcher button[aria-pressed=true]{background:var(--surface-solid);box-shadow:0 3px 10px #1e4b7a1a, inset 0 -2px 0 var(--accent);color:var(--accent-strong)}.sidebar-view-switcher button span{background:var(--accent-soft);font-variant-numeric:tabular-nums;border-radius:999px;min-width:18px;padding:2px 5px;font-size:.58rem}.sidebar-view-switcher svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px;flex:none;width:16px;height:16px}.materials-close{border-radius:12px;flex:none;width:40px;height:40px;margin:0;box-shadow:0 7px 18px #1e4b7a1f}.sidebar-pane[hidden]{display:none}.sidebar-pane:not([hidden]){overscroll-behavior-y:auto;scrollbar-gutter:stable;scrollbar-width:thin;-webkit-overflow-scrolling:touch;flex:auto;min-height:0;overflow:hidden auto}.sidebar-pane:not([hidden])::-webkit-scrollbar{width:8px}.sidebar-pane:not([hidden])::-webkit-scrollbar-thumb{background:color-mix(in srgb, var(--muted) 36%, transparent);background-clip:padding-box;border:2px solid #0000;border-radius:999px}.sidebar-favorites-pane{padding:18px 16px 22px}.sidebar-favorites-pane .style-favorites-list{overscroll-behavior-y:auto;flex:auto;overflow-y:auto}.sidebar-favorites-pane:not([hidden]){overflow:hidden}.sidebar-favorites-pane .style-favorites{height:100%}.materials-sidebar .material-library{background:0 0;border:0;min-height:0;overflow:visible}.materials-sidebar .material-library-inner{max-width:none;padding:18px 16px 22px}.materials-sidebar .material-library-header,.materials-sidebar .material-library-controls{flex-direction:column;align-items:stretch}.materials-sidebar .material-library-heading-row{width:100%}.materials-sidebar .material-library-title-group{gap:10px}.materials-sidebar .material-library-icon{border-radius:13px;width:42px;height:42px}.materials-sidebar .material-library-header h2{font-size:1.14rem}.materials-sidebar .material-library-header p{font-size:.74rem;line-height:1.45}.materials-sidebar .material-pack-link{justify-content:center;width:100%;margin:2px 0 0}.materials-sidebar .material-library-controls{gap:10px;margin-top:14px}.materials-sidebar .material-filters{grid-template-columns:repeat(2,minmax(0,1fr));width:100%;display:grid;overflow:visible}.materials-sidebar .material-filters button{justify-content:center;min-width:0}.materials-sidebar .material-browse-controls{justify-content:space-between}.materials-sidebar .material-scroll-hint{min-width:0}.materials-sidebar .material-rail{touch-action:pan-x pan-y;display:flex}.materials-sidebar .material-card{flex:0 0 calc(100% - 20px);min-width:0}.sidebar-edge-handle{z-index:28;background:color-mix(in srgb, var(--surface-solid) 94%, var(--accent-soft));width:54px;height:62px;color:var(--accent-strong);cursor:pointer;opacity:1;transform-origin:100%;visibility:visible;transition:transform .38s var(--ease-drawer-smooth) 80ms, opacity .22s var(--ease-out) .1s, border-color .15s var(--ease-out), background-color .15s var(--ease-out), box-shadow .15s var(--ease-out), visibility 0s linear 0s;border:1px solid #1769e040;border-right:0;border-radius:22px 0 0 22px;grid-template-columns:22px 14px;justify-content:start;align-items:center;gap:2px;padding:0 10px 0 8px;display:grid;position:fixed;top:clamp(280px,55vh,560px);right:-10px;transform:translateY(-50%)translate(0)scale(1);box-shadow:-8px 10px 28px #16477d2b,inset 0 1px #ffffffb8}.sidebar-edge-handle:after{background:color-mix(in srgb, var(--accent) 34%, transparent);content:"";border-radius:999px;width:3px;height:18px;position:absolute;right:10px}.sidebar-edge-handle svg{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px;width:19px;height:19px;display:block}.sidebar-edge-icon,.sidebar-edge-chevron{place-items:center;display:grid}.sidebar-edge-chevron svg{width:14px;height:14px;transform:rotate(180deg)}.workspace-shell.materials-open .sidebar-edge-handle{opacity:0;pointer-events:none;visibility:hidden;transition:transform .3s var(--ease-drawer-smooth), opacity .2s var(--ease-out), visibility 0s linear .3s;transform:translateY(-50%)translate(48px)scale(.92)}.sidebar-edge-handle:focus-visible{outline:3px solid color-mix(in srgb, var(--accent) 55%, transparent);outline-offset:3px}.sidebar-edge-handle:active{transform:translateY(-50%)translate(-2px)scale(.97)}.color-grid.palette{grid-template-columns:repeat(8,minmax(66px,1fr));gap:8px}.color-grid.palette .color-cell{background:0 0;border-color:#0000;border-radius:16px;gap:7px;min-width:0;min-height:88px;padding:10px 4px 9px}.color-grid.palette .color-selection-surface{background:color-mix(in srgb, var(--accent-soft) 76%, transparent);box-shadow:inset 0 -2px 0 color-mix(in srgb, var(--accent) 76%, transparent);border:1.5px solid #1769e03d;inset:0}.color-grid.palette .color-chip{width:34px;height:34px}.color-grid.palette .color-cell.selected .color-chip{outline:0;box-shadow:inset 0 1px #ffffff5c,0 5px 12px #1d3c5d1c}.color-grid.palette .color-cell:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.palette-favorite-button{border-radius:11px;min-height:36px;padding:0 10px;font-size:.72rem}@media (hover:hover) and (pointer:fine){.materials-toggle:hover,.materials-close:hover{background:var(--accent-soft);border-color:#1769e05c;box-shadow:0 7px 18px #1e4b7a1f}.sidebar-edge-handle:hover{background:var(--surface-solid);border-color:#1769e06b;transform:translateY(-50%)translate(-5px)scale(1);box-shadow:-11px 13px 32px #16477d36,inset 0 1px #ffffffc7}.color-grid.palette .color-cell:hover:not(.selected){background:0 0;border-color:#0000}.color-grid.palette .color-cell:hover:not(.selected) .color-chip{transform:translateY(-1px);box-shadow:inset 0 1px #ffffff5c,0 8px 17px #1d3c5d26}.color-cell:hover,.color-grid.palette .color-cell:hover:not(.selected){background:0 0;border-color:#0000}.color-cell:hover .color-chip,.color-grid.palette .color-cell:hover:not(.selected) .color-chip{transform:none}}.color-cell:active{transform:none}@media (width>=1400px){.workspace-shell{grid-template-rows:auto auto;grid-template-columns:minmax(0,1fr);display:grid}.workspace-shell .tabs-bar{grid-area:1/1}.workspace-shell .workspace-primary{grid-area:2/1}.workspace-shell .materials-backdrop,.workspace-shell .sidebar-toolbar{display:none}.workspace-shell .materials-sidebar{z-index:10;border-radius:var(--radius);background:var(--surface);width:356px;min-width:0;height:auto;box-shadow:var(--shadow);opacity:0;-webkit-backdrop-filter:blur(20px)saturate(120%);backdrop-filter:blur(20px)saturate(120%);border-color:#5880ad33;grid-area:2/1;place-self:stretch end;margin:28px 24px 89px 0;position:relative;top:auto;bottom:auto;right:auto;overflow:visible;transform:translate(32px)}.workspace-shell.materials-open .materials-sidebar{opacity:1;transform:translate(0)}.workspace-shell .sidebar-pane:not([hidden]),.workspace-shell .sidebar-favorites-pane:not([hidden]),.workspace-shell .sidebar-favorites-pane .style-favorites-list{overscroll-behavior:auto;scrollbar-gutter:auto;flex:none;overflow:visible}.workspace-shell .sidebar-favorites-pane .style-favorites{height:auto}.workspace-shell .materials-sidebar .material-library-header,.workspace-shell .sidebar-favorites-pane .style-favorites-header{padding-right:0}.workspace-shell .materials-sidebar .material-rail{grid-template-rows:repeat(2,minmax(210px,auto));grid-auto-columns:calc(100% - 20px);grid-auto-flow:column;display:grid}.workspace-shell.materials-open .workspace-primary{height:100%}.workspace-shell.materials-open .main,.workspace-shell.materials-open .tab-stage{flex-direction:column;flex:auto;min-height:0;display:flex}.workspace-shell.materials-open .editor-split,.workspace-shell.materials-open .tab-stage>.ocr-panel{flex:auto;width:100%}}@media (width>=2040px){.workspace-shell{grid-template-columns:356px minmax(0,1280px) 356px;column-gap:18px;max-width:2028px;margin:0 auto}.workspace-shell .tabs-bar{grid-column:1/-1}.workspace-shell .workspace-primary{grid-column:2}.workspace-shell .materials-sidebar{grid-column:3;justify-self:stretch;margin-right:0}}@media (width<=700px){.tabs-bar-inner{flex-wrap:wrap;align-items:stretch;padding:0 8px}.tabs-bar-inner .tabs{flex:1 0 100%;order:1}.tabs-bar-inner .history-actions{order:2;margin-left:14px}.tabs-bar-inner .editor-quick-actions{flex:auto;order:3;gap:6px;min-width:0;margin:0 8px}.tabs-bar-inner .tabs{padding-right:6px}.materials-toggle{width:44px;min-height:44px;padding:0}.sidebar-launchers{gap:5px;margin-right:14px}.topbar-sidebar-launchers{grid-area:4/1;justify-self:start;width:fit-content;margin:0}.editor-quick-actions>.btn{text-overflow:ellipsis;white-space:nowrap;flex:1 1 0;min-width:0;overflow:hidden}.editor-quick-actions .export-control{flex:100%;width:100%;min-width:0}.materials-toggle span{display:none}.editor-quick-actions .reset-preset-action{padding-inline:9px}.favorites-toggle strong{min-width:17px;height:17px;box-shadow:0 0 0 2px color-mix(in srgb, var(--surface-solid) 90%, transparent);padding:0 4px;position:absolute;top:-4px;right:-4px}.materials-sidebar{border-radius:22px 0 0 22px;width:min(390px,100vw - 12px);top:0;bottom:0;right:0}.sidebar-edge-handle{top:42vh;right:-6px}.materials-sidebar .material-library-inner{padding:16px 14px 22px}.materials-sidebar .material-pack-link{width:100%;margin-left:0}.materials-sidebar .material-card{flex-basis:calc(100% - 16px)}.picker-header{flex-direction:column;align-items:stretch}.picker-header-actions{flex-wrap:wrap;justify-content:flex-start;width:100%;min-width:0}.picker-header-actions .picker-swatch-lg{margin-left:auto}}@media (width<=480px){.tabs-bar-inner{column-gap:0}.tabs-bar-inner .tabs{flex:calc(100% - 100px);width:auto;min-width:0;max-width:calc(100% - 100px);padding-left:0;padding-right:4px;display:flex;overflow-x:hidden}.tabs-bar-inner .history-actions{flex:none;order:1;margin:0 0 0 4px}.tabs-bar-inner .tab{flex:none;width:auto;min-width:42px;padding-inline:9px}.tabs-bar-inner .tab:not(.active)>span:not(.tab-active-surface){display:none}.tabs-bar-inner .editor-quick-actions{flex-basis:100%;margin-inline:0}.tabs-bar-inner .history-actions{margin-left:8px}.tabs-bar-inner .editor-quick-actions{margin-inline:8px}.editor-quick-actions>.btn,.export-submit,.export-scope-options button{font-size:.65rem}.editor-quick-actions>.btn{padding-inline:7px}}@media (width<=1399px){.sidebar-pane:not([hidden]),.sidebar-favorites-pane .style-favorites-list{overscroll-behavior-y:contain}}@media (prefers-color-scheme:dark){.materials-sidebar{background:color-mix(in srgb, var(--surface-solid) 96%, #07111f);border-color:#8bb6e52e;box-shadow:0 30px 90px #00000075}}@media (prefers-reduced-motion:reduce){.workspace-shell,.workspace-shell.materials-open,.materials-sidebar,.workspace-shell.materials-open .materials-sidebar,.materials-backdrop,.materials-toggle,.sidebar-edge-handle,.workspace-shell.materials-open .sidebar-edge-handle{transition:none}.color-grid.palette .color-cell:hover .color-chip,.color-grid.palette .color-cell:hover:not(.selected) .color-chip{transform:none}}@media (width>=1400px){.workspace-shell{max-width:none;margin:0;display:block}.workspace-shell .materials-sidebar{z-index:40;border-radius:var(--radius);background:var(--surface);width:356px;height:auto;min-height:0;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(20px)saturate(120%);backdrop-filter:blur(20px)saturate(120%);border-color:#5880ad33;margin:0;position:absolute;top:76px;bottom:auto;right:24px;overflow:visible}.workspace-shell.materials-open .workspace-primary{height:auto;min-height:0}}
