@import "https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable-dynamic-subset.min.css";
:root{--brand:#00c362;--brand-dark:#00a855;--brand-deep:#007a3f;--brand-bg:#e8faf1;--accent:#ff8c00;--accent-bg:#fff4e5;--crit:#c02f2f;--crit-bg:#fdecec;--ink:#0f172a;--body:#475569;--faint:#94a3b8;--line:#e2e8f0;--canvas:#f6f8f7;--surface:#fff;--bubble-mine:#e8faf1;--bubble-theirs:#fff;--radius-card:16px;--radius-cta:12px;--radius-bubble:18px;--shadow-card:0 1px 2px #0f172a0a, 0 8px 24px #0f172a0d;--font:"Pretendard Variable", Pretendard, -apple-system, system-ui, "Malgun Gothic", sans-serif;--fs-body:16px;--fs-small:13px;--fs-title:20px;--fs-face:24px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-6:24px;--space-8:32px}html{font-family:var(--font);color:var(--ink);background:var(--canvas);font-size:var(--fs-body);-webkit-text-size-adjust:100%}.num{font-variant-numeric:tabular-nums}*,:before,:after{box-sizing:border-box}body{min-height:100dvh;margin:0;line-height:1.5}button,input,textarea,select{font:inherit;color:inherit}button{cursor:pointer;background:0 0;border:0;padding:0}a{color:inherit;text-decoration:none}h1,h2,h3,p{margin:0}textarea{resize:none}input[type=checkbox],input[type=radio]{accent-color:var(--brand);width:20px;height:20px}.spin{animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.fade-in{animation:.2s ease-out fade-in}.page{background:var(--canvas);flex-direction:column;max-width:480px;min-height:100dvh;margin:0 auto;display:flex}.page-pad{padding:var(--space-4)}.stack{gap:var(--space-3);flex-direction:column;display:flex}.row{align-items:center;gap:var(--space-2);display:flex}.grow{flex:1;min-width:0}.center{text-align:center}.small{font-size:var(--fs-small)}.muted{color:var(--body)}.faint{color:var(--faint)}.title{font-size:var(--fs-title);font-weight:700;line-height:1.3}.bold{font-weight:600}.sr-only{clip:rect(0 0 0 0);width:1px;height:1px;position:absolute;overflow:hidden}.card{background:var(--surface);border-radius:var(--radius-card);box-shadow:var(--shadow-card);padding:var(--space-4)}.btn{justify-content:center;align-items:center;gap:var(--space-2);border-radius:var(--radius-cta);white-space:nowrap;font-weight:700;transition:background .12s;display:inline-flex}.btn:disabled{opacity:.45;cursor:not-allowed}.btn-lg{height:52px;padding:0 var(--space-6);width:100%;font-size:var(--fs-body)}.btn-md{height:40px;padding:0 var(--space-4);font-size:var(--fs-small)}.btn-primary{background:var(--brand);color:#fff}.btn-primary:not(:disabled):hover{background:var(--brand-dark)}.btn-secondary{background:var(--brand-bg);color:var(--brand-deep)}.btn-ghost{color:var(--body);background:0 0;font-weight:600}.btn-danger{background:var(--crit-bg);color:var(--crit)}.icon-btn{width:40px;height:40px;color:var(--body);border-radius:10px;justify-content:center;align-items:center;display:inline-flex}.icon-btn:hover{background:var(--brand-bg);color:var(--brand-deep)}.field{flex-direction:column;gap:6px;display:flex}.field label{font-size:var(--fs-small);color:var(--body);font-weight:600}.field input,.field select,.field textarea{border:1px solid var(--line);border-radius:var(--radius-cta);height:48px;padding:0 var(--space-3);background:var(--surface);outline:none}.field textarea{height:auto;padding:var(--space-3)}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-bg)}.field .err{color:var(--crit);font-size:var(--fs-small)}.field .hint{color:var(--faint);font-size:var(--fs-small)}.check{gap:var(--space-3);padding:var(--space-3);border:1px solid var(--line);border-radius:var(--radius-cta);background:var(--surface);cursor:pointer;align-items:flex-start;display:flex}.check input{flex:none;margin-top:2px}.chip{height:26px;font-size:var(--fs-small);border-radius:999px;align-items:center;gap:4px;padding:0 10px;font-weight:600;display:inline-flex}.chip-accent{background:var(--accent-bg);color:var(--accent)}.chip-brand{background:var(--brand-bg);color:var(--brand-deep)}.chip-faint{background:var(--canvas);color:var(--body);border:1px solid var(--line)}.chip-outline{background:var(--surface);color:var(--body);border:1px solid var(--line);height:34px;padding:0 12px}.chip-outline.on{background:var(--brand-bg);color:var(--brand-deep);border-color:var(--brand)}.radio-list{gap:var(--space-2);flex-direction:column;display:flex}.radio-item{align-items:center;gap:var(--space-3);padding:14px var(--space-4);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-cta);cursor:pointer;display:flex}.radio-item.on{border-color:var(--brand);background:var(--brand-bg)}.radio-grid{gap:var(--space-2);grid-template-columns:1fr 1fr;display:grid}.divider{background:var(--line);height:1px;margin:var(--space-2) 0}.topbar{z-index:5;align-items:center;gap:var(--space-2);height:56px;padding:0 var(--space-2);background:var(--surface);border-bottom:1px solid var(--line);display:flex;position:sticky;top:0}.topbar .ttl{flex:1;min-width:0}.topbar .ttl h1{white-space:nowrap;text-overflow:ellipsis;font-size:17px;font-weight:700;overflow:hidden}.topbar .ttl p{font-size:var(--fs-small);color:var(--body);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.menu{right:var(--space-2);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-cta);box-shadow:var(--shadow-card);z-index:20;min-width:180px;position:absolute;top:52px;overflow:hidden}.menu button{align-items:center;gap:var(--space-2);width:100%;padding:12px var(--space-4);text-align:left;display:flex}.menu button:hover{background:var(--brand-bg)}.sheet-bg{z-index:40;background:#0f172a66;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.sheet{background:var(--surface);border-radius:var(--radius-card) var(--radius-card) 0 0;width:100%;max-width:480px;padding:var(--space-4) var(--space-4) calc(var(--space-6) + env(safe-area-inset-bottom));max-height:85dvh;animation:.18s ease-out sheet-up;overflow:auto}@keyframes sheet-up{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}.sheet-head{margin-bottom:var(--space-3);justify-content:space-between;align-items:center;display:flex}.sheet-head h2{font-size:17px;font-weight:700}.toast-wrap{z-index:60;pointer-events:none;flex-direction:column;align-items:center;gap:8px;display:flex;position:fixed;bottom:24px;left:0;right:0}.toast{background:var(--ink);color:#fff;border-radius:var(--radius-cta);max-width:90vw;box-shadow:var(--shadow-card);padding:12px 16px;font-size:14px;animation:.15s fade-in}.toast.err{background:var(--crit)}.toast.ok{background:var(--brand-deep)}.room-card{gap:var(--space-3);background:var(--surface);border-radius:var(--radius-card);box-shadow:var(--shadow-card);padding:14px var(--space-4);align-items:center;display:flex}.room-card .avatar{background:var(--brand-bg);width:44px;height:44px;color:var(--brand-deep);border-radius:12px;flex:none;justify-content:center;align-items:center;font-weight:700;display:flex}.room-card .preview{color:var(--body);white-space:nowrap;text-overflow:ellipsis;font-size:14px;overflow:hidden}.badge{background:var(--brand);color:#fff;border-radius:10px;justify-content:center;align-items:center;min-width:20px;height:20px;padding:0 6px;font-size:12px;font-weight:700;display:inline-flex}.chat{padding:var(--space-3) var(--space-3) var(--space-6);flex-direction:column;flex:1;gap:10px;display:flex;overflow-y:auto}.msg{flex-direction:column;gap:3px;max-width:86%;display:flex}.msg.mine{align-self:flex-end;align-items:flex-end}.msg.theirs{align-self:flex-start;align-items:flex-start}.msg .who{color:var(--body);padding:0 6px;font-size:12px}.bubble{border-radius:var(--radius-bubble);background:var(--bubble-theirs);box-shadow:var(--shadow-card);white-space:pre-wrap;word-break:break-word;padding:10px 14px}.msg.mine .bubble{background:var(--bubble-mine);border-bottom-right-radius:6px}.msg.theirs .bubble{border-bottom-left-radius:6px}.bubble img{border-radius:10px;max-width:100%;max-height:280px;margin-bottom:6px;display:block}.bubble .seen-as{border-top:1px dashed var(--line);color:var(--body);margin-top:8px;padding-top:8px;font-size:14px}.bubble .seen-as .lbl{color:var(--faint);margin-bottom:2px;font-size:11px;display:block}.bubble .orig{border-top:1px dashed var(--line);color:var(--body);margin-top:8px;padding-top:8px;font-size:14px}.bubble .toggle{color:var(--body);font-size:var(--fs-small);align-items:center;gap:2px;margin-top:6px;display:inline-flex}.bubble .fast-mark{color:var(--faint);margin-top:4px;font-size:12px;display:block}.bubble .translating{color:var(--faint);font-size:var(--fs-small);align-items:center;gap:6px;display:inline-flex}.bubble .failed{color:var(--crit);font-size:var(--fs-small);align-items:center;gap:6px;display:inline-flex}.bubble .note{color:var(--accent);margin-top:4px;font-size:12px}.msg .meta{color:var(--faint);align-items:center;gap:6px;padding:0 6px;font-size:11px;display:flex}.msg .actions{gap:4px;padding:0 2px;display:flex}.msg .actions button{color:var(--body);background:var(--surface);border:1px solid var(--line);border-radius:8px;align-items:center;gap:4px;padding:4px 8px;font-size:12px;display:inline-flex}.text-swap{animation:.2s fade-in}.composer{background:var(--surface);border-top:1px solid var(--line);padding:var(--space-2) var(--space-2) calc(var(--space-2) + env(safe-area-inset-bottom));gap:var(--space-2);align-items:flex-end;display:flex;position:sticky;bottom:0}.composer textarea{border:1px solid var(--line);background:var(--canvas);border-radius:22px;outline:none;flex:1;min-height:44px;max-height:140px;padding:10px 14px;line-height:1.4}.composer textarea:focus{border-color:var(--brand)}.composer .send{background:var(--brand);color:#fff;border-radius:22px;flex:none;justify-content:center;align-items:center;width:44px;height:44px;display:inline-flex}.composer .send:disabled{background:var(--line);color:var(--faint)}.composer .counter{color:var(--faint);font-size:11px;position:absolute;bottom:54px;right:60px}.mode-bar{gap:var(--space-2);padding:var(--space-2) var(--space-3);background:var(--surface);border-bottom:1px solid var(--line);display:flex;overflow-x:auto}.banner{gap:var(--space-3);padding:12px var(--space-4);background:var(--accent-bg);color:var(--ink);align-items:center;font-size:14px;display:flex}.banner.brand{background:var(--brand-bg)}.banner.crit{background:var(--crit-bg);color:var(--crit)}.new-msgs{align-self:center;position:sticky;bottom:8px}.skeleton{background:linear-gradient(90deg, var(--line), #f1f5f9, var(--line));background-size:200% 100%;border-radius:7px;height:14px;animation:1.2s infinite shimmer}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.face{flex-direction:column;height:100dvh;display:flex}.face-side{padding:var(--space-3);gap:var(--space-2);flex-direction:column;flex:1;min-height:0;display:flex}.face-side.top{background:var(--brand-bg);transform:rotate(180deg)}.face-side .lang{font-size:var(--fs-small);color:var(--brand-deep);font-weight:700}.face-side .hist{font-size:var(--fs-small);color:var(--body);overflow:hidden}.face-side .hist p{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.face-side .big{font-size:var(--fs-face);flex:1;font-weight:600;line-height:1.35;overflow:auto}.face-side .in{gap:var(--space-2);align-items:flex-end;display:flex}.face-side textarea{border:1px solid var(--line);border-radius:var(--radius-cta);background:var(--surface);outline:none;flex:1;min-height:56px;max-height:120px;padding:12px;font-size:18px}.face-side textarea:focus{border-color:var(--brand)}.face-mid{background:var(--brand);height:2px;position:relative}.face-hint{color:var(--body);font-size:12px}.legal h2{margin-top:var(--space-6);margin-bottom:var(--space-2);font-size:17px}.legal ul{margin:0;padding-left:20px}.legal li{color:var(--body);margin-bottom:6px;font-size:15px}