*{box-sizing:border-box;margin:0;padding:0}:root{--panel-width:380px;--panel-bg:linear-gradient(160deg, #fafaf8 0%, #f5f4f0 100%);--card-bg:#f2f0ec;--accent:#1c1813;--accent-hover:#2e2820;--gold:#a8892a;--gold-light:#c9a84c;--gold-muted:#a8892a2e;--text:#1a1714;--text-mid:#5a5550;--text-light:#9e9890;--border:#e4e1db;--border-light:#edeae4;--radius:12px;--price-color:#8b2020;--shadow-panel:-6px 0 48px #00000021, -1px 0 0 #0000000a}body{color:var(--text);-webkit-font-smoothing:antialiased;background:#ede8e0;font-family:Noto Sans KR,Outfit,sans-serif;overflow:hidden}#viewer{width:calc(100% - var(--panel-width));height:100%;position:fixed;top:0;left:0}.viewer-overlay{width:calc(100% - var(--panel-width));pointer-events:none;z-index:5;flex-direction:column;justify-content:space-between;height:100%;padding:36px 44px;display:flex;position:fixed;top:0;left:0}.brand{align-items:center;gap:16px;display:flex}.brand-name{color:#1a1612a6;letter-spacing:6px;text-transform:uppercase;font-family:Outfit,sans-serif;font-size:30px;font-weight:300}.brand-divider{background:#a8892a4d;width:1px;height:22px}.brand-tag{color:#a8892a8c;letter-spacing:3px;text-transform:uppercase;font-family:Outfit,sans-serif;font-size:10px;font-weight:400}.viewer-hint{color:#1a161238;text-align:center;letter-spacing:.5px;font-size:11px}#panel{width:var(--panel-width);background:var(--panel-bg);height:100%;box-shadow:var(--shadow-panel);z-index:10;flex-direction:column;display:flex;position:fixed;top:0;right:0}.panel-header{border-bottom:1px solid var(--border);background:#ffffff8c;padding:30px 28px 22px}.panel-header-top{justify-content:space-between;align-items:center;display:flex}.panel-header h1{color:var(--text);letter-spacing:-.2px;font-size:21px;font-weight:600}.badge{letter-spacing:2px;color:var(--gold);background:var(--gold-muted);text-transform:uppercase;border:1px solid #a8892a40;border-radius:20px;padding:4px 11px;font-family:Outfit,sans-serif;font-size:9px;font-weight:600}.admin-link{width:34px;height:34px;color:var(--text-light);border-radius:8px;justify-content:center;align-items:center;text-decoration:none;transition:all .2s;display:flex}.admin-link:hover{background:var(--card-bg);color:var(--text)}.panel-header .subtitle{color:var(--text-light);letter-spacing:.1px;margin-top:8px;font-size:12px;line-height:1.6}.panel-body{flex:1;padding:8px 28px 20px;overflow-y:auto}.part-section{border-bottom:1px solid var(--border-light);padding:18px 0}.part-section:last-child{border-bottom:none}.part-title{color:var(--text);text-transform:uppercase;letter-spacing:.8px;justify-content:space-between;align-items:center;gap:8px;margin-bottom:13px;font-size:12px;font-weight:600;display:flex}.part-title-left{align-items:center;gap:10px;display:flex}.part-title .dot{border:1.5px solid var(--border);border-radius:50%;flex-shrink:0;width:10px;height:10px;transition:all .3s;box-shadow:0 0 #0000}.part-price{color:var(--text-light);white-space:nowrap;letter-spacing:.2px;font-family:Outfit,sans-serif;font-size:12px;font-weight:400;transition:all .2s}.part-price.has-extra{color:var(--price-color);font-weight:500}.color-grid{flex-wrap:wrap;gap:9px;display:flex}.color-swatch{cursor:pointer;border:2px solid #0000;border-radius:10px;width:40px;height:40px;transition:all .2s cubic-bezier(.4,0,.2,1);position:relative;box-shadow:inset 0 1px 3px #00000026,inset 0 -1px 2px #ffffff40}.color-swatch:hover{transform:scale(1.12);box-shadow:0 6px 16px #00000038,inset 0 1px 3px #00000026}.color-swatch.active{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent), inset 0 1px 3px #00000026;transform:scale(1.05)}.color-swatch .swatch-label{white-space:nowrap;color:var(--text);z-index:20;background:#fff;border-radius:6px;padding:4px 10px;font-size:11px;font-weight:500;display:none;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%);box-shadow:0 4px 16px #0000001f}.color-swatch .swatch-label:after{content:"";border:4px solid #0000;border-top-color:#fff;position:absolute;top:100%;left:50%;transform:translate(-50%)}.color-swatch:hover .swatch-label{animation:.15s fadeInUp;display:block}@keyframes fadeInUp{0%{opacity:0;transform:translate(-50%)translateY(4px)}to{opacity:1;transform:translate(-50%)translateY(0)}}.texture-grid{flex-wrap:wrap;gap:8px;display:flex}.texture-swatch{cursor:pointer;background-position:50%;background-size:cover;border:2px solid #0000;border-radius:10px;width:56px;height:56px;transition:all .2s cubic-bezier(.4,0,.2,1);position:relative}.texture-swatch:hover{transform:scale(1.08);box-shadow:0 4px 12px #0003}.texture-swatch.active{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent)}.texture-swatch .swatch-label{white-space:nowrap;color:var(--text);z-index:20;background:#fff;border-radius:6px;padding:4px 10px;font-size:11px;display:none;position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%);box-shadow:0 4px 16px #0000001f}.texture-swatch:hover .swatch-label{animation:.15s fadeInUp;display:block}.price-summary{border-top:1px solid var(--border);background:#ffffff80;padding:20px 28px 18px}.price-row{justify-content:space-between;align-items:baseline;display:flex}.total-row .price-label{color:var(--text-light);text-transform:uppercase;letter-spacing:1.2px;font-size:11px;font-weight:500}.total-row .price-value{color:var(--price-color);letter-spacing:-.5px;font-family:Outfit,sans-serif;font-size:28px;font-weight:300}.price-extra{color:var(--price-color);text-align:right;opacity:.75;letter-spacing:.2px;margin-bottom:6px;font-size:11px}.panel-footer{gap:10px;padding:14px 28px 24px;display:flex}.btn{cursor:pointer;letter-spacing:.3px;border:none;border-radius:10px;flex:1;justify-content:center;align-items:center;gap:8px;padding:14px 16px;font-family:inherit;font-size:13px;font-weight:500;transition:all .25s;display:flex}.btn svg{flex-shrink:0}.btn-primary{color:#ffffffeb;background:linear-gradient(145deg,#1c1813 0%,#2e2318 100%);box-shadow:0 2px 8px #00000040,inset 0 1px #ffffff14}.btn-primary:hover{color:#fff;background:linear-gradient(145deg,#2e2318 0%,#3d2f1e 100%);transform:translateY(-1px);box-shadow:0 6px 18px #00000047,inset 0 1px #ffffff14}.btn-primary:active{transform:translateY(0);box-shadow:0 2px 8px #00000040}.btn-secondary{color:var(--text-mid);border:1px solid var(--border);background:#ffffffb3;box-shadow:0 1px 4px #0000000f}.btn-secondary:hover{color:var(--text);background:#fffffff2;border-color:#ccc9c0;box-shadow:0 2px 8px #0000001a}#loading{z-index:100;background:linear-gradient(160deg,#f0ece4 0%,#e8e2d8 100%);justify-content:center;align-items:center;width:100%;height:100%;transition:opacity .9s cubic-bezier(.4,0,.2,1);display:flex;position:fixed;top:0;left:0}#loading.hidden{opacity:0;pointer-events:none}.loading-content{text-align:center}.loading-logo{color:#2a2218;letter-spacing:10px;text-transform:uppercase;margin-bottom:48px;font-family:Outfit,sans-serif;font-size:44px;font-weight:300}.loading-bar-track{background:#2a22181f;border-radius:1px;width:180px;height:1px;margin:0 auto;overflow:hidden}.loading-bar-fill{background:linear-gradient(90deg,#a8892a,#c9a84c);border-radius:1px;width:0%;height:100%;transition:width .35s}#loading p{color:#2a221861;letter-spacing:1.5px;text-transform:uppercase;margin-top:24px;font-size:11px}.panel-body::-webkit-scrollbar{width:3px}.panel-body::-webkit-scrollbar-track{background:0 0}.panel-body::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}.panel-body::-webkit-scrollbar-thumb:hover{background:#c8c4bc}@media (width<=768px){:root{--panel-width:100%}#viewer{width:100%;height:50vh}.viewer-overlay{width:100%;height:50vh;padding:20px}.brand-name{font-size:22px}#panel{border-top-left-radius:20px;border-top-right-radius:20px;height:50vh;top:50vh;box-shadow:0 -4px 30px #0003}}