/*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--spacing:.25rem;--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before{box-sizing:border-box;border:0 solid;margin:0;padding:0}::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){-webkit-appearance:button;appearance:button}::file-selector-button{-webkit-appearance:button;appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.fixed{position:fixed}.start{inset-inline-start:var(--spacing)}.end{inset-inline-end:var(--spacing)}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.block{display:block}.contents{display:contents}.hidden{display:none}.table{display:table}.resize{resize:both}.text-wrap{text-wrap:wrap}}:root{--ink:#191a18;--muted:#70736d;--paper:#f4f2ec;--panel:#fbfaf6;--line:#d8d5cc;--accent:#ff5c35;--accent-dark:#d74220}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:var(--paper);color:var(--ink);margin:0;font-family:Pretendard,Apple SD Gothic Neo,Noto Sans KR,sans-serif}button,input,textarea{font:inherit}button{color:inherit}main{width:min(1440px,100%);min-height:100vh;margin:0 auto;padding:0 40px}.site-header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;height:82px;display:flex}.brand{color:var(--ink);letter-spacing:-.01em;align-items:center;gap:11px;font-size:14px;font-weight:760;text-decoration:none;display:inline-flex}.brand-mark{background:var(--accent);color:#fff;border-radius:50%;place-items:center;width:28px;height:28px;font-size:13px;font-weight:850;display:grid}.site-header>p,footer p{color:var(--muted);letter-spacing:.02em;margin:0;font-size:12px}.intro{grid-template-columns:minmax(0,1.25fr) minmax(260px,.75fr);align-items:end;gap:48px;padding:50px 0 44px;display:grid}.intro h1{letter-spacing:-.065em;word-break:keep-all;margin:0;font-size:clamp(40px,4.3vw,64px);font-weight:820;line-height:.98}.intro p{color:var(--muted);word-break:keep-all;margin:0 0 4px;font-size:15px;line-height:1.75}.lab{border-top:1px solid var(--ink);border-bottom:1px solid var(--line);flex-direction:column;display:flex}.controls{border-top:1px solid var(--ink);grid-template-columns:minmax(0,1fr);gap:18px;padding:28px 0 30px;display:grid}.control-heading,.field-row,.preview-meta,.code-strip,footer{justify-content:space-between;align-items:center;display:flex}.control-heading{margin-bottom:-2px}.control-heading h2{letter-spacing:-.03em;margin:0;font-size:17px}.text-control{min-width:0}.field{display:block}.text-field>span,.field-row>label{color:#474943;font-size:12px;font-weight:700}textarea{resize:vertical;border:1px solid var(--line);background:var(--panel);width:100%;color:var(--ink);border-radius:3px;outline:none;margin-top:10px;padding:13px 14px;font-size:14px;line-height:1.55;transition:border-color .14s,background-color .14s}textarea:focus{border-color:var(--ink);background:#fff}.samples{gap:6px;margin:9px 0 0;display:flex}.samples button{border:1px solid var(--line);color:var(--muted);cursor:pointer;background:0 0;border-radius:999px;padding:6px 9px;font-size:11px;transition:color .14s,border-color .14s,background-color .14s}.samples button:hover{color:var(--ink);background:#fff9;border-color:#aaa79e}.number-input{border-bottom:1px solid var(--line);align-items:center;gap:3px;padding:4px 7px 4px 5px;display:flex}.number-input input{text-align:right;font-variant-numeric:tabular-nums;-webkit-appearance:textfield;appearance:textfield;background:0 0;border:0;outline:0;width:45px;padding:0;font-size:12px}.number-input input::-webkit-inner-spin-button{-webkit-appearance:none;appearance:none}.number-input span{color:var(--muted);font-size:11px}.range{--fill:50%;-webkit-appearance:none;appearance:none;cursor:pointer;background:0 0;width:100%;height:18px;margin:15px 0 0}.range::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--accent) var(--fill), #cfcdc5 var(--fill));height:2px}.range::-moz-range-track{background:#cfcdc5;height:2px}.range::-moz-range-progress{background:var(--accent);height:2px}.range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;border:4px solid var(--paper);background:var(--accent);width:16px;height:16px;box-shadow:0 0 0 1px var(--accent);border-radius:50%;margin-top:-7px}.range::-moz-range-thumb{border:4px solid var(--paper);background:var(--accent);width:9px;height:9px;box-shadow:0 0 0 1px var(--accent);border-radius:50%}.range:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 3px #ff5c3540}.range-ends{color:#999b95;justify-content:space-between;font-size:10px;display:flex}.hint{border-top:1px solid var(--line);color:var(--muted);word-break:keep-all;margin:0;padding-top:16px;font-size:11px;line-height:1.65}.preview-panel{grid-template-rows:54px auto auto 54px;min-width:0;display:grid}.preview-meta{border-bottom:1px solid var(--line);color:var(--muted);font-size:11px}.preview-meta span:first-child{color:var(--ink);font-weight:700}.preview-actions{align-items:center;gap:14px;display:flex}.preview-actions>span{font-variant-numeric:tabular-nums}.code-toggle{border:1px solid var(--line);min-height:30px;color:var(--ink);cursor:pointer;background:0 0;border-radius:999px;align-items:center;gap:6px;padding:5px 10px;font-size:10px;font-weight:720;transition:color .14s,background-color .14s,border-color .14s;display:inline-flex}.code-toggle:hover,.code-toggle.is-open{border-color:var(--ink);background:var(--ink);color:var(--paper)}.code-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.code-panel button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.code-panel pre:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.preview-shell{min-width:0;min-height:0}.preview-workspace{min-width:0;min-height:0;position:relative;overflow:hidden}.preview-tuning{border-bottom:1px solid var(--line);background:#fbfaf68a;grid-template-columns:repeat(2,minmax(0,1fr));gap:42px;padding:20px 28px 18px;display:grid}.comparison-stage{background-image:radial-gradient(circle,#d6d3ca .65px,#0000 .75px);background-size:16px 16px;min-width:0;display:grid;overflow:hidden}.comparison-stage.is-horizontal{grid-template-columns:minmax(0,1fr) 72px minmax(0,1fr);min-height:480px;animation:.3s cubic-bezier(.22,1,.36,1) both comparison-horizontal-in}.comparison-stage.is-stacked{grid-template-rows:auto 58px auto;grid-template-columns:minmax(0,1fr);animation:.3s cubic-bezier(.22,1,.36,1) both comparison-stacked-in}.comparison-side{grid-template-rows:52px minmax(350px,1fr);min-width:0;transition:opacity .26s,transform .26s;display:grid}.comparison-stage.is-horizontal .before-side{border-right:1px solid #191a181a}.comparison-stage.is-horizontal .after-side{border-left:1px solid #191a181a}.comparison-stage.is-stacked .comparison-side{grid-template-rows:48px minmax(300px,auto)}.comparison-stage.is-stacked .before-side{border-bottom:1px solid #191a181a}.comparison-stage.is-stacked .after-side{border-top:1px solid #191a181a}.comparison-label{color:var(--muted);letter-spacing:.02em;justify-content:space-between;align-items:center;gap:12px;padding:0 20px;font-size:10px;display:flex}.comparison-label strong{color:var(--ink);letter-spacing:-.02em;font-size:12px}.comparison-label-options,.native-balance-option{align-items:center;display:flex}.comparison-label-options{gap:12px}.native-balance-option{color:var(--ink);cursor:pointer;gap:5px}.native-balance-option input{width:13px;height:13px;accent-color:var(--accent);cursor:pointer;margin:0}.native-balance-option span{font-family:SFMono-Regular,Consolas,monospace;font-size:9px}.after-side .comparison-label strong{color:var(--accent-dark)}.comparison-canvas{place-items:center;min-width:0;padding:48px 20px 62px;display:grid;overflow:hidden}.comparison-arrow{color:var(--accent);place-items:center;display:grid}.comparison-arrow svg{width:44px;height:22px;transition:transform .28s cubic-bezier(.22,1,.36,1);overflow:visible}.comparison-arrow path{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.8px}.comparison-stage.is-stacked .comparison-arrow svg{transform:rotate(90deg)}@keyframes comparison-horizontal-in{0%{opacity:.75;transform:translateY(8px)}}@keyframes comparison-stacked-in{0%{opacity:.75;transform:translateY(-8px)}}.width-guide{border-left:1px dashed #191a1852;border-right:1px dashed #191a1852;min-width:0;padding:36px 0;position:relative}.width-guide:before{content:"";border-top:1px solid #191a1838;position:absolute;top:0;left:0;right:0}.guide-cap{background:var(--accent);border-radius:50%;width:7px;height:7px;position:absolute;top:-3px}.guide-cap-left{left:-4px}.width-drag-handle{z-index:2;touch-action:none;cursor:ew-resize;background:0 0;border:0;width:30px;height:52px;padding:0;position:absolute;top:50%;right:-15px;transform:translateY(-50%)}.width-drag-handle:before{content:"";border-left:1px dashed #191a1852;position:absolute;top:0;bottom:0;left:50%}.width-drag-handle span{border:2px solid var(--paper);background:var(--accent);width:8px;height:22px;box-shadow:0 0 0 1px var(--accent);border-radius:999px;transition:background-color .14s,box-shadow .14s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}:is(.width-drag-handle:hover span,.width-drag-handle:focus-visible span){background:var(--accent-dark);box-shadow:0 0 0 3px #ff5c3538}.width-drag-handle:focus-visible{outline:none}.width-guide h2{width:100%;color:var(--ink);letter-spacing:-.055em;white-space:normal;word-break:keep-all;overflow-wrap:normal;text-align:center;margin:0;font-weight:830;line-height:1.12}.width-guide h2.is-balanced{text-wrap:wrap;flex-direction:column;display:flex}.width-guide h2.uses-native-balance{text-wrap:balance}.title-line{white-space:nowrap;display:block}.code-panel{z-index:4;color:#f7f5ef;background:#191a18db;grid-template-rows:auto auto minmax(0,1fr);gap:18px;min-width:0;padding:26px 28px 28px;animation:.18s cubic-bezier(.22,1,.36,1) both code-panel-in;display:grid;position:absolute;inset:0;overflow:hidden}.code-panel-heading{justify-content:space-between;align-items:flex-start;gap:24px;display:flex}.code-panel-heading>div{gap:5px;display:grid}.code-panel-heading strong{letter-spacing:-.025em;font-size:15px}.code-panel-heading span{color:#f7f5ef94;font-size:10px}.code-panel-heading button{color:#f7f5efb8;cursor:pointer;background:0 0;border:0;padding:4px 0;font-size:10px}.code-panel-heading button:hover{color:#fff}.code-explanation{color:#f7f5efbd;word-break:keep-all;max-width:620px;margin:0;font-size:11px;line-height:1.65}.code-tabs{border-bottom:1px solid #ffffff29;gap:18px;display:flex}.code-tabs button{color:#f7f5ef7a;letter-spacing:.04em;cursor:pointer;background:0 0;border:0;padding:0 0 9px;font-family:SFMono-Regular,Consolas,monospace;font-size:10px;position:relative}.code-tabs button:after{content:"";background:0 0;height:2px;position:absolute;bottom:-1px;left:0;right:0}.code-tabs button.is-active{color:#fff}.code-tabs button.is-active:after{background:var(--accent)}.code-single{grid-template-rows:auto minmax(0,1fr);min-width:0;min-height:0;display:grid}.code-panel pre{scrollbar-color:#ffffff4d transparent;background:#0003;border-radius:3px;min-width:0;min-height:0;margin:0;overflow:auto}.code-panel pre code{color:#f7f5ef;tab-size:2;white-space:pre;width:max-content;min-width:100%;padding:18px;font-family:SFMono-Regular,Consolas,monospace;font-size:11px;line-height:1.75;display:block}@keyframes code-panel-in{0%{opacity:0;transform:translate(12px)}}.code-strip{border-top:1px solid var(--line);gap:24px;overflow:hidden}.code-strip code{color:#454741;text-overflow:ellipsis;white-space:nowrap;font-family:SFMono-Regular,Consolas,monospace;font-size:10px;overflow:hidden}.code-strip span{color:var(--muted);flex:none;font-size:10px}footer{min-height:90px}.reveal{opacity:0;transform:translateY(12px)}.reveal.is-visible{animation:.52s cubic-bezier(.22,1,.36,1) forwards enter}.reveal-1{animation-delay:40ms}.reveal-2{animation-delay:.11s}.reveal-3{animation-delay:.18s}.reveal-4{animation-delay:.25s}@keyframes enter{to{opacity:1;transform:translateY(0)}}@media (max-width:900px){main{padding:0 24px}.intro{grid-template-columns:1fr;gap:28px;padding:58px 0 48px}.controls{grid-template-columns:1fr}.preview-tuning{gap:28px;padding-inline:24px}}@media (max-width:560px){main{padding:0 16px}.site-header{height:66px}.site-header>p{display:none}.intro{padding:42px 0 38px}.intro h1{font-size:clamp(38px,12vw,58px)}.intro p{font-size:14px}.preview-panel{grid-template-rows:auto auto auto 50px}.preview-shell,.preview-workspace{min-height:0}.preview-meta{gap:12px;min-height:58px}.preview-actions{gap:8px}.preview-actions>span{display:none}.preview-tuning{grid-template-columns:1fr;gap:18px;padding:18px 12px}.comparison-stage.is-stacked .comparison-side{grid-template-rows:46px minmax(260px,auto)}.comparison-canvas{padding:38px 12px 48px}.comparison-label{padding-inline:12px}.code-toggle{padding-inline:8px}.code-panel{gap:14px;padding:20px 18px}.code-explanation{font-size:10px}.code-strip span{display:none}.controls{grid-template-columns:1fr;gap:24px}footer p:last-child{display:none}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{opacity:1;transform:none;animation:none!important}*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-delay:0s!important}}