*{box-sizing:border-box} :root{font-family:Inter,'Noto Sans KR','Malgun Gothic',sans-serif;color:#e8edf4;background:#10151c;font-size:16px;color-scheme:dark}body{margin:0}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button{border:1px solid #36414e;background:#242e3b;color:#e8edf4;padding:10px 12px;border-radius:8px;cursor:pointer;font-size:.875rem;transition:background .15s}button:hover{background:#354454}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #51e8b8;outline-offset:3px}button.selected{border-color:#44dfac;color:#44dfac;background:#163f35}button:disabled,fieldset:disabled button{opacity:.4;cursor:not-allowed}header{height:80px;border-bottom:1px solid #2b3440;display:flex;align-items:center;padding:0 4%;gap:24px}.brand{text-decoration:none;color:#fff;font-weight:700;display:flex;align-items:center;gap:12px;white-space:nowrap}.mark{background:#43dfad;color:#12211c;width:33px;height:33px;border-radius:9px;text-align:center;font-size:26px}.privacy{margin-left:auto;color:#a3afbe;font-size:.8125rem}main{max-width:1600px;margin:auto;padding:32px 4% 15px}.heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:28px;gap:20px}.eyebrow{font-size:.75rem;color:#55e5b6;letter-spacing:2px;font-weight:700;margin:0 0 10px}h1{font-size:clamp(1.45rem,2.3vw,2rem);letter-spacing:-1px;margin:0}.heading>p{font-size:.875rem;color:#a3afbe;margin:0 0 3px}.workspace{display:grid;grid-template-columns:270px minmax(280px,1fr) 260px;gap:18px;align-items:start}.panel{border:1px solid #303a47;background:#19212c;border-radius:14px;overflow:hidden}.controls,.export{padding:21px}.sectiontitle{display:flex;gap:12px;align-items:center;margin-bottom:20px}.sectiontitle>span{font-size:.75rem;font-weight:700;color:#58e2b7}.sectiontitle h2{font-size:1rem;margin:0}.upload{display:block;text-align:center;border:1px dashed #526173;border-radius:9px;padding:21px 6px;cursor:pointer;background:#202b38}.upload:hover,.upload.drag{border-color:#43dfad;background:#263c3b}.upload strong{font-size:.875rem}.upload small{display:block;font-size:.75rem;line-height:1.8;color:#a4b1c1;margin-top:10px}#file{position:absolute;width:1px;height:1px;opacity:0}.upload:focus-within{outline:2px solid #43dfad}.muted{font-size:.75rem;color:#a4b1c1;overflow-wrap:anywhere;line-height:1.5}fieldset{border:0;padding:0;margin:0;min-width:0}.group{border-top:1px solid #303a47;padding-top:18px;margin-top:18px}h3{font-size:.875rem;margin:0 0 12px}.accent{background:#42dfad;color:#10251e;border-color:#42dfad;font-weight:700}.accent:hover{background:#7decc6}.full{width:100%;margin-top:9px}.help{color:#a3afbe;font-size:.75rem;line-height:1.7;margin:9px 0 14px}.rangeLabel{display:flex;justify-content:space-between;gap:8px;align-items:center;font-size:.875rem;margin-top:15px}output{font-size:.75rem;color:#53e3b4}input[type=range]{width:100%;accent-color:#43dfad;margin:14px 0}.row{display:flex;gap:7px}.row button{flex:1;white-space:nowrap;padding:9px 7px}.editorbar{display:flex;justify-content:space-between;align-items:center;padding:16px 18px;border-bottom:1px solid #303a47;font-size:.875rem}.swatch{width:22px;height:22px;border-radius:50%;padding:0!important;border:2px solid #73808d;background:repeating-conic-gradient(#adb5bd 0 25%,#647180 0 50%) 50%/8px 8px}.swatch.white{background:#fff}.swatch.black{background:#111}.swatch.selected{outline:2px solid #43dfad;outline-offset:3px}.stage{height:565px;display:flex;align-items:center;justify-content:center;padding:28px;overflow:hidden}.checker{background-color:#252e38;background-image:conic-gradient(#303b47 25%,transparent 0 50%,#303b47 0 75%,transparent 0);background-size:20px 20px}#empty{text-align:center}#empty h2{font-size:1.2rem;margin:18px 0 10px}#empty p{color:#b7c3d0;font-size:.875rem;line-height:1.8}.emptyIcon{border:1px solid #647487;border-radius:20px;width:70px;height:70px;display:grid;place-items:center;margin:auto;font-size:32px;color:#52e1b2;background:#202a37}#canvas{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;touch-action:none;box-shadow:0 8px 28px #0003;cursor:crosshair}.canvasfooter{display:flex;justify-content:space-between;gap:12px;padding:13px 18px;font-size:.75rem;color:#a3afbe;border-top:1px solid #303a47}#status{margin:0;padding:12px 18px;min-height:50px;font-size:.8125rem;color:#60e6bb;line-height:1.5;background:#142820}.previewTile{width:156px;height:156px;margin:5px auto 0;border-radius:24px;border:1px solid #465363;padding:0;overflow:hidden}.previewTile canvas{width:100%;height:100%}.previewCaption{text-align:center;color:#a3afbe;font-size:.75rem;margin:12px 0 24px}.export label{font-size:.875rem}select{display:block;width:100%;padding:11px;border:1px solid #3b4858;background:#222e3b;border-radius:8px;margin:9px 0 20px;font-size:.875rem}.miniPreviews{height:82px;display:flex;align-items:center;justify-content:center;gap:20px}.download{padding:14px 8px}.note{border-top:1px solid #35404d;margin-top:24px;padding-top:20px;font-size:.75rem;color:#a9b7c7;line-height:1.8}.note strong{color:#d8e1ed}footer{display:flex;justify-content:space-between;font-size:.6875rem;letter-spacing:1px;color:#8997a9;margin-top:24px}footer span{letter-spacing:0}@media(min-width:1500px){.stage{height:650px}}@media(max-width:1100px){.workspace{grid-template-columns:240px minmax(260px,1fr)}.export{grid-column:1/-1;display:block}.export fieldset{max-width:500px;margin:auto}.stage{height:570px}.heading{display:block}.heading>p{margin-top:15px}}@media(max-width:650px){header{height:68px;padding:0 5%;gap:10px;justify-content:space-between}.brand{font-size:.875rem}.privacy{display:none}main{padding:25px 4%}.workspace{display:flex;flex-direction:column}.panel{width:100%}.editor{order:0}.controls{order:1}.export{order:2}.stage{height:350px;padding:18px}.canvasfooter{flex-direction:column;gap:5px}footer{gap:15px;line-height:1.6}.heading>p{line-height:1.6}}

/* Image placement shares the export coordinate system. */
[hidden]{display:none!important}.stage{position:relative}#board{position:relative;flex-shrink:0;touch-action:none;outline:1px solid #718198;box-shadow:0 8px 30px #0004}#board:focus-visible{outline:2px solid #43dfad;outline-offset:4px}#board #canvas{display:block;width:100%;height:100%;max-width:none;max-height:none;box-shadow:none;cursor:default}#board[data-mode="view"] #canvas{cursor:default}#board[data-mode="erase"] #canvas,#board[data-mode="restore"] #canvas,#board[data-mode="pick"] #canvas{cursor:crosshair}#selection{position:absolute;border:1.5px solid #43efb8;pointer-events:none}#selection .handle{position:absolute;width:13px;height:13px;border:2px solid #0c4938;background:#8affd8;border-radius:2px;pointer-events:auto;touch-action:none;transform:translate(-50%,-50%)}.handle[data-handle="nw"]{left:0;top:0;cursor:nwse-resize}.handle[data-handle="n"]{left:50%;top:0;cursor:ns-resize}.handle[data-handle="ne"]{left:100%;top:0;cursor:nesw-resize}.handle[data-handle="e"]{left:100%;top:50%;cursor:ew-resize}.handle[data-handle="se"]{left:100%;top:100%;cursor:nwse-resize}.handle[data-handle="s"]{left:50%;top:100%;cursor:ns-resize}.handle[data-handle="sw"]{left:0;top:100%;cursor:nesw-resize}.handle[data-handle="w"]{left:0;top:50%;cursor:ew-resize}.checkLabel{font-size:.8125rem;display:flex;align-items:center;gap:7px;margin:12px 0 16px}.checkLabel input{accent-color:#43dfad;width:16px;height:16px}.transformControls{margin-top:8px}#layoutInfo{font-variant-numeric:tabular-nums;margin-bottom:0}@media(pointer:coarse){#selection .handle{width:20px;height:20px}}

.editorbar{flex-wrap:wrap;gap:12px}.editorbar #modeLabel{flex:1 1 150px;line-height:1.5}.canvasActions{display:flex;align-items:center;gap:6px}.iconButton{width:38px;height:38px;display:grid;place-items:center;padding:0;flex:none}.iconButton svg{pointer-events:none}#clear:not(:disabled):hover{color:#ffb0aa;background:#492e35;border-color:#946069}.backgroundChoices{align-items:center;margin-left:5px;padding-left:12px;border-left:1px solid #3b4654}@media(max-width:650px){.editorbar #modeLabel{flex-basis:100%}.editorbar .backgroundChoices{margin-left:auto}.iconButton{width:42px;height:42px}}