@font-face{font-family:system-ui;src:local("Arial")}*{box-sizing:border-box}body{margin:0;background:#f3f5f7;color:#1a2534;font-family:"Pretendard","Malgun Gothic",Arial,sans-serif;font-size:14px}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #4169f6;outline-offset:3px}button{transition:background .15s,color .15s}button:disabled{cursor:wait;opacity:.6}button:hover{filter:brightness(.97)}[hidden]{display:none!important}.topbar{height:78px;background:#151d2b;color:white;display:flex;align-items:center;justify-content:space-between;padding:0 38px}.wordmark{color:inherit;text-decoration:none;font-size:25px;font-weight:800;letter-spacing:.12em;display:flex;align-items:center;gap:28px}.wordmark span{font-size:9px;letter-spacing:.13em;color:#9ca6b8;font-weight:400}.header-right{display:flex;align-items:center;gap:25px}.lab-tag{font-size:10px;letter-spacing:.12em;color:#c4cbd6}.lab-tag i{display:inline-block;width:6px;height:6px;background:#82a5ff;border-radius:50%;margin-right:8px}.quiet{background:transparent;color:#e8edf5;border:1px solid #485261;padding:10px 15px;border-radius:5px;font-size:12px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 400px;min-height:calc(100dvh - 78px);max-width:1920px;margin:auto}.viewer-shell{padding:32px 36px 17px;min-width:0;position:sticky;top:0;height:calc(100dvh - 2px);max-height:1150px;display:flex;flex-direction:column}.intro{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:23px;gap:20px}.eyebrow{font-size:10px;letter-spacing:.17em;font-weight:600;color:#597086;margin:0 0 14px}h1{font-size:clamp(26px,2.45vw,42px);line-height:1.27;letter-spacing:-.05em;margin:0;font-weight:750}h1 em{font-style:normal;color:#315de3}.intro-note{font-size:12px;color:#7b8794;line-height:1.9;margin:0 0 3px}.stage{position:relative;flex:1;min-height:390px;background:#e7edf3;border:1px solid #dce3ea;border-radius:12px;overflow:hidden}canvas{width:100%;height:100%;display:block;touch-action:none}.stage-caption{position:absolute;top:24px;left:25px;pointer-events:none}.tiny-label{font-size:9px;letter-spacing:.14em;color:#8794a4;font-weight:600}.stage-caption h2{margin:8px 0 5px;font-size:17px;font-weight:600}.stage-caption>span:last-child{font-size:11px;color:#798797}.dimension-toggle{position:absolute;top:24px;right:22px;border:1px solid #c5cfdb;background:#f5f8fbbf;border-radius:20px;padding:7px 12px;color:#59728c;font-size:11px}.dimension-toggle[aria-pressed=true]{color:#315de3;border-color:#97b0f5;background:#f5f8ff}.view-tools{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);display:flex;gap:3px;background:#ffffffed;border:1px solid #dce3eb;border-radius:8px;padding:5px;box-shadow:0 7px 25px #3143610c;white-space:nowrap}.view-tools button{border:0;background:transparent;color:#526174;padding:9px 12px;font-size:11px;border-radius:4px}.view-tools button[aria-pressed=true]{background:#e5edff;color:#2453d6}.view-tools>span{border-left:1px solid #dce2eb;margin:5px}.gesture{position:absolute;bottom:73px;left:0;right:0;text-align:center;color:#8491a0;font-size:10px;pointer-events:none}.spec-strip{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;padding:21px 0 17px;gap:20px}.spec-strip>div{padding-left:20px;border-left:1px solid #d9dfe6}.spec-strip>div:first-child{border:0;padding:0}.spec-strip span{display:block;font-size:8px;letter-spacing:.12em;color:#82909f;margin-bottom:5px}.spec-strip strong{font-size:22px;font-weight:500;letter-spacing:-.02em;font-variant-numeric:tabular-nums}.spec-strip small{font-size:10px;color:#8995a2;margin-left:3px}.viewer-note{font-size:10px;color:#8b96a3;line-height:1.6;margin:0}.config-panel{background:#fff;border-left:1px solid #dfe5eb;padding:28px 27px 24px}.panel-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:26px}.panel-heading h2{font-size:20px;letter-spacing:-.04em;margin:7px 0 0}.reset{background:none;border:0;color:#8792a2;padding:8px 0;font-size:11px}.option-section{padding-bottom:22px;margin-bottom:22px;border-bottom:1px solid #e9edf2}.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px}.section-heading h3{font-size:13px;margin:0;font-weight:600}.section-heading h3 span{font-family:Arial;font-size:10px;color:#315de3;margin-right:9px;font-weight:500}.section-heading>span{font-size:9px;color:#8f9aa8;letter-spacing:.04em}.design-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.design-card{border:1px solid #e2e7ed;background:#fafbfd;padding:11px 3px 10px;border-radius:6px;color:#7c8998}.design-card svg{display:block;width:48px;height:37px;margin:0 auto 8px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.design-card span{font-size:10px;color:#667386}.design-card[aria-pressed=true]{border-color:#315de3;background:#f0f4ff;color:#315de3;box-shadow:inset 0 0 0 .3px #315de3}.design-card[aria-pressed=true] span{color:#244cc0}.size-fields{display:grid;gap:17px}.size-row .size-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.size-row label{font-size:12px;color:#566477}.size-row label small{font-size:9px;color:#97a2ad;margin-left:6px}.number-wrap{border:1px solid #dce3ec;border-radius:5px;display:flex;align-items:center;background:#fff}.number-wrap:focus-within{border-color:#315de3;box-shadow:0 0 0 2px #315de318}.number-wrap input{width:83px;border:0;background:transparent;text-align:right;color:#28384d;padding:7px 3px 7px 8px;outline:none;font-size:13px;font-variant-numeric:tabular-nums;-moz-appearance:textfield}.number-wrap input::-webkit-inner-spin-button{opacity:.4}.number-wrap>span{padding:0 10px 0 6px;font-size:10px;color:#8a96a5}input[type=range]{width:100%;height:4px;display:block;accent-color:#315de3;cursor:pointer}.range-caps{display:flex;justify-content:space-between;font-size:8px;color:#a3adba;margin-top:7px}.size-note{font-size:10px;color:#8994a2;line-height:1.7;margin:14px 0 0}.input-error{font-size:11px;color:#a43c32;background:#fff2ef;padding:9px;border-radius:4px;line-height:1.5}.finish-options{display:grid;grid-template-columns:1fr 1fr;gap:8px}.finish-options button{display:flex;align-items:center;gap:9px;border:1px solid #dfe5ed;background:white;padding:12px;border-radius:6px;text-align:left}.finish-options button[aria-pressed=true]{border-color:#315de3;background:#f6f8ff}.finish-options span{font-size:12px;color:#344257}.finish-options small{font-size:9px;color:#929dab;display:block;margin-top:4px}.finish-options b{font-weight:400;color:#315de3;margin-left:auto;visibility:hidden}.finish-options button[aria-pressed=true] b{visibility:visible}.swatch{display:inline-block;width:27px;height:27px;flex-shrink:0;border-radius:50%;border:1px solid #0001}.swatch.black{background:linear-gradient(115deg,#111923,#48515b,#10151d)}.swatch.zinc{background:linear-gradient(110deg,#8c9aaa,#eff5fa 40%,#a5b3c1 70%,#e8edf3)}select{width:100%;padding:12px 27px 12px 11px;border:1px solid #dce3ed;background:#fff;color:#405168;border-radius:5px;font-size:12px}.wheel-detail{display:flex;align-items:center;gap:15px;background:#f6f8fa;border-radius:6px;margin-top:10px;padding:12px 14px;min-height:77px}.wheel-detail svg{height:50px;width:54px;flex-shrink:0;color:#7c8999}.wheel-detail strong{font-size:11px;font-weight:500}.wheel-detail p{font-size:10px;color:#8b96a3;line-height:1.7;margin:4px 0 0}.order-caption{display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#8993a0}.test-badge{border:1px solid #d6dfe9;padding:3px 6px;border-radius:3px;font-size:9px}.order-block>p{line-height:1.7;color:#526176;font-size:12px}.primary{width:100%;border:0;background:#315de3;color:#fff;padding:15px 18px;border-radius:6px;text-align:left;font-size:13px;font-weight:600;display:flex;justify-content:space-between;align-items:center}.primary>span{font-size:19px}.checkout-note{font-size:9px!important;color:#94a0ae!important;text-align:center;margin-bottom:0}#mid-field{margin-top:18px;display:flex;align-items:center;justify-content:space-between;gap:8px}#mid-field label{font-size:11px}#mid-field label span{display:block;font-size:9px;color:#8a96a5;margin-top:4px}.dimension-label{position:absolute;background:#f5f8ffe8;border:1px solid #bdccef;color:#4567aa;border-radius:3px;padding:3px 6px;font:10px Arial;pointer-events:none;white-space:nowrap;transform:translate(-50%,-50%)}#dimension-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}#loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:12px;z-index:5;background:#e7edf3dd;font-size:12px;color:#536c89}.spinner{border:2px solid #c6d5eb;border-top-color:#315de3;width:21px;height:21px;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}dialog{border:0;border-radius:14px;padding:35px;max-width:480px;width:calc(100% - 30px);color:#24354b;box-shadow:0 30px 100px #101b3433}dialog::backdrop{background:#14213999;backdrop-filter:blur(4px)}.dialog-close{position:absolute;top:13px;right:16px;border:0;background:transparent;font-size:25px;color:#78879a}dialog h2{font-size:25px;letter-spacing:-.05em;margin:7px 0}.dialog-intro{color:#8592a2;font-size:12px;margin-bottom:23px}dialog dl{margin:0;padding:17px 0;border-block:1px solid #e5eaf0;display:grid;gap:13px}dialog dl>div{display:flex;justify-content:space-between;gap:20px;font-size:12px}dialog dt{color:#8c98a6}dialog dd{margin:0;text-align:right}.pending-price{display:flex;align-items:center;justify-content:space-between;margin:20px 0;font-size:12px}.pending-price strong{font-size:15px;color:#5378c8}.dialog-note{font-size:11px;line-height:1.8;color:#8b96a4;margin-bottom:22px}.back-button{width:100%;border:0;background:none;padding:14px;color:#7a8a9f;font-size:12px}.toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#19263c;color:white;padding:13px 20px;border-radius:8px;z-index:20;box-shadow:0 4px 30px #0002;font-size:12px;max-width:90vw}.option-section:last-of-type{margin-bottom:17px;padding-bottom:17px}@media(min-width:1600px){.workspace{grid-template-columns:minmax(0,1fr) 430px}.config-panel{padding-inline:34px}.viewer-shell{padding-inline:55px}}@media(max-width:1050px){.workspace{grid-template-columns:minmax(0,1fr) 350px}.config-panel{padding:24px 20px}.viewer-shell{padding:25px 20px 15px}.intro-note{display:none}.header-right .lab-tag{display:none}.spec-strip{gap:8px}.spec-strip>div{padding-left:10px}.spec-strip strong{font-size:18px}}@media(max-width:760px){.topbar{height:62px;padding:0 18px}.wordmark{font-size:21px}.wordmark span{display:none}.quiet{font-size:10px;padding:8px}.workspace{display:flex;flex-direction:column}.viewer-shell{position:relative;height:auto;max-height:none;padding:24px 16px 16px}.intro{margin-bottom:20px}h1{font-size:29px}.intro h1 br{display:none}.eyebrow{font-size:8px;margin-bottom:10px}.stage{height:480px;min-height:0;flex:none}.stage-caption{top:20px;left:19px}.stage-caption h2{font-size:14px}.stage-caption>span:last-child{font-size:9px;display:block;max-width:190px;line-height:1.5}.dimension-toggle{right:12px;top:17px;padding:6px 8px;font-size:9px}.spec-strip{padding-top:18px;gap:9px}.spec-last{display:none}.spec-strip{grid-template-columns:1fr 1fr 1fr}.spec-strip strong{font-size:21px}.viewer-note{font-size:9px}.config-panel{padding:27px 22px;border:0;border-top:1px solid #dce3ec}.panel-heading{margin-bottom:25px}.design-card{padding:15px}.design-card svg{height:41px}.option-section{margin-bottom:24px;padding-bottom:24px}.size-fields{gap:23px}.view-tools{bottom:20px}.view-tools button{padding:8px;font-size:10px}.gesture{bottom:64px;font-size:9px}.number-wrap input{padding-block:9px}.primary{padding:17px}dialog{padding:30px 24px}dialog h2{font-size:23px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}.spinner{animation:none}}

@media(min-width:761px){.workspace{height:calc(100dvh - 78px);min-height:0}.viewer-shell{position:relative;height:100%;max-height:none;min-height:0}.stage{min-height:280px}.config-panel{height:100%;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#cdd6e2 transparent}.intro{margin-bottom:20px}.viewer-shell{padding-top:26px}.viewer-note{font-size:9px}}
