:root{--ink:#111827;--muted:#8d929c;--line:#e3e5e8;--panel:#f3f4f5;--coral:#ed7f6a}*{box-sizing:border-box}body{margin:0;min-height:100dvh;background:#fff;color:var(--ink);font-family:"Noto Sans KR","DM Sans",sans-serif}.wrap{width:min(100% - 32px,640px);margin:0 auto}.topbar{height:72px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:8px;color:var(--ink);font:700 22px/1 "DM Sans",sans-serif;letter-spacing:-1px;text-decoration:none}.brand-mark{width:20px;height:20px;display:grid;grid-template-columns:repeat(2,1fr);gap:2px}.brand-mark i{border-radius:2px;background:var(--ink)}.brand-mark i:nth-child(2){border-radius:7px 2px 2px 2px}.brand-mark i:nth-child(3){border-radius:2px 2px 2px 7px}.header-note{font-size:12px;color:var(--muted)}.app-shell{padding:37px 0 48px}.create-panel{width:100%}.intro h1{margin:0;font-size:34px;line-height:1.22;letter-spacing:-.06em}.intro p{margin:9px 0 25px;color:#777c86;font-size:14px}.url-field{display:flex;align-items:center;gap:10px;height:54px;padding:0 13px;border:1px solid #cfd3d9;border-radius:12px;cursor:text;transition:.2s}.url-field:focus-within{border-color:var(--ink);box-shadow:0 0 0 3px #1118270d}.url-field>span:first-child{font-size:17px;transform:rotate(13deg);color:#707580}input[type=text]{width:100%;min-width:0;border:0;outline:0;color:var(--ink);font:13px "DM Mono",monospace}.field-status{white-space:nowrap;color:#9ba0a8;font:10px "DM Mono",monospace}.preview-label{display:flex;justify-content:space-between;margin:28px 1px 11px;font-size:12px;font-weight:600}.live-dot{display:flex;align-items:center;gap:5px;color:#a0a4ab;font-size:10px;font-weight:400}.live-dot:before{content:"";width:5px;height:5px;border-radius:50%;background:#4ab37b}.qr-stage{position:relative;display:grid;place-items:center;width:min(100%,360px);aspect-ratio:1;margin:0 auto 17px;background:var(--panel);border:1px solid #e6e7e9}.paper-corner{position:absolute;top:12px;right:12px;width:6px;height:6px;border-radius:50%;background:var(--coral)}#qrImage{width:77%;height:77%;object-fit:contain}.format-select{display:flex;width:100%;height:38px;margin:0 auto 10px;border:1px solid #dfe2e6;border-radius:9px;overflow:hidden}.format{flex:1;border:0;border-right:1px solid #e7e8eb;background:#fff;color:#8b9098;font:11px "DM Mono",monospace;cursor:pointer}.format:last-child{border:0}.format.active{background:var(--ink);color:#fff}.action-row{display:grid;grid-template-columns:1fr 1.3fr;gap:9px}.settings-button,.download-button{height:52px;border-radius:10px;font:600 13px "Noto Sans KR",sans-serif;cursor:pointer}.settings-button{display:flex;align-items:center;justify-content:center;gap:7px;border:1px solid #dadddf;background:#fff;color:var(--ink)}.settings-button svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-linecap:round;stroke-width:1.6}.download-button{border:0;background:var(--ink);color:#fff}.download-button:disabled{opacity:.65;cursor:wait}.download-button span{margin-left:5px;font-size:16px}footer{padding:19px 0 27px;border-top:1px solid var(--line)}footer a{color:#737882;font:11px "DM Mono",monospace;text-decoration:none}footer a span{margin-left:2px;color:var(--coral)}.modal{position:fixed;inset:0;z-index:5;pointer-events:none}.modal-backdrop{position:absolute;inset:0;background:#11182766;opacity:0;transition:opacity .24s}.settings-sheet{position:absolute;right:0;bottom:0;left:0;display:flex;flex-direction:column;max-height:min(80dvh,650px);padding:8px 20px 20px;border-radius:22px 22px 0 0;background:#fff;transform:translateY(105%);transition:transform .28s cubic-bezier(.2,.8,.2,1);box-shadow:0 -8px 35px #1118271c}.modal.open{pointer-events:auto}.modal.open .modal-backdrop{opacity:1}.modal.open .settings-sheet{transform:translateY(0)}.sheet-handle{width:34px;height:4px;margin:2px auto 13px;border-radius:9px;background:#d9dce0}.sheet-head{display:flex;align-items:center;justify-content:space-between;padding-bottom:15px;border-bottom:1px solid #eceef0}.sheet-head h2{margin:0;font-size:18px;letter-spacing:-.04em}.close-button{display:grid;place-items:center;width:32px;height:32px;border:0;border-radius:50%;background:#f2f3f4;color:#444a55;font-size:23px;font-weight:300;cursor:pointer}.sheet-scroll{overflow:auto;padding:4px 0 10px}.setting-block{padding:21px 0;border-bottom:1px solid #eceef0}.setting-block>label,.label-line label{display:block;margin-bottom:12px;font-size:13px;font-weight:600}.style-options{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.style-option{height:80px;padding:10px 3px 7px;border:1px solid #e1e3e7;border-radius:10px;background:#fff;color:#7d828b;font:11px "Noto Sans KR",sans-serif;cursor:pointer}.style-option.selected{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink);color:var(--ink)}.mini{display:block;width:27px;height:27px;margin:0 auto 7px;background:repeating-linear-gradient(90deg,var(--ink) 0 4px,transparent 4px 7px),repeating-linear-gradient(var(--ink) 0 4px,transparent 4px 7px)}.mini.rounded{border-radius:5px}.mini.circle{border-radius:50%}.color-row{display:flex;gap:8px}.color-input{display:grid!important;grid-template-columns:26px 1fr;grid-template-rows:15px 15px;column-gap:7px;align-items:center;flex:1;margin:0!important;padding:8px;border:1px solid #e1e3e7;border-radius:10px;color:#737984;font-size:11px}.color-input input{grid-row:1/3;width:24px;height:24px;border:0;padding:0;background:transparent;cursor:pointer}.color-input b{font:10px "DM Mono",monospace;color:#49505d}.label-line{display:flex;justify-content:space-between}.text-button{padding:0;border:0;background:transparent;color:var(--coral);font:11px "Noto Sans KR",sans-serif;cursor:pointer}.upload-zone{display:flex;align-items:center;gap:10px;min-height:66px;padding:10px 12px;border:1px dashed #b9bec7;border-radius:10px;cursor:pointer}.upload-zone.has-logo{border-style:solid;border-color:var(--ink)}.upload-icon{display:grid;place-items:center;width:32px;height:32px;border-radius:8px;background:#f0f1f3;color:#5d6370;font-size:20px}.upload-zone strong,.upload-zone small{display:block}.upload-zone strong{font-size:11px}.upload-zone small{margin-top:2px;color:#9da1a8;font-size:10px}.upload-zone input{display:none}.range-line{display:flex;align-items:center;gap:10px;margin-top:16px;color:#747a85;font-size:11px}.range-line input{flex:1;accent-color:var(--ink)}.range-line output{font:11px "DM Mono",monospace}.sheet-done{height:49px;margin-top:9px;border:0;border-radius:10px;background:var(--ink);color:#fff;font:600 13px "Noto Sans KR",sans-serif;cursor:pointer}#toast{position:fixed;z-index:10;left:50%;bottom:24px;transform:translate(-50%,20px);padding:11px 15px;border-radius:8px;background:var(--ink);color:#fff;font-size:12px;white-space:nowrap;opacity:0;pointer-events:none;transition:.25s;box-shadow:0 10px 30px #1118272b}#toast.show{opacity:1;transform:translate(-50%,0)}body:has(.modal.open){overflow:hidden}@media(min-width:720px){.wrap{width:min(100% - 64px,800px)}.topbar{height:82px}.app-shell{padding-top:65px}.create-panel{width:600px;margin:auto}.intro{text-align:center}.intro h1{font-size:46px}.intro p{font-size:15px;margin-bottom:31px}.url-field{height:58px}.preview-label{margin-top:34px}.qr-stage{width:420px}.settings-sheet{right:50%;bottom:50%;left:auto;width:500px;max-height:680px;border-radius:18px;transform:translate(50%,calc(50% + 110%));padding:8px 26px 24px}.modal.open .settings-sheet{transform:translate(50%,50%)}.sheet-handle{display:none}.sheet-head{padding-top:10px}.action-row{grid-template-columns:1fr 1.25fr}}