*{box-sizing:border-box}html,body{height:100%;margin:0}body{color:#1d1d1f;background:#f3f3f1;font-family:Pretendard,Noto Sans KR,Apple SD Gothic Neo,Malgun Gothic,system-ui,sans-serif;font-size:14px}.topbar{background:#fff;border-bottom:1px solid #e3e3e0;justify-content:space-between;align-items:center;height:56px;padding:0 20px;display:flex}.brand{font-size:18px;font-weight:800}.brand .sub{color:#666;margin-left:10px;font-size:13px;font-weight:500}.example-badge{color:#8a5a00;background:#fff4d6;border:1px solid #f0c75e;border-radius:999px;padding:6px 14px;font-size:13px;font-weight:700}.layout{grid-template-columns:280px 1fr 340px;height:calc(100vh - 56px);display:grid}.panel{background:#fff;padding:16px;overflow-y:auto}.panel.left{border-right:1px solid #e3e3e0}.panel.right{border-left:1px solid #e3e3e0}h2{margin:6px 0 10px;font-size:15px}h2 small{color:#999;font-weight:500}section+section{margin-top:18px}.shape-grid{grid-template-columns:1fr 1fr;gap:8px;display:grid}.shape-card,.width-btn,.pal-item{cursor:pointer;text-align:left;font:inherit;color:inherit;background:#fafaf8;border:2px solid #e1e1de;border-radius:10px}.shape-card{padding:8px 10px}.shape-card b{font-size:16px;display:block}.shape-card span{color:#666;font-size:12px}.shape-card.active,.width-btn.active{background:#eef5fc;border-color:#0058a3}.width-row{gap:8px;display:flex}.width-btn{text-align:center;flex:1;padding:10px 0;font-weight:700}.hint{color:#777;margin:0 0 8px;font-size:12px}.palette{grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:10px;display:grid}.pal-item{text-align:center;cursor:grab;-webkit-user-select:none;user-select:none;padding:8px 0}.pal-item b{font-size:16px;display:block}.pal-item span{color:#777;font-size:11px}.pal-item.dragging{opacity:.5}button.primary{color:#fff;width:100%;font:inherit;cursor:pointer;background:#0058a3;border:0;border-radius:10px;padding:12px;font-weight:700}button.primary:hover{background:#004f93}.check{color:#444;align-items:center;gap:6px;margin-top:10px;display:flex}.viewer{background:#e9e8e4;position:relative;overflow:hidden}.canvas-host{position:absolute;inset:0 0 112px}.canvas-host canvas{width:100%;height:100%;display:block}.viewer.drag-over .canvas-host{outline-offset:-8px;outline:3px dashed #0058a3}.drop-hint{color:#fff;background:#0058a3;border-radius:999px;padding:6px 14px;font-weight:700;display:none;position:absolute;top:14px;left:50%;transform:translate(-50%)}.viewer.drag-over .drop-hint{display:block}.viewer-info{background:#ffffffe6;border-radius:8px;padding:8px 12px;font-size:13px;line-height:1.5;position:absolute;top:14px;left:14px}.viewer-example{color:#8a5a00;background:#fff4d6;border:1px solid #f0c75e;border-radius:6px;padding:4px 10px;font-size:12px;font-weight:700;position:absolute;top:14px;right:14px}.module-strip{background:#fff;border-top:1px solid #e3e3e0;align-items:stretch;gap:8px;height:112px;padding:10px 12px;display:flex;position:absolute;bottom:0;left:0;right:0;overflow-x:auto}.mod-chip{cursor:pointer;background:#fafaf8;border:2px solid #e1e1de;border-radius:10px;flex-direction:column;gap:4px;min-width:150px;padding:8px;display:flex}.mod-chip.selected{background:#eef5fc;border-color:#0058a3}.mod-chip .t{font-weight:700}.mod-chip .row{align-items:center;gap:6px;font-size:12px;display:flex}.mod-chip button{font:inherit;cursor:pointer;background:#fff;border:1px solid #ccc;border-radius:6px;padding:2px 8px;font-size:12px}.mod-chip button.danger{color:#b3261e;border-color:#e7b4b0}.mod-chip select{font:inherit;font-size:12px}.empty-strip{color:#888;align-self:center;padding-left:8px}table{border-collapse:collapse;width:100%}td,th{text-align:left;border-bottom:1px solid #f0f0ee;padding:5px 4px;font-size:13px}td.n,th.n{text-align:right;font-variant-numeric:tabular-nums}td.rule{color:#888;font-size:11px}tr.total td{border-top:2px solid #1d1d1f;border-bottom:0;font-size:15px;font-weight:800}.power-box{background:#f3f7f1;border:1px solid #cfe3c6;border-radius:8px;padding:10px 12px}.power-box.warn{color:#8c1d18;background:#fdecea;border-color:#f0a29b}.power-box b{font-size:18px}.bar{background:#e6e6e3;border-radius:4px;height:8px;margin-top:8px;overflow:hidden}.bar>i{background:#3a9a4a;height:100%;display:block}.power-box.warn .bar>i{background:#d93025}.note{color:#888;margin-top:8px;font-size:11px;line-height:1.5}