:root{--bg:#0d0e11;--bg-2:#14161b;--panel:#171a20;--line:#262a33;--text:#ecebe8;--muted:#8d919b;--faint:#5c616c;--accent:#e8c39e;--danger:#ff6b6b;--radius:22px;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:radial-gradient(1200px 700px at 30% 10%, #1b1e25 0%, transparent 60%), var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;font-family:Pretendard,-apple-system,BlinkMacSystemFont,Apple SD Gothic Neo,Noto Sans KR,system-ui,sans-serif}code{color:var(--accent);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.92em}.app{grid-template-columns:minmax(0,1fr) 380px;gap:28px;max-width:1440px;min-height:100dvh;margin:0 auto;padding:28px;display:grid}.stage{flex-direction:column;align-self:start;align-items:center;gap:20px;min-width:0;display:flex;position:sticky;top:28px}.portrait-wrap{position:relative}.portrait{border-radius:var(--radius);background:var(--bg-2);max-width:100%;height:min(100dvh - 150px,960px);position:relative;overflow:hidden;box-shadow:0 30px 80px #0000008c,0 0 0 1px #ffffff0a}.portrait canvas{opacity:0;width:100%;height:100%;transition:opacity .8s;display:block}.portrait canvas.ready{opacity:1}.portrait-overlay{text-align:center;color:var(--muted);place-content:center;justify-items:center;gap:14px;padding:24px;font-size:14px;display:grid;position:absolute;inset:0}.portrait-overlay.error{color:var(--danger)}.spinner{border:2px solid var(--line);border-top-color:var(--accent);border-radius:50%;width:28px;height:28px;animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.chips{pointer-events:none;flex-wrap:wrap;justify-content:center;gap:8px;padding:0 16px;display:flex;position:absolute;bottom:18px;left:0;right:0}.chip{color:#fff;background:color-mix(in srgb, var(--c) 30%, #0a0a0c99);border:1px solid color-mix(in srgb, var(--c) 55%, transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:999px;padding:6px 12px;font-size:13px;font-weight:600;animation:.35s chip-in}@keyframes chip-in{0%{opacity:0;transform:translateY(6px)}}.portrait.setup{text-align:center;border:1px dashed var(--line);place-items:center;width:min(460px,100%);height:auto;min-height:min(60dvh,560px);padding:28px;display:grid}.setup code{word-break:break-all}.setup h2{margin:0 0 12px;font-size:20px}.setup p{color:var(--muted);margin:0;font-size:14px;line-height:1.7}.setup .hint{color:var(--faint);margin-top:14px;font-size:12px}.composer{width:min(720px,100%)}.held{text-align:center;color:var(--muted);margin:0 0 8px;font-size:14px;animation:.3s chip-in}.input-wrap{position:relative}.input-wrap input{width:100%;color:var(--text);background:var(--panel);border:1px solid var(--line);border-radius:999px;outline:none;padding:18px 96px 18px 22px;font-size:17px;transition:border-color .2s,box-shadow .2s}.input-wrap input::placeholder{color:var(--faint)}.input-wrap input:focus{border-color:color-mix(in srgb, var(--accent) 60%, var(--line));box-shadow:0 0 0 4px color-mix(in srgb, var(--accent) 12%, transparent)}.status{color:var(--faint);font-variant-numeric:tabular-nums;font-size:12px;position:absolute;top:50%;right:22px;transform:translateY(-50%)}.status.waiting,.status.analyzing{color:var(--accent);animation:1s ease-in-out infinite pulse}@keyframes pulse{50%{opacity:.4}}.error{text-align:center;color:var(--danger);margin:10px 0 0;font-size:13px}.panel{flex-direction:column;gap:16px;min-width:0;display:flex}.brand h1{letter-spacing:-.02em;margin:4px 0 6px;font-size:22px}.brand-row{justify-content:space-between;align-items:center;gap:12px;display:flex}.switcher{color:var(--text);background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:6px 10px;font-size:13px}.brand p{color:var(--muted);margin:0;font-size:13px;line-height:1.5}.card{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:16px 18px}.card-head{justify-content:space-between;align-items:center;gap:8px;display:flex}.card-head h2{margin:0;font-size:15px}.tag{color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:2px 8px;font-size:11px}.empty{color:var(--muted);margin:12px 0 2px;font-size:13px;line-height:1.6}.emo-list{gap:8px;margin:12px 0 0;padding:0;list-style:none;display:grid}.emo-list li{grid-template-columns:92px 1fr 28px;align-items:center;gap:10px;font-size:13px;display:grid}.emo-bar{background:var(--line);border-radius:999px;height:6px;overflow:hidden}.emo-bar span{border-radius:999px;height:100%;transition:width .4s;display:block}.emo-value{text-align:right;color:var(--muted);font-variant-numeric:tabular-nums}.group{color:var(--faint);letter-spacing:.02em;margin:14px 0 6px;font-size:11px;font-weight:600}.au-list{gap:5px;margin:0;padding:0;list-style:none;display:grid}.au-list li{color:var(--faint);grid-template-columns:58px 1fr 64px;align-items:center;gap:8px;font-size:12.5px;transition:color .3s;display:grid}.au-list li.on{color:var(--text)}.au-code{font-variant-numeric:tabular-nums;font-size:11px}.au-name{flex-direction:column;min-width:0;display:flex}.au-name small{color:var(--faint);white-space:nowrap;text-overflow:ellipsis;font-size:10.5px;overflow:hidden}.au-bar{background:var(--line);border-radius:999px;height:5px;overflow:hidden}.au-bar span{background:linear-gradient(90deg, #c98b6b, var(--accent));transform-origin:0;height:100%;transition:transform .12s linear;display:block}.mix{border-top:1px solid var(--line);gap:6px;margin:14px 0 0;padding-top:12px;font-size:12px;display:grid}.mix div{grid-template-columns:80px 1fr;gap:8px;display:grid}.mix dt{color:var(--faint)}.mix dd{color:var(--muted);margin:0}.set summary{cursor:pointer;list-style:none}.set summary::-webkit-details-marker{display:none}.set ul{color:var(--faint);grid-template-columns:1fr 1fr;gap:6px 12px;margin:12px 0 0;padding:0;font-size:12.5px;list-style:none;display:grid}.set li.have{color:var(--text)}.set li.bad,.set .hint.bad,.set li.bad span{color:var(--danger)}.set li span{width:14px;color:var(--accent);display:inline-block}.set li code{color:var(--faint);margin-left:4px;font-size:10.5px}.set .hint{color:var(--muted);margin:12px 0 0;font-size:12px}@media (max-width:1000px){.app{grid-template-columns:1fr;gap:20px;padding:16px}.stage{position:static}.portrait{height:min(100dvh - 130px,720px)}.input-wrap input{padding:15px 84px 15px 18px;font-size:16px}.chips{gap:4px;bottom:10px}.chip{padding:3px 9px;font-size:11.5px}}