:root{color-scheme:light dark;--fg: #1a1a1a;--bg: #fafafa;--panel: #ffffff;--border: #d8d8d8;--accent: #2b6cb0;--error: #c0392b;font-family:Pretendard,Apple SD Gothic Neo,Malgun Gothic,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--fg)}#app{max-width:1100px;margin:0 auto;padding:24px;display:flex;flex-direction:column;gap:20px}h1{font-size:1.4rem;margin:0}.layout{display:grid;grid-template-columns:320px 1fr;gap:20px;align-items:start}@media (max-width: 800px){.layout{grid-template-columns:1fr}}.panel{background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:16px}.field{display:flex;flex-direction:column;gap:4px;margin-bottom:14px}.field label{font-size:.85rem;font-weight:600}.field .hint{font-size:.75rem;color:#666}.field input{padding:8px 10px;border:1px solid var(--border);border-radius:6px;font-size:1rem}button{background:var(--accent);color:#fff;border:none;border-radius:6px;padding:10px 16px;font-size:.95rem;cursor:pointer}button:hover{filter:brightness(1.08)}button:disabled{background:#999;cursor:not-allowed}.button-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}.error-box{background:#fdecea;border:1px solid var(--error);color:var(--error);border-radius:6px;padding:10px 12px;font-size:.85rem;white-space:pre-wrap}.piece-summary{font-size:.8rem;border-top:1px solid var(--border);margin-top:14px;padding-top:10px;display:flex;flex-direction:column;gap:4px}.piece-summary .row{display:flex;flex-direction:column;gap:2px;padding:4px 0}.piece-summary .row+.row{border-top:1px dashed var(--border)}.piece-summary .row .label{font-weight:600}.piece-summary .row .value{color:#444}#preview-canvas{width:100%;height:640px;background:repeating-conic-gradient(#eee 0% 25%,#fff 0% 50%) 50% / 16px 16px;border:1px solid var(--border);border-radius:8px;display:block}.legend{display:flex;gap:16px;font-size:.78rem;margin-top:8px;flex-wrap:wrap}.legend .swatch{display:inline-block;width:32px;height:3px;margin-right:4px;vertical-align:middle}.size-compare-tabs{display:flex;gap:6px;margin-bottom:12px}.size-compare-tabs .size-compare-tab{background:var(--panel);color:var(--fg);border:1px solid var(--border)}.size-compare-tabs .size-compare-tab.active{background:var(--accent);color:#fff;border-color:var(--accent)}.size-compare-models{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:10px}.size-compare-models .size-compare-model{display:flex;flex-direction:column;align-items:flex-start;gap:2px;background:var(--panel);color:var(--fg);border:1px solid var(--border);padding:8px 12px}.size-compare-models .size-compare-model.active{background:#eaf2fb;border-color:var(--accent)}.size-compare-model-name{font-size:.85rem;font-weight:600}.size-compare-model-dim{font-size:.75rem;color:#666}.size-compare-clear{background:#999}.size-compare-disclaimer{font-size:.75rem;color:#666;margin:10px 0 0}