:root{--bg:#f7f6f2;--bg-blob-a:#2f6df629;--bg-blob-b:#ff8a5b29;--surface:#fff;--surface-2:#f0eee9;--surface-3:#e7e4dd;--text:#1b1a17;--muted:#74716a;--line:#1b1a1714;--accent:#2f6df6;--accent-2:#5b8bff;--accent-ink:#fff;--accent-soft:#e6eeff;--accent-glow:#2f6df659;--ok:#14924a;--ok-soft:#e0f6e8;--warn:#b85c00;--warn-soft:#fff1e0;--shadow:0 1px 1px #1b1a1708, 0 10px 30px -10px #1b1a1724;--shadow-lift:0 2px 2px #1b1a1708, 0 18px 40px -14px #1b1a1738;--radius:20px;--radius-sm:12px;--font:"Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", system-ui, sans-serif;--mono:ui-monospace, "SF Mono", Menlo, Consolas, monospace;--ease:cubic-bezier(.2, .8, .2, 1);--spring:cubic-bezier(.34, 1.4, .64, 1)}@media (prefers-color-scheme:dark){:root{--bg:#121418;--bg-blob-a:#5b8bff2e;--bg-blob-b:#ff8a5b1f;--surface:#1b1e24;--surface-2:#242830;--surface-3:#2e333c;--text:#edece8;--muted:#9b9992;--line:#ffffff12;--accent:#5b8bff;--accent-2:#86aaff;--accent-ink:#0b1220;--accent-soft:#1d2a47;--accent-glow:#5b8bff59;--ok:#4fd083;--ok-soft:#163424;--warn:#ffb45c;--warn-soft:#3a2a12;--shadow:0 1px 1px #0000004d, 0 10px 30px -10px #00000080;--shadow-lift:0 2px 2px #0000004d, 0 18px 40px -14px #0009}}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--bg);color:var(--text);font-family:var(--font);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;font-size:16px;line-height:1.5;overflow-x:hidden}button,input,textarea{font:inherit;color:inherit}button{cursor:pointer}::selection{background:var(--accent-soft)}body:before,body:after{content:"";z-index:-1;filter:blur(80px);pointer-events:none;border-radius:50%;width:60vmax;height:60vmax;position:fixed}body:before{background:var(--bg-blob-a);animation:26s ease-in-out infinite alternate drift;top:-30vmax;left:-20vmax}body:after{background:var(--bg-blob-b);animation:32s ease-in-out infinite alternate-reverse drift;bottom:-35vmax;right:-25vmax}@keyframes drift{to{transform:translate(6vmax,4vmax)scale(1.08)}}.shell{max-width:520px;min-height:100dvh;padding:max(16px, env(safe-area-inset-top)) 16px max(24px, env(safe-area-inset-bottom));flex-direction:column;margin:0 auto;display:flex}.top{justify-content:space-between;align-items:center;padding:6px 4px 22px;display:flex}.brand{letter-spacing:-.02em;align-items:center;gap:10px;font-size:19px;font-weight:800;display:flex}.brand .dot{background:linear-gradient(135deg, var(--accent-2), var(--accent));width:12px;height:12px;box-shadow:0 0 0 4px var(--accent-soft);border-radius:50%;animation:3.2s ease-in-out infinite breathe}@keyframes breathe{50%{box-shadow:0 0 0 7px var(--accent-soft)}}.badge{color:var(--muted);border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:3px 10px;font-size:12px}.seg{background:var(--surface-2);isolation:isolate;border-radius:999px;grid-template-columns:1fr 1fr;margin-bottom:22px;padding:4px;display:grid;position:relative}.seg:before{content:"";background:var(--surface);width:calc(50% - 4px);box-shadow:var(--shadow);transition:transform .32s var(--spring);z-index:-1;border-radius:999px;position:absolute;top:4px;bottom:4px;left:4px}.seg[data-mode=receive]:before{transform:translate(100%)}.seg button{color:var(--muted);background:0 0;border:0;border-radius:999px;padding:11px 0;font-weight:700;transition:color .2s}.seg button[aria-pressed=true]{color:var(--text)}.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:26px 24px}.card+.card{margin-top:14px}h1{letter-spacing:-.025em;margin:0 0 6px;font-size:25px;font-weight:800;line-height:1.25}h2{align-items:center;gap:8px;margin:0 0 4px;font-size:17px;font-weight:700;display:flex}.lead{color:var(--muted);margin:0 0 20px}.hint{color:var(--muted);margin:12px 0 0;font-size:14px}.btn{background:linear-gradient(180deg, var(--accent-2), var(--accent));width:100%;min-height:54px;color:var(--accent-ink);box-shadow:0 8px 20px -8px var(--accent-glow);transition:transform .15s var(--ease), box-shadow .2s, filter .15s;border:0;border-radius:14px;justify-content:center;align-items:center;gap:8px;font-size:16px;font-weight:700;display:inline-flex}.btn:hover{filter:brightness(1.04);box-shadow:0 10px 24px -8px var(--accent-glow)}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.45;cursor:default;box-shadow:none;transform:none}.btn.ghost{background:var(--surface-2);color:var(--text);box-shadow:none}.btn.ghost:hover{background:var(--surface-3);filter:none;box-shadow:none}.btn.quiet{color:var(--muted);min-height:40px;box-shadow:none;background:0 0;font-weight:600}.btn.quiet:hover{color:var(--text);filter:none;box-shadow:none}.btn.inline{width:auto;min-height:0;padding:0 4px;display:inline}.btn.small{border-radius:10px;flex:none;width:auto;min-height:36px;padding:0 12px;font-size:14px}.error{color:var(--warn);margin:12px 0 0;font-size:14px}.thumbs{flex-wrap:wrap;gap:8px;margin:0 0 14px;display:flex}.thumbs img{object-fit:cover;background:var(--surface-2);width:72px;height:72px;box-shadow:var(--shadow);border-radius:12px}.fileicon .mini{object-fit:cover;border-radius:12px;width:100%;height:100%;display:block}.report{flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:10px;font-size:14px;display:flex}.dim{color:var(--muted)}.row{gap:10px;display:flex}.row>*{flex:1}.stack>*+*{margin-top:12px}.drop{border:2px dashed var(--surface-3);border-radius:var(--radius);text-align:center;background:var(--surface);transition:border-color .2s, background .2s, transform .2s var(--ease), box-shadow .2s;cursor:pointer;padding:38px 20px;position:relative}.drop:hover{border-color:var(--accent-2);box-shadow:var(--shadow)}.drop.over{border-color:var(--accent);background:var(--accent-soft);box-shadow:0 0 0 6px var(--accent-soft);border-style:solid;transform:scale(1.01)}.drop .icon{background:var(--accent-soft);width:58px;height:58px;color:var(--accent);transition:transform .3s var(--spring), background .2s, color .2s;border-radius:18px;place-items:center;margin:0 auto 14px;display:grid}.drop:hover .icon{transform:translateY(-3px)}.drop.over .icon{background:var(--accent);color:var(--accent-ink);transform:translateY(-6px)scale(1.08)}.drop.over .icon svg{animation:.7s ease-in-out infinite nudge}@keyframes nudge{50%{transform:translateY(-3px)}}.drop strong{font-size:17px;font-weight:700;display:block}.drop span{color:var(--muted);font-size:14px}.files{margin:0;padding:0;list-style:none}.files li{border-top:1px solid var(--line);align-items:center;gap:12px;padding:10px 0;display:flex}.files li:first-child{border-top:0}.files .name{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;line-height:1.3;overflow:hidden}.files .name small{text-overflow:ellipsis;font-size:12px;display:block;overflow:hidden}.files .dim{color:var(--muted)}.files .size{color:var(--muted);font-variant-numeric:tabular-nums;font-size:14px}.files .x{color:var(--muted);background:0 0;border:0;border-radius:50%;place-items:center;width:30px;height:30px;padding:0;font-size:20px;line-height:1;transition:background .15s,color .15s,transform .15s;display:grid}.files .x:hover{background:var(--surface-2);color:var(--text);transform:rotate(90deg)}.fileicon{background:var(--surface-2);width:38px;height:38px;color:var(--muted);border-radius:12px;flex:none;place-items:center;display:grid}.total{border-top:1px solid var(--line);color:var(--muted);justify-content:space-between;margin-top:4px;padding-top:12px;font-size:14px;display:flex}.textbox textarea{resize:vertical;border:2px solid var(--surface-3);border-radius:var(--radius);background:var(--surface);width:100%;min-height:84px;font:inherit;color:inherit;padding:14px 16px;line-height:1.5;transition:border-color .2s,box-shadow .2s}.textbox textarea:focus{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft);outline:0}.textbox textarea::placeholder{color:var(--muted)}.preview{background:var(--surface-2);border-radius:var(--radius-sm);white-space:pre-wrap;word-break:break-word;max-height:40vh;margin:0 0 12px;padding:14px 16px;font-size:15px;overflow:auto}.preview a{color:var(--accent)}.code{justify-content:center;gap:8px;margin:8px 0 18px;display:flex}.code .digit{background:var(--surface-2);min-width:0;max-width:52px;height:68px;font-family:var(--mono);font-variant-numeric:tabular-nums;border-radius:14px;flex:1 1 0;place-items:center;font-size:34px;font-weight:700;display:grid}.code .gap{width:8px}.qr{width:fit-content;box-shadow:var(--shadow);background:#fff;border-radius:16px;place-items:center;margin:8px auto 16px;padding:12px;display:grid}.qr img{width:180px;height:180px;image-rendering:pixelated;display:block}.codein{justify-content:center;gap:8px;margin:8px 0 18px;display:flex}.codein input{text-align:center;border:2px solid var(--surface-3);background:var(--surface);min-width:0;max-width:52px;height:68px;font-family:var(--mono);caret-color:var(--accent);transition:border-color .15s, box-shadow .15s, transform .15s var(--spring);border-radius:14px;flex:1 1 0;padding:0;font-size:34px;font-weight:700}.codein input:focus{border-color:var(--accent);box-shadow:0 0 0 4px var(--accent-soft);outline:0;transform:translateY(-2px)}.codein input:not(:placeholder-shown){background:var(--surface-2)}.codein.shake{animation:.4s shake}@keyframes shake{20%,60%{transform:translate(-6px)}40%,80%{transform:translate(6px)}}.emoji{justify-content:center;gap:12px;margin:10px 0 16px;display:flex}.emoji span{background:var(--surface-2);border-radius:20px;place-items:center;width:72px;height:72px;font-size:38px;display:grid}.bar{background:var(--surface-2);border-radius:999px;height:12px;position:relative;overflow:hidden}.bar i{background:linear-gradient(90deg, var(--accent-2), var(--accent));height:100%;transition:width .3s var(--ease);border-radius:999px;display:block;position:relative;overflow:hidden}.bar i:after{content:"";background:linear-gradient(90deg,#0000,#ffffff59,#0000);animation:1.4s ease-in-out infinite shimmer;position:absolute;inset:0;transform:translate(-100%)}@keyframes shimmer{to{transform:translate(100%)}}.bar.paused i{background:var(--warn)}.bar.paused i:after{animation:none}.stats{grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px;display:grid}.stat{background:var(--surface-2);border-radius:var(--radius-sm);padding:10px 12px}.stat b{font-variant-numeric:tabular-nums;letter-spacing:-.01em;font-size:17px;display:block}.stat span{color:var(--muted);font-size:12px}.chip{background:var(--surface-2);color:var(--muted);border-radius:999px;align-items:center;gap:8px;padding:6px 12px;font-size:14px;display:inline-flex}.chip.ok{background:var(--ok-soft);color:var(--ok)}.chip.warn{background:var(--warn-soft);color:var(--warn)}.pulse{background:currentColor;border-radius:50%;width:8px;height:8px;animation:1.2s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:.3;transform:scale(.8)}50%{opacity:1;transform:scale(1)}}.done-mark{background:var(--ok-soft);width:72px;height:72px;color:var(--ok);animation:popin .5s var(--spring) both;border-radius:50%;place-items:center;margin:0 auto 16px;display:grid;position:relative}.done-mark:before{content:"";border:2px solid var(--ok);animation:ripple .9s .15s var(--ease) both;border-radius:50%;position:absolute;inset:0}.done-mark path{stroke-dasharray:30;stroke-dashoffset:30px;animation:draw .45s .25s var(--ease) forwards}@keyframes popin{0%{opacity:0;transform:scale(.4)}}@keyframes ripple{to{opacity:0;transform:scale(1.9)}}@keyframes draw{to{stroke-dashoffset:0}}.center{text-align:center}.tiles{gap:10px;display:grid}.tile{text-align:left;border:2px solid var(--surface-3);background:var(--surface);transition:border-color .15s, transform .15s var(--ease), box-shadow .2s;border-radius:14px;align-items:center;gap:14px;padding:14px;display:flex}.tile:hover{border-color:var(--accent);box-shadow:var(--shadow);transform:translateY(-1px)}.tile:active{transform:scale(.99)}.tile .t{flex:1}.tile b{display:block}.tile span{color:var(--muted);font-size:14px}footer{text-align:center;color:var(--muted);margin-top:auto;padding-top:28px;font-size:13px}.install{background:var(--accent-soft);border-radius:var(--radius-sm);color:var(--text);flex-wrap:wrap;align-items:center;gap:10px;margin:0 0 16px;padding:10px 12px 10px 14px;font-size:13px;display:flex}.install span{flex:1;min-width:160px}.install .x{color:var(--muted);background:0 0;border:0;border-radius:50%;width:28px;height:28px;padding:0;font-size:18px;line-height:1}.devices{gap:8px;display:grid}.devices .tile{padding:0 44px 0 0;position:relative}.devices .devbtn{text-align:left;background:0 0;border:0;border-radius:14px;align-items:center;gap:14px;width:100%;padding:14px;display:flex}.devices .tile .x{color:var(--muted);background:0 0;border:0;border-radius:50%;width:28px;height:28px;padding:0;font-size:18px;line-height:1;position:absolute;top:50%;right:10px;transform:translateY(-50%)}.devices .tile .x:hover{background:var(--surface-2);color:var(--text)}footer .device{align-items:center;gap:6px;margin-top:6px;display:inline-flex}.dot-s{background:var(--muted);opacity:.5;border-radius:50%;width:7px;height:7px}.dot-s.on{background:var(--ok);opacity:1}.note{background:var(--surface-2);border-radius:var(--radius-sm);color:var(--muted);align-items:flex-start;gap:10px;margin:12px 0 0;padding:10px 12px;font-size:13px;line-height:1.45;display:flex}.logbar{text-align:center;margin-top:6px;font-size:12px}.log{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm);text-align:left;margin-top:8px;padding:12px}.log pre{max-height:40vh;font:11px/1.5 var(--mono);color:var(--muted);white-space:pre-wrap;word-break:break-all;margin:0;overflow:auto}.log .l b{color:var(--text);font-weight:600}.log .l.err{color:var(--warn)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}
