:root{--bg: #100c14;--bg-2: #1a1324;--panel: rgba(28, 20, 38, .92);--gold: #d4af37;--gold-dim: #9c7c32;--text: #f3ead8;--muted: #b6a78c;--danger: #e07a7a;--line: rgba(212, 175, 55, .28);--shadow: 0 18px 40px rgba(0, 0, 0, .35);--sans: "Noto Sans KR", sans-serif;--serif: "Cormorant Garamond", serif}*{box-sizing:border-box}html,body,#app{margin:0;min-height:100%;background:transparent;color:var(--text);font-family:var(--sans)}a{color:var(--gold)}code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;color:var(--gold)}.app-root{min-height:100vh;background:radial-gradient(1200px 500px at 10% -10%,rgba(212,175,55,.08),transparent 50%),radial-gradient(900px 400px at 100% 0%,rgba(92,42,120,.2),transparent 45%),var(--bg)}.app-main{max-width:1120px;margin:0 auto;padding:28px 24px 64px}.overlay-root,.overlay-main{min-height:100vh;background:transparent}.nav{display:flex;align-items:center;gap:24px;padding:16px 24px;border-bottom:1px solid var(--line);background:#100c14db;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);position:sticky;top:0;z-index:10}.brand{font-family:var(--serif);font-size:22px;font-weight:700;color:var(--gold);text-decoration:none;letter-spacing:.04em}.nav-links{display:flex;gap:16px;flex:1}.nav-links a{color:var(--muted);text-decoration:none;font-size:14px}.nav-links a.router-link-exact-active{color:var(--text)}.nav-status{font-size:12px;padding:4px 10px;border:1px solid var(--line);border-radius:999px;color:var(--muted)}.nav-status[data-status=connected]{color:#9ee0b0;border-color:#3d7a4e}.nav-status[data-status=offline],.nav-status[data-status=error]{color:var(--danger)}.page h1{font-family:var(--serif);font-size:40px;margin:0 0 8px;font-weight:600}.lede{color:var(--muted);margin:0 0 24px;line-height:1.6}.panel{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:20px;box-shadow:var(--shadow)}.form{display:grid;gap:16px}.form label,.result{display:grid;gap:8px;font-size:13px;color:var(--muted)}input[type=url],input[type=password],textarea{width:100%;border:1px solid var(--line);background:#120e18;color:var(--text);border-radius:10px;padding:12px 14px;font:inherit}textarea{resize:vertical}fieldset{border:1px solid var(--line);border-radius:12px;padding:12px 14px;display:grid;gap:10px}legend{padding:0 6px;color:var(--gold)}.choice{display:flex;gap:10px;align-items:flex-start;color:var(--text);cursor:pointer}.choice small{display:block;color:var(--muted);font-size:12px;margin-top:2px}.toggle{display:flex;gap:10px;align-items:center;color:var(--text)}.btn{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);background:transparent;color:var(--text);border-radius:999px;padding:10px 18px;font:inherit;cursor:pointer;text-decoration:none}.btn.primary{background:var(--gold);color:#1a1208;border-color:var(--gold);font-weight:600}.btn.small{padding:6px 12px;font-size:13px}.btn:disabled{opacity:.5;cursor:not-allowed}.actions{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0}.error{color:var(--danger);margin:8px 0}.notice{color:var(--gold)}.muted{color:var(--muted)}.meta{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:20px 0 0}.meta div{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:12px 14px}.meta dt{font-size:12px;color:var(--muted)}.meta dd{margin:6px 0 0}.meta dd[data-status=connected]{color:#9ee0b0}.grid-2{display:grid;grid-template-columns:1.1fr .9fr;gap:16px;margin-bottom:16px}.panel-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:12px}.panel-head h2{margin:0;font-family:var(--serif);font-size:24px}.count{color:var(--gold);font-size:13px}.queue{list-style:none;margin:0;padding:0;display:grid;gap:8px}.queue li{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid rgba(212,175,55,.12)}.next{color:var(--muted);margin-top:24px}.spread-board.row{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;margin-top:24px}.spread-board.celtic{display:grid;grid-template-columns:auto auto auto auto;grid-template-rows:auto auto auto;gap:12px 20px;justify-content:center;align-items:center;margin-top:24px}.spread-board.celtic .c5{grid-column:2;grid-row:1}.spread-board.celtic .c4{grid-column:1;grid-row:2}.spread-board.celtic .c6{grid-column:3;grid-row:2}.spread-board.celtic .c3{grid-column:2;grid-row:3}.spread-board.celtic .cross{grid-column:2;grid-row:2}.spread-board.celtic .staff{grid-column:4;grid-row:1 / span 3;display:flex;flex-direction:column;gap:10px}.cross,.cross .c1{position:relative}.cross .c2{position:absolute;left:0;top:0;width:100%;pointer-events:none}.cross .c2 .card-face{transform:rotate(90deg)}.cross .c2 .card-face.reversed{transform:rotate(270deg)}.cross .c2 .card-caption{display:none}.card-slot{width:150px}.card-slot.sm{width:110px}.card-slot.lg{width:170px}.card-face{position:relative;aspect-ratio:2 / 3;border-radius:12px;border:1px solid var(--gold-dim);overflow:hidden;box-shadow:var(--shadow);transform-style:preserve-3d;transition:transform .6s ease}.card-face.reversed{transform:rotate(180deg)}.card-back,.card-front{position:absolute;top:0;right:0;bottom:0;left:0}.card-back img,.card-front img{display:block;width:100%;height:100%;object-fit:cover}.card-back{background:#1d1028}.card-face.revealed .card-back{display:none}.card-front{background:#16101f}.card-caption{margin:8px 0 0;font-size:12px;color:var(--muted);text-align:center;min-height:2.4em}.obs{min-height:100vh;padding:32px;display:flex;flex-direction:column;align-items:center;justify-content:center}.obs-head{text-align:center;margin-bottom:12px}.obs-name,.obs-spread,.obs-wait{margin:0;color:#fff;text-shadow:0 2px 8px #000,0 0 18px rgba(0,0,0,.8)}.obs-name{font-family:var(--serif);font-size:42px;font-weight:700}.obs-spread{color:#f0d48a;margin-top:4px}.obs-wait{font-size:22px;margin:12px 0}.obs .card-caption{color:#fff;text-shadow:0 1px 4px #000}@media(max-width:860px){.grid-2,.meta{grid-template-columns:1fr}.spread-board.celtic{grid-template-columns:1fr 1fr 1fr}.spread-board.celtic .staff{grid-column:1 / span 3;grid-row:4;flex-direction:row;flex-wrap:wrap;justify-content:center}}
