:root{--bg: 0 0% 0%;--surface: 0 0% 4%;--surface-2: 0 0% 6.5%;--elevated: 0 0% 9%;--hover: 0 0% 11%;--border: 0 0% 15%;--border-strong: 0 0% 24%;--text: 0 0% 93%;--text-2: 0 0% 63%;--text-3: 0 0% 44%;--accent: 212 100% 48%;--accent-hover: 212 100% 58%;--accent-wash: 212 100% 48%;--success: 165 72% 46%;--danger: 358 75% 59%;--handle: 28 100% 60%;--scroll-thumb: 0 0% 20%;--scroll-thumb-hover: 0 0% 32%;--radius: 10px;--radius-md: 8px;--radius-sm: 6px;--shadow-md: 0 4px 12px hsl(0 0% 0% / .6);--shadow-lg: 0 12px 32px hsl(0 0% 0% / .7);--shadow-xl: 0 24px 56px hsl(0 0% 0% / .8);--ease: cubic-bezier(.4, 0, .2, 1);--fast: .13s;--normal: .2s;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:14px;line-height:1.5;color-scheme:dark;-webkit-font-smoothing:antialiased;font-feature-settings:"cv02","cv03","cv04","ss01"}*,*:before,*:after{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:hsl(var(--bg));color:hsl(var(--text))}.app{user-select:none;-webkit-user-select:none}input,textarea,select,.code,.tester-stage,[contenteditable]{user-select:text;-webkit-user-select:text}h2,h3{margin:0;font-weight:500;letter-spacing:-.01em}h2{font-size:13px}h3{font-size:16px}p{margin:0}*{scrollbar-width:thin;scrollbar-color:hsl(var(--scroll-thumb)) transparent}*::-webkit-scrollbar{width:10px;height:10px}*::-webkit-scrollbar-track,*::-webkit-scrollbar-corner{background:transparent}*::-webkit-scrollbar-thumb{background-color:hsl(var(--scroll-thumb));background-clip:content-box;border:3px solid transparent;border-radius:999px;transition:background-color var(--fast) var(--ease)}*::-webkit-scrollbar-thumb:hover{background-color:hsl(var(--scroll-thumb-hover));background-clip:content-box}kbd{display:inline-block;min-width:18px;padding:1px 5px;border:1px solid hsl(var(--border));border-radius:4px;background:hsl(var(--elevated));color:hsl(var(--text-2));font:500 11px/1.4 ui-monospace,SFMono-Regular,monospace;text-align:center}.app{display:flex;flex-direction:column;height:100%;overflow:hidden}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:32px;padding:0 12px;border:1px solid hsl(var(--border));border-radius:var(--radius-sm);background:hsl(var(--bg));color:hsl(var(--text));font-family:inherit;font-size:13px;font-weight:500;white-space:nowrap;cursor:pointer;transition:background-color var(--fast) var(--ease),border-color var(--fast) var(--ease),color var(--fast) var(--ease),opacity var(--fast) var(--ease)}.btn:hover:not(:disabled){border-color:hsl(var(--border-strong));background:hsl(var(--surface-2))}.btn:focus-visible,.tab:focus-visible,.crumb-btn:focus-visible,.segmented button:focus-visible,.glyph-cell:focus-visible,.master-pick:focus-visible,.tbtn:focus-visible,.chip:focus-visible,.zoom-value:focus-visible,.menu-items button:focus-visible,.cell-remove:focus-visible{outline:2px solid hsl(var(--accent));outline-offset:2px}.btn:disabled{opacity:.4;cursor:not-allowed}.btn.primary{background:hsl(var(--text));border-color:hsl(var(--text));color:hsl(var(--bg));font-weight:500}.btn.primary:hover:not(:disabled){background:#fff;border-color:#fff}.btn.ghost{background:transparent;border-color:transparent;color:hsl(var(--text-2))}.btn.ghost:hover:not(:disabled){background:hsl(var(--elevated));border-color:transparent;color:hsl(var(--text))}.btn.icon{width:30px;height:30px;padding:0}.btn.wide{width:100%}.btn.danger:hover:not(:disabled){border-color:hsl(var(--danger) / .5);background:hsl(var(--danger) / .1);color:hsl(var(--danger))}.input{width:100%;min-width:0;height:32px;padding:0 10px;border:1px solid hsl(var(--border));border-radius:var(--radius-sm);background:hsl(var(--bg));color:hsl(var(--text));font-family:inherit;font-size:13px;transition:border-color var(--fast) var(--ease),box-shadow var(--fast) var(--ease)}.input::placeholder{color:hsl(var(--text-3))}.input:hover:not(:disabled):not(:focus){border-color:hsl(var(--border-strong))}.input:focus{outline:none;border-color:hsl(var(--text-2));box-shadow:0 0 0 3px #ffffff0f}.input:disabled{background:hsl(var(--surface));color:hsl(var(--text-3));cursor:not-allowed}.input.num{width:88px;text-align:right;font-variant-numeric:tabular-nums}select.input{cursor:pointer}input[type=range]{height:4px;accent-color:hsl(var(--text));cursor:pointer}input[type=checkbox]{width:15px;height:15px;accent-color:hsl(var(--accent));cursor:pointer}.toggle{display:inline-flex;align-items:center;gap:8px;color:hsl(var(--text-2));font-size:13px;cursor:pointer;-webkit-user-select:none;user-select:none}.row{display:flex;align-items:center;gap:8px}.grow{flex:1}.note{color:hsl(var(--text-3));font-size:12px;line-height:1.55}.note.ok{color:hsl(var(--success))}.note.danger,.error{color:hsl(var(--danger))}.pad{padding:8px 2px}.count{color:hsl(var(--text-3));font-size:11px;font-variant-numeric:tabular-nums;letter-spacing:0}.chip{display:inline-flex;align-items:center;height:18px;padding:0 6px;border:1px solid hsl(var(--border));border-radius:999px;background:hsl(var(--elevated));color:hsl(var(--text-2));font-size:10px;font-variant-numeric:tabular-nums}.spinner{width:20px;height:20px;border:2px solid hsl(var(--border));border-top-color:hsl(var(--text));border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;height:100%;color:hsl(var(--text-3))}.topbar{display:flex;flex-direction:column;flex:0 0 auto;background:hsl(var(--bg));border-bottom:1px solid hsl(var(--border));z-index:30}.topbar-row{display:flex;align-items:center;gap:10px;height:56px;padding:0 16px}.crumbs{display:flex;align-items:center;gap:6px;min-width:0}.logo{display:grid;place-items:center;width:28px;height:28px;color:hsl(var(--text))}.slash{color:hsl(var(--border-strong));font-size:16px;-webkit-user-select:none;user-select:none}.crumb-btn{display:inline-flex;align-items:center;gap:7px;height:30px;padding:0 9px;border:1px solid transparent;border-radius:var(--radius-sm);background:transparent;color:hsl(var(--text));font-family:inherit;font-size:13px;font-weight:500;cursor:pointer;transition:background-color var(--fast) var(--ease)}.crumb-btn:hover{background:hsl(var(--elevated))}.tabbar{display:flex;align-items:center;gap:2px;height:44px;padding:0 12px}.tab{position:relative;height:100%;padding:0 12px;border:none;background:transparent;color:hsl(var(--text-2));font-family:inherit;font-size:13px;font-weight:500;cursor:pointer;transition:color var(--fast) var(--ease)}.tab:before{content:"";position:absolute;top:6px;right:4px;bottom:6px;left:4px;border-radius:var(--radius-sm);background:transparent;transition:background-color var(--fast) var(--ease);z-index:-1}.tab:hover{color:hsl(var(--text))}.tab:hover:before{background:hsl(var(--elevated))}.tab:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:transparent;transition:background-color var(--fast) var(--ease)}.tab.active{color:hsl(var(--text))}.tab.active:after{background:hsl(var(--text))}.meta{padding-right:6px;color:hsl(var(--text-3));font-size:12px;white-space:nowrap}.menu{position:relative}.menu-items{position:absolute;left:0;top:calc(100% + 6px);z-index:50;display:flex;flex-direction:column;gap:1px;min-width:250px;padding:5px;border:1px solid hsl(var(--border));border-radius:var(--radius-md);background:hsl(var(--surface-2));box-shadow:var(--shadow-lg);animation:pop var(--fast) var(--ease)}.menu-items.right{left:auto;right:0}@keyframes pop{0%{opacity:0;transform:translateY(-4px)}}.menu-items button{display:flex;align-items:center;gap:8px;height:32px;padding:0 9px;border:none;border-radius:5px;background:transparent;color:hsl(var(--text-2));font-family:inherit;font-size:13px;text-align:left;cursor:pointer;transition:background-color var(--fast) var(--ease),color var(--fast) var(--ease)}.menu-items button:hover{background:hsl(var(--hover));color:hsl(var(--text))}.menu-items button.on{background:hsl(var(--elevated));color:hsl(var(--text))}.menu-items button.danger{color:hsl(var(--danger))}.menu-items button.danger:hover{background:hsl(var(--danger) / .12);color:hsl(var(--danger))}.menu-label{padding:6px 9px 4px;color:hsl(var(--text-3));font-size:11px;font-weight:500;letter-spacing:.04em;text-transform:uppercase}.menu-sep{height:1px;margin:5px -5px;background:hsl(var(--border))}.split{display:flex}.split>.btn.primary{border-radius:var(--radius-sm) 0 0 var(--radius-sm)}.split-caret{display:grid;place-items:center;width:26px;height:32px;padding:0;border-radius:0 var(--radius-sm) var(--radius-sm) 0;border-left:1px solid hsl(0 0% 0% / .18);font-size:11px}.workspace{display:grid;grid-template-columns:336px minmax(0,1fr) 304px;flex:1;min-height:0;background:hsl(var(--bg))}.canvas-col{position:relative;min-width:0}.sidebar{display:flex;flex-direction:column;min-height:0;background:hsl(var(--bg))}.sidebar.left{border-right:1px solid hsl(var(--border))}.sidebar.right{border-left:1px solid hsl(var(--border))}.sidebar-head{display:flex;flex-direction:column;gap:12px;flex:0 0 auto;padding:14px;border-bottom:1px solid hsl(var(--border))}.sidebar-scroll{flex:1;min-height:0;padding:14px;overflow-y:auto;overscroll-behavior:contain}.sidebar-scroll.cards{display:flex;flex-direction:column;gap:12px}.current-char{display:flex;align-items:center;gap:12px}.current-glyph{display:grid;place-items:center;flex:0 0 auto;width:44px;height:44px;border:1px solid hsl(var(--border));border-radius:var(--radius-md);background:hsl(var(--surface-2));color:hsl(var(--text));font-size:22px;line-height:1}.current-meta{display:flex;flex-direction:column;gap:1px;min-width:0}.current-meta strong{font-size:13px;font-weight:500}.char-group+.char-group{margin-top:20px}.group-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;color:hsl(var(--text-3));font-size:11px;font-weight:500;letter-spacing:.05em;text-transform:uppercase}.segmented{display:inline-flex;gap:2px;padding:3px;border:1px solid hsl(var(--border));border-radius:var(--radius-sm);background:hsl(var(--surface))}.segmented button{height:24px;padding:0 10px;border:none;border-radius:4px;background:transparent;color:hsl(var(--text-3));font-family:inherit;font-size:12px;font-weight:500;cursor:pointer;transition:background-color var(--fast) var(--ease),color var(--fast) var(--ease)}.segmented button:hover{color:hsl(var(--text))}.segmented button.active{background:hsl(var(--elevated));color:hsl(var(--text))}.segmented.full{display:flex;width:100%}.segmented.full button{flex:1}.glyph-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:5px}.span-all{grid-column:1 / -1}.cell-wrap{position:relative;aspect-ratio:1}.glyph-cell{position:relative;display:flex;align-items:center;justify-content:center;width:100%;height:100%;padding:5px;border:1px solid hsl(var(--border));border-radius:var(--radius-sm);background:hsl(var(--surface));cursor:pointer;transition:border-color var(--fast) var(--ease),background-color var(--fast) var(--ease)}.glyph-cell:hover{border-color:hsl(var(--border-strong));background:hsl(var(--elevated))}.glyph-cell.active{border-color:hsl(var(--text-2));background:hsl(var(--elevated))}.glyph-cell .thumb{width:100%;height:100%}.glyph-cell .thumb path{fill:hsl(var(--text))}.glyph-cell.empty{border-style:dashed;background:transparent}.ghost-char{color:hsl(var(--text-3) / .7);font-size:16px}.cell-label{position:absolute;left:4px;bottom:2px;color:hsl(var(--text-3));font-size:9px;pointer-events:none}.cell-remove{position:absolute;top:2px;right:2px;display:none;place-items:center;padding:3px;border:1px solid hsl(var(--border));border-radius:5px;background:hsl(var(--surface-2));color:hsl(var(--text-3));cursor:pointer;transition:color var(--fast) var(--ease),border-color var(--fast) var(--ease)}.cell-wrap:hover .cell-remove,.cell-remove:focus-visible{display:grid}.cell-remove:hover{border-color:hsl(var(--danger) / .5);color:hsl(var(--danger))}.card{display:flex;flex-direction:column;border:1px solid hsl(var(--border));border-radius:var(--radius-md);background:hsl(var(--surface));overflow:hidden}.card-head{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:40px;padding:0 6px 0 12px;border-bottom:1px solid hsl(var(--border));background:hsl(var(--surface-2))}.card-body{display:flex;flex-direction:column;gap:12px;padding:12px}.inset{display:flex;flex-direction:column;gap:10px;padding:11px;border:1px solid hsl(var(--border));border-radius:var(--radius-sm);background:hsl(var(--bg))}.divide{height:1px;margin:2px 0;background:hsl(var(--border))}.fields{display:flex;flex-direction:column;gap:9px}.field{display:flex;align-items:center;justify-content:space-between;gap:12px}.field.stack{flex-direction:column;align-items:stretch;gap:6px}.field>span{color:hsl(var(--text-2));font-size:13px;white-space:nowrap}.master-list{display:flex;flex-direction:column;gap:3px}.master-row{display:flex;align-items:center;gap:3px}.master-pick{display:flex;flex:1;align-items:center;justify-content:space-between;height:34px;padding:0 11px;border:1px solid transparent;border-radius:var(--radius-sm);background:transparent;color:hsl(var(--text-2));font-family:inherit;font-size:13px;cursor:pointer;transition:background-color var(--fast) var(--ease),color var(--fast) var(--ease)}.master-pick:hover{background:hsl(var(--elevated));color:hsl(var(--text))}.master-row.active .master-pick{border-color:hsl(var(--border-strong));background:hsl(var(--elevated));color:hsl(var(--text));font-weight:500}.master-weight{color:hsl(var(--text-3));font-size:12px;font-variant-numeric:tabular-nums}.sample-box{display:flex;align-items:center;min-height:62px;padding:10px 12px;border:1px solid hsl(var(--border));border-radius:var(--radius-sm);background:hsl(var(--bg));color:hsl(var(--text));font-size:32px;line-height:1.25;white-space:nowrap;overflow-x:auto}.canvas-wrap{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;background:hsl(var(--bg))}.canvas{display:block;touch-action:none}.canvas.tool-pen,.canvas.tool-rect,.canvas.tool-ellipse{cursor:crosshair}.grid{stroke:#1c1c1c;stroke-width:1}.metric{stroke:#383838;stroke-width:1;stroke-dasharray:3 4}.metric.baseline{stroke:#616161;stroke-dasharray:none}.metric.sidebearing,.metric.advance{stroke:#474747;stroke-dasharray:none}.metric-label{fill:#6b6b6b;font-size:10px;-webkit-user-select:none;user-select:none}.glyph-fill{fill:hsl(var(--text));fill-opacity:.16;fill-rule:nonzero}.glyph-stroke{fill:none;stroke:hsl(var(--text));stroke-width:1.5}.node{fill:hsl(var(--bg));stroke:hsl(var(--accent-hover));stroke-width:1.5}.node.selected{fill:hsl(var(--accent-hover))}.handle{fill:hsl(var(--handle));stroke:hsl(var(--bg));stroke-width:1}.handle-line{stroke:hsl(var(--handle));stroke-width:1;stroke-opacity:.6}.pen-hint{fill:hsl(var(--bg));stroke:hsl(var(--accent-hover));stroke-width:1.5}.add-hint circle{fill:hsl(var(--accent-hover));stroke:hsl(var(--bg));stroke-width:1.5}.add-hint path{stroke:#fff;stroke-width:1.6;stroke-linecap:round}.marquee{fill:hsl(var(--accent) / .12);stroke:hsl(var(--accent-hover));stroke-width:1}.canvas-empty{position:absolute;top:20px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:10px;padding:9px 14px;border:1px solid hsl(var(--border));border-radius:999px;background:hsl(var(--surface-2));box-shadow:var(--shadow-md);white-space:nowrap;pointer-events:none}.canvas-empty strong{font-size:13px;font-weight:500}.canvas-empty span{color:hsl(var(--text-3));font-size:12px}.drop-veil{position:absolute;top:14px;right:14px;bottom:14px;left:14px;z-index:25;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;border:1px dashed hsl(var(--accent-hover));border-radius:12px;background:hsl(var(--accent) / .07);pointer-events:none}.drop-veil strong{font-size:15px}.drop-veil span{color:hsl(var(--text-2));font-size:13px}.toolbar-float{position:absolute;left:50%;bottom:18px;z-index:20;display:flex;flex-direction:column;align-items:center;gap:9px;transform:translate(-50%);pointer-events:none}.toolbar-pill{display:flex;align-items:center;gap:3px;padding:6px;border:1px solid hsl(var(--border));border-radius:12px;background:hsl(var(--surface-2));box-shadow:var(--shadow-xl);pointer-events:auto}.tbtn{position:relative;display:grid;place-items:center;width:36px;height:36px;border:none;border-radius:8px;background:transparent;color:hsl(var(--text-2));font-family:inherit;font-size:15px;cursor:pointer;transition:background-color var(--fast) var(--ease),color var(--fast) var(--ease)}.tbtn:hover:not(:disabled){background:hsl(var(--hover));color:hsl(var(--text))}.tbtn.active{background:hsl(var(--text));color:hsl(var(--bg))}.tbtn:disabled{opacity:.3;cursor:not-allowed}.pill-divider{width:1px;height:20px;margin:0 5px;background:hsl(var(--border))}.tip{position:absolute;bottom:calc(100% + 9px);left:50%;transform:translate(-50%);display:none;align-items:center;gap:5px;padding:5px 8px;border:1px solid hsl(var(--border));border-radius:var(--radius-sm);background:hsl(var(--elevated));box-shadow:var(--shadow-md);color:hsl(var(--text));font-size:12px;white-space:nowrap;pointer-events:none}.tbtn:hover .tip,.tbtn:focus-visible .tip{display:flex}.view-pill{position:absolute;right:18px;bottom:18px;z-index:20;display:flex;align-items:center;gap:2px;padding:5px;border:1px solid hsl(var(--border));border-radius:10px;background:hsl(var(--surface-2));box-shadow:var(--shadow-md)}.tbtn.sm{width:28px;height:28px;border-radius:6px}.tbtn.sm.on{background:hsl(var(--hover));color:hsl(var(--text));box-shadow:inset 0 0 0 1px hsl(var(--border-strong))}.zoom-value{min-width:50px;height:28px;padding:0 6px;border:none;border-radius:6px;background:transparent;color:hsl(var(--text-2));font-family:inherit;font-size:12px;font-variant-numeric:tabular-nums;cursor:pointer;transition:background-color var(--fast) var(--ease)}.zoom-value:hover{background:hsl(var(--hover));color:hsl(var(--text))}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:grid;place-items:center;padding:24px;background:#000000b3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:fade var(--fast) var(--ease)}.overlay.solid{background:hsl(var(--bg) / .85)}@keyframes fade{0%{opacity:0}}.busy-card{display:flex;flex-direction:column;align-items:center;gap:14px;padding:26px 34px;border:1px solid hsl(var(--border));border-radius:var(--radius);background:hsl(var(--surface-2));color:hsl(var(--text-2))}.dialog{display:flex;flex-direction:column;width:min(720px,100%);max-height:min(660px,90vh);border:1px solid hsl(var(--border));border-radius:12px;background:hsl(var(--surface));box-shadow:var(--shadow-xl);overflow:hidden;animation:rise-in var(--normal) var(--ease)}@keyframes rise-in{0%{opacity:0;transform:translateY(8px) scale(.99)}}.dialog-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:18px 18px 14px;border-bottom:1px solid hsl(var(--border))}.dialog-head .note{margin-top:4px}.dialog-body{display:flex;flex-direction:column;gap:16px;padding:18px;overflow-y:auto}.dialog-controls{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap}.dialog-controls .field{flex-direction:column;align-items:flex-start;gap:6px}.dialog-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 18px;border-top:1px solid hsl(var(--border));background:hsl(var(--surface-2))}.glyph-grid.picker{grid-template-columns:repeat(8,1fr)}.toast{position:fixed;left:50%;bottom:100px;z-index:200;max-width:90vw;padding:11px 16px;border:1px solid hsl(var(--border));border-radius:var(--radius-md);background:hsl(var(--elevated));box-shadow:var(--shadow-lg);color:hsl(var(--text));font-size:13px;cursor:pointer;transform:translate(-50%);animation:toast-in var(--normal) var(--ease)}@keyframes toast-in{0%{opacity:0;transform:translate(-50%,8px)}}.tester{display:flex;flex:1;min-height:0;background:hsl(var(--bg))}.tester-controls{display:flex;flex-direction:column;gap:22px;flex:0 0 280px;width:280px;padding:18px;border-right:1px solid hsl(var(--border));overflow-y:auto;overscroll-behavior:contain}.group{display:flex;flex-direction:column;gap:9px}.group-title{color:hsl(var(--text-3));font-size:11px;font-weight:500;letter-spacing:.05em;text-transform:uppercase}.slider-row{display:flex;align-items:center;gap:12px}.slider-row input[type=range]{flex:1;min-width:0}.slider-row .value{width:62px;color:hsl(var(--text-2));font-size:12px;font-variant-numeric:tabular-nums;text-align:right}.chips{display:flex;flex-wrap:wrap;gap:5px}.chips .chip{height:30px;min-width:30px;padding:0 8px;border-radius:var(--radius-sm);background:hsl(var(--surface));color:hsl(var(--text));font-size:14px;cursor:pointer;transition:border-color var(--fast) var(--ease),color var(--fast) var(--ease)}.chips .chip:hover{border-color:hsl(var(--accent-hover));color:hsl(var(--accent-hover))}.chips .chip.absent{border-style:dashed}.tester-stage{display:flex;flex-direction:column;flex:1;min-width:0;padding:26px 30px;overflow:auto;overscroll-behavior:contain}.tester.invert .tester-stage{background:#fff;color:#000}.stage-hint{margin-bottom:12px;color:hsl(var(--text-3));font-size:12px}.tester.invert .stage-hint{color:#737373}.tester-input{flex:1;width:100%;min-height:300px;padding:22px;border:1px solid hsl(var(--border));border-radius:var(--radius);background:hsl(var(--surface));color:inherit;font-family:inherit;resize:none;transition:border-color var(--fast) var(--ease)}.tester-input:focus{outline:none;border-color:hsl(var(--text-2))}.tester.invert .tester-input{background:#fff;border-color:#e5e5e5}.tester.invert .waterfall-row,.tester.invert .compare-row{border-color:#e5e5e5}.tester.invert .waterfall-size,.tester.invert .compare-label{color:#737373}.waterfall,.compare{display:flex;flex-direction:column;gap:18px}.waterfall-row,.compare-row{display:flex;align-items:baseline;gap:20px;padding-bottom:18px;border-bottom:1px solid hsl(var(--border))}.waterfall-size,.compare-label{flex:0 0 92px;color:hsl(var(--text-3));font-size:12px;font-variant-numeric:tabular-nums}.waterfall-text,.compare-text{flex:1;min-width:0;overflow-x:auto;white-space:nowrap;line-height:1.25}.minimap{position:absolute;top:16px;right:16px;z-index:20;width:208px;border:1px solid hsl(var(--border));border-radius:10px;background:hsl(var(--surface-2) / .92);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:var(--shadow-md);overflow:hidden}.minimap-head{display:flex;align-items:center;justify-content:space-between;gap:6px;height:34px;padding:0 4px 0 11px;border-bottom:1px solid hsl(var(--border))}.minimap.collapsed .minimap-head{border-bottom:none}.minimap-title{color:hsl(var(--text-3));font-size:11px;letter-spacing:.04em;text-transform:uppercase}.minimap-title strong{color:hsl(var(--text));font-weight:500;text-transform:none;letter-spacing:0}.minimap-body{display:flex;flex-direction:column;gap:10px;padding:12px}.minimap-sizes{display:flex;flex-direction:column;gap:10px}.minimap-row{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;min-height:18px}.minimap-glyph path{fill:hsl(var(--text))}.minimap-size{flex:0 0 auto;color:hsl(var(--text-3));font-size:10px;font-variant-numeric:tabular-nums}.minimap-meta{display:flex;justify-content:space-between;gap:6px;padding-top:9px;border-top:1px solid hsl(var(--border));color:hsl(var(--text-3));font-size:10px;font-variant-numeric:tabular-nums}.bool-bar{--bool-bg: hsl(0 0% 6.5%);position:absolute;top:16px;left:50%;z-index:20;display:flex;align-items:center;gap:2px;padding:5px 5px 5px 10px;border:1px solid hsl(var(--border));border-radius:10px;background:hsl(var(--surface-2));box-shadow:var(--shadow-lg);transform:translate(-50%);animation:pop var(--fast) var(--ease)}.bool-count{color:hsl(var(--text-3));font-size:11px;font-variant-numeric:tabular-nums;white-space:nowrap}.bool-bar .tbtn{width:32px;height:32px}.tip-hint{display:block;margin-top:2px;color:hsl(var(--text-3));font-size:11px}.tip{flex-direction:column;align-items:flex-start;max-width:190px;white-space:normal;text-align:left}.dialog.narrow{width:min(460px,100%)}.opt-list{display:flex;flex-direction:column;gap:6px}.opt{display:flex;align-items:flex-start;gap:10px;padding:11px 12px;border:1px solid hsl(var(--border));border-radius:var(--radius-sm);background:hsl(var(--bg));cursor:pointer;transition:border-color var(--fast) var(--ease),background-color var(--fast) var(--ease)}.opt:hover{border-color:hsl(var(--border-strong))}.opt.on{border-color:hsl(var(--text-2));background:hsl(var(--surface-2))}.opt input{margin-top:2px;flex:0 0 auto}.opt-text{display:flex;flex-direction:column;gap:2px;min-width:0}.opt-text strong{font-size:13px;font-weight:500}.code{max-height:168px;margin:0;padding:12px;border:1px solid hsl(var(--border));border-radius:var(--radius-sm);background:hsl(var(--bg));color:hsl(var(--text-2));font:12px/1.55 ui-monospace,SFMono-Regular,monospace;overflow:auto;white-space:pre}.slider-label{flex:0 0 82px;color:hsl(var(--text-2));font-size:12px}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
