/* luvio-auth 화면(로그인·계정) — 2026-10-17 리모델: 셸(apps/web/styles.css)과 같은 청록·바탕·모양 체계. 변수 이름은 그대로 */
:root{--bg:#f3f6f7;--card:#fff;--surface-2:#eaf0f1;--fg:#15202b;--mut:#5f6b76;--line:#e1e8ea;--acc:#0f8378;--acc-strong:#0b6d64;--accfg:#fff;--ring:rgba(15,131,120,.24);--bad:#d1433a;--ok:#1f8a4c;
  --shadow-2:0 6px 20px rgba(16,24,40,.08),0 1px 2px rgba(16,24,40,.04);--glow-a:rgba(15,131,120,.16);--glow-b:rgba(255,196,120,.18)}
@media (prefers-color-scheme:dark){:root{--bg:#0f1418;--card:#161c22;--surface-2:#1d252c;--fg:#e9eef2;--mut:#9aa6b1;--line:#263038;--acc:#39b3a6;--acc-strong:#5cc8bc;--accfg:#06201c;--ring:rgba(57,179,166,.3);--bad:#f07367;--ok:#4cc382;
  --shadow-2:0 8px 24px rgba(0,0,0,.35);--glow-a:rgba(57,179,166,.14);--glow-b:rgba(255,170,90,.08)}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:15px/1.6 "Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Noto Sans KR",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(900px 480px at -10% -10%,var(--glow-a),transparent 60%),radial-gradient(700px 420px at 110% 0%,var(--glow-b),transparent 60%)}
main{max-width:760px;margin:0 auto;padding:32px 16px 64px}
.narrow{max-width:400px;margin-top:9vh}
h1{font-size:24px;letter-spacing:-.02em;margin:0 0 4px}
h2{font-size:16px;margin:0 0 12px}
.sub{color:var(--mut);margin:0 0 22px}
.logo{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.logo img{width:40px;height:40px;border-radius:12px;box-shadow:0 6px 16px var(--ring)}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:22px;margin-bottom:16px;box-shadow:var(--shadow-2)}
label{display:block;font-size:13px;color:var(--mut);margin:12px 0 4px;font-weight:500}
input,select{width:100%;padding:11px 13px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--fg);font:inherit;transition:border-color .15s,box-shadow .15s}
input:focus,select:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 3px var(--ring)}
button{margin-top:16px;min-height:42px;padding:10px 16px;border:0;border-radius:10px;background:var(--acc);color:var(--accfg);font:inherit;font-weight:600;cursor:pointer;box-shadow:0 1px 2px rgba(0,0,0,.08),inset 0 1px 0 rgba(255,255,255,.15);transition:filter .15s,transform .12s}
button:hover{filter:brightness(1.06)}button:active{transform:translateY(1px)}
button.ghost{background:var(--card);color:var(--fg);border:1px solid var(--line);box-shadow:none}
button.ghost:hover{border-color:var(--acc);color:var(--acc-strong);filter:none}
button:disabled{opacity:.5;cursor:default;transform:none;filter:none}
.msg{min-height:1.4em;margin-top:12px;font-size:14px}
.msg.bad{color:var(--bad)}.msg.ok{color:var(--ok)}
.hidden{display:none!important}
code,.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;word-break:break-all}
.codes{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;margin-top:8px}
.codes span{padding:6px;border:1px dashed var(--line);border-radius:8px;text-align:center;background:var(--surface-2)}
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{padding:9px 8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
th{font-size:12px;color:var(--mut)}
td select{padding:4px 6px;width:auto}
.apps{display:flex;flex-wrap:wrap;gap:4px 10px}
.apps label{display:inline-flex;gap:4px;align-items:center;margin:0;color:var(--fg);font-size:13px;font-weight:400}
.apps input{width:auto}
.row{display:flex;gap:8px;align-items:end;flex-wrap:wrap}
.row>*{flex:1;min-width:120px}
.badge{display:inline-block;padding:1px 9px;border-radius:999px;border:1px solid var(--line);background:var(--surface-2);font-size:12px;color:var(--mut)}
.top{display:flex;justify-content:space-between;align-items:start;gap:12px}
.top button{margin-top:0}
.scroll{overflow-x:auto}
#go{width:100%;margin-top:18px;min-height:46px;font-size:15.5px}
:where(a,button,input,select):focus-visible{outline:2px solid var(--acc);outline-offset:2px}