@import"https://fonts.googleapis.com/css2?family=Cinzel:wght@400;500;600;700&family=Crimson+Text:ital,wght@0,400;0,600;1,400&display=swap";:root{--mahogany-dark: #1a0f0a;--mahogany: #3d2314;--mahogany-light: #5c3a21;--leather: #2d1810;--leather-highlight: #4a2a1a;--gold: #c9a227;--gold-light: #dbb84d;--gold-dark: #8b7355;--gold-shadow: #6b5a3e;--parchment: #d4a574;--parchment-light: #e8d4b8;--parchment-dark: #c49a6c;--parchment-text: #3d2314;--mana-white: #f8f6d8;--mana-blue: #0e68ab;--mana-black: #150b00;--mana-red: #d32029;--mana-green: #00733e;font-family:Crimson Text,Georgia,serif;line-height:1.6;font-weight:400;color:var(--parchment-light);text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;color-scheme:dark}*,*:before,*:after{box-sizing:border-box}body{margin:0;min-height:100vh;background-color:var(--mahogany-dark);background-image:radial-gradient(ellipse 80% 60% at 50% 40%,transparent 0%,rgba(13,7,5,.4) 60%,rgba(13,7,5,.9) 100%),radial-gradient(ellipse 50% 40% at 50% 45%,rgba(75,45,25,.3) 0%,transparent 70%),repeating-linear-gradient(45deg,transparent,transparent 2px,rgba(45,24,16,.1) 2px,rgba(45,24,16,.1) 4px),repeating-linear-gradient(-45deg,transparent,transparent 2px,rgba(45,24,16,.08) 2px,rgba(45,24,16,.08) 4px),radial-gradient(ellipse 120% 100% at 50% 20%,#2d1810,#1a0f0a,#0d0705);background-attachment:fixed}body:before{content:"";position:fixed;inset:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");opacity:.03;pointer-events:none;z-index:0}img{max-width:100%;display:block}button,input,select,textarea{font:inherit}button{cursor:pointer}h1,h2,h3,h4,h5,h6{font-family:Cinzel,Times New Roman,serif;font-weight:600}#root{position:relative;z-index:1;max-width:1200px;margin:0 auto;padding:48px 24px 80px}.app{display:flex;flex-direction:column;gap:32px;animation:fadeIn .8s ease-out}.hero{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:40px;align-items:center;animation:fadeUp .6s ease both}.hero__text{text-align:center}.hero__text h1{font-family:Cinzel,serif;font-size:clamp(2.2rem,3vw + 1.5rem,3.5rem);margin:0 0 16px;color:var(--gold);text-shadow:0 0 30px rgba(201,162,39,.3),0 2px 4px rgba(0,0,0,.5);letter-spacing:.05em}.hero__text p{margin:0 0 24px;font-size:1.1rem;color:var(--parchment-light);line-height:1.7}.eyebrow{display:inline-block;font-family:Cinzel,serif;font-size:.75rem;letter-spacing:.25em;text-transform:uppercase;color:var(--gold-dark);margin-bottom:12px;padding:6px 16px;border:1px solid var(--gold-dark);border-radius:2px}.mana-symbols{display:flex;justify-content:center;gap:12px;margin:24px 0}.mana-dot{width:18px;height:18px;border-radius:50%;box-shadow:inset 0 -2px 4px #0006,inset 0 2px 4px #fff3,0 0 8px currentColor;transition:transform .3s ease,box-shadow .3s ease}.mana-dot:hover{transform:scale(1.2);box-shadow:inset 0 -2px 4px #0006,inset 0 2px 4px #fff3,0 0 16px currentColor}.mana-dot--white{background:linear-gradient(135deg,#fffef0,#f8f6d8,#e8e4c0);color:#f8f6d899}.mana-dot--blue{background:linear-gradient(135deg,#1a8fd4,#0e68ab,#084a7a);color:#0e68ab99}.mana-dot--black{background:linear-gradient(135deg,#3a2a1a,#150b00,#0a0500);color:#3c281466;box-shadow:inset 0 -2px 4px #0009,inset 0 2px 4px #64503c4d,0 0 8px #1e140a80}.mana-dot--red{background:linear-gradient(135deg,#e84048,#d32029,#a01820);color:#d3202999}.mana-dot--green{background:linear-gradient(135deg,#00945a,#00733e,#005028);color:#00733e99}.hero__tags{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;font-size:.8rem;font-family:Cinzel,serif}.hero__tags span{padding:6px 12px;border-radius:2px;background:#2d181099;color:var(--gold-dark);border:1px solid rgba(139,115,85,.3);letter-spacing:.05em}.hero__panel{display:grid;gap:24px}.panel{position:relative;background:linear-gradient(135deg,var(--parchment-light) 0%,var(--parchment) 50%,var(--parchment-dark) 100%);border:3px solid var(--gold);border-radius:4px;padding:24px;box-shadow:0 0 0 1px var(--gold-shadow),inset 0 0 20px #3d231426,0 8px 32px #0006,0 2px 8px #0000004d;color:var(--parchment-text)}.panel:before,.panel:after{content:"";position:absolute;width:24px;height:24px;border:2px solid var(--gold-dark);opacity:.6}.panel:before{top:8px;left:8px;border-right:none;border-bottom:none;border-radius:4px 0 0}.panel:after{bottom:8px;right:8px;border-left:none;border-top:none;border-radius:0 0 4px}.panel--alt{background:linear-gradient(135deg,var(--parchment) 0%,var(--parchment-dark) 50%,#b8895c 100%)}.panel--compact{padding:20px;flex:1}.panel h2,.panel h3{margin:0 0 16px;font-family:Cinzel,serif;font-size:1.2rem;color:var(--mahogany);text-transform:uppercase;letter-spacing:.1em;text-shadow:0 1px 0 rgba(255,255,255,.3)}.field{display:flex;flex-direction:column;gap:8px;margin-bottom:16px;font-family:Cinzel,serif;font-size:.7rem;letter-spacing:.15em;text-transform:uppercase;color:var(--mahogany-light)}.field input,.field select{padding:12px 14px;border-radius:4px;border:2px solid var(--gold-dark);background:linear-gradient(180deg,#ffffffe6,#e8d4b8f2);color:var(--mahogany);font-family:Crimson Text,serif;font-size:1rem;transition:border-color .2s ease,box-shadow .2s ease}.field input:focus,.field select:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 2px #c9a2274d,inset 0 1px 3px #0000001a}.field input::placeholder{color:var(--gold-dark);opacity:.7}button{position:relative;border:none;border-radius:4px;padding:12px 20px;background:linear-gradient(180deg,var(--gold-light) 0%,var(--gold) 40%,var(--gold-dark) 100%);color:var(--mahogany-dark);font-family:Cinzel,serif;font-weight:600;font-size:.85rem;letter-spacing:.1em;text-transform:uppercase;text-shadow:0 1px 0 rgba(255,255,255,.3);box-shadow:inset 0 1px #fff6,inset 0 -1px #0003,0 4px 8px #0000004d,0 2px 4px #0003;transition:all .2s ease}button:hover:not(:disabled){background:linear-gradient(180deg,#e5c85a 0%,var(--gold-light) 40%,var(--gold) 100%);box-shadow:inset 0 1px #ffffff80,inset 0 -1px #0003,0 6px 16px #c9a22766,0 4px 8px #0000004d;transform:translateY(-1px)}button:active:not(:disabled){background:linear-gradient(180deg,var(--gold-dark) 0%,var(--gold) 60%,var(--gold-light) 100%);box-shadow:inset 0 2px 4px #0000004d,0 1px 2px #0003;transform:translateY(1px)}button:disabled{opacity:.5;cursor:not-allowed;filter:grayscale(.3)}.banner{display:grid;gap:8px;padding:16px 24px;border-radius:4px;background:linear-gradient(135deg,#2d1810e6,#1a0f0af2);border:2px solid var(--gold-dark);box-shadow:inset 0 0 20px #0000004d,0 4px 16px #0000004d}.banner__status{color:var(--gold-light);margin:0;font-family:Cinzel,serif;font-size:.9rem}.banner__error{color:var(--mana-red);margin:0;font-family:Cinzel,serif;font-size:.9rem;text-shadow:0 0 10px rgba(211,32,41,.3)}.lobby{display:grid;gap:24px;padding:28px;background:linear-gradient(135deg,#2d1810d9,#1a0f0ae6);border:3px solid var(--gold-dark);border-radius:4px;box-shadow:inset 0 0 30px #0000004d,0 8px 32px #0006}.lobby h2{margin:0 0 8px;color:var(--gold);font-size:1.4rem;text-shadow:0 0 20px rgba(201,162,39,.3)}.lobby>div>p{margin:0;color:var(--parchment-light)}.lobby__header{display:flex;flex-wrap:wrap;gap:24px;align-items:flex-start;justify-content:space-between}.lobby__id{padding:16px 20px;border-radius:4px;background:linear-gradient(135deg,var(--parchment-light) 0%,var(--parchment) 100%);border:2px solid var(--gold);min-width:280px;color:var(--mahogany);box-shadow:inset 0 0 10px #3d23141a,0 4px 12px #0000004d}.lobby__id span{display:block;font-family:Cinzel,serif;font-size:.65rem;letter-spacing:.2em;text-transform:uppercase;color:var(--mahogany-light);margin-bottom:8px}.lobby__id-row{display:flex;gap:10px;align-items:center;margin-bottom:8px}.lobby__id-row:last-of-type{margin-bottom:0}.lobby__id-row code{font-family:Crimson Text,monospace;font-size:.85rem;background:#3d23141a;padding:6px 10px;border-radius:4px;word-break:break-all;flex:1;border:1px solid rgba(139,115,85,.3)}.lobby__id-row button{padding:8px 14px;font-size:.75rem}.status-pill{margin-top:12px;display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:4px;font-family:Cinzel,serif;font-size:.7rem;text-transform:uppercase;letter-spacing:.15em;border:1px solid var(--gold-dark);color:var(--mahogany);background:#ffffffe6}.status-dot{width:10px;height:10px;border-radius:50%;background:var(--gold-dark);box-shadow:0 0 6px currentColor;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.status-pill--connecting .status-dot{background:var(--gold);color:var(--gold)}.status-pill--connected .status-dot{background:var(--mana-green);color:var(--mana-green);animation:none}.status-pill--disconnected .status-dot{background:var(--gold-dark);color:var(--gold-dark);animation:none}.status-pill--error .status-dot{background:var(--mana-red);color:var(--mana-red);animation:pulse 1s ease-in-out infinite}.lobby__controls{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}.starting-life{display:flex;gap:12px;align-items:center}.starting-life input{width:100px;text-align:center;padding:10px;border:2px solid var(--gold-dark);border-radius:4px;background:#fffffff2;font-family:Cinzel,serif;font-size:1.1rem;font-weight:600;color:var(--mahogany)}.hint{margin:10px 0 0;color:var(--mahogany-light);font-size:.85rem;font-style:italic}.players{display:grid;gap:20px;animation:fadeUp .7s ease both}.players h2{margin:0;color:var(--gold);font-size:1.3rem;text-shadow:0 0 20px rgba(201,162,39,.3)}.players__header{display:flex;justify-content:space-between;align-items:baseline;gap:16px}.players__you{font-family:Cinzel,serif;font-size:1rem;color:var(--gold-light)}.player-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}.player-card{position:relative;padding:24px;border-radius:8px;background:linear-gradient(135deg,#2d1810e6,#1a0f0af2);border:3px solid var(--gold-dark);display:flex;flex-direction:column;align-items:center;gap:16px;min-height:200px;box-shadow:inset 0 0 30px #0000004d,0 8px 24px #0006;transition:transform .3s ease,box-shadow .3s ease}.player-card:hover{transform:translateY(-4px);box-shadow:inset 0 0 30px #0000004d,0 12px 32px #00000080,0 0 20px #c9a2271a}.player-card--self{border-color:var(--gold);box-shadow:inset 0 0 30px #0000004d,0 0 30px #c9a22733,0 8px 24px #0006}.player-card--self:hover{box-shadow:inset 0 0 30px #0000004d,0 0 40px #c9a2274d,0 12px 32px #00000080}.player-card__name{margin:0;font-family:Cinzel,serif;font-size:.85rem;color:var(--gold);text-transform:uppercase;letter-spacing:.15em;text-align:center}.player-card__life-container{position:relative;display:flex;align-items:center;justify-content:center}.player-card__life{margin:0;font-family:Cinzel,serif;font-size:3.5rem;font-weight:700;color:var(--parchment-light);text-shadow:0 0 20px rgba(232,212,184,.3),0 2px 4px rgba(0,0,0,.5);width:120px;height:80px;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at center,#3d231466,#1a0f0a99);border:3px solid var(--gold);border-radius:50%;box-shadow:inset 0 0 20px #0006,0 0 15px #c9a2274d}.player-card__actions{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;width:100%}.player-card__actions button{padding:10px 0;font-size:1rem;background:linear-gradient(180deg,var(--mahogany-light) 0%,var(--mahogany) 50%,var(--mahogany-dark) 100%);color:var(--parchment-light);border:2px solid var(--gold-dark);text-shadow:0 1px 2px rgba(0,0,0,.5)}.player-card__actions button:hover:not(:disabled){background:linear-gradient(180deg,#7a4a2a 0%,var(--mahogany-light) 50%,var(--mahogany) 100%);border-color:var(--gold);box-shadow:0 0 15px #c9a2274d,0 4px 8px #0000004d}.player-card .hint{color:var(--parchment-dark);text-align:center;margin-top:auto}.updates{display:grid;gap:16px;padding:24px;border-radius:4px;background:linear-gradient(135deg,var(--parchment-light) 0%,var(--parchment) 50%,var(--parchment-dark) 100%);border:3px solid var(--gold);box-shadow:inset 0 0 30px #3d231426,0 8px 32px #0006;color:var(--parchment-text);animation:fadeUp .8s ease both;position:relative}.updates:before,.updates:after{content:"";position:absolute;left:50%;transform:translate(-50%);width:60%;height:4px;background:linear-gradient(90deg,transparent 0%,var(--gold-dark) 20%,var(--gold) 50%,var(--gold-dark) 80%,transparent 100%);border-radius:2px}.updates:before{top:8px}.updates:after{bottom:8px}.updates h2{margin:8px 0 4px;font-size:1.1rem;color:var(--mahogany);text-align:center;text-transform:uppercase;letter-spacing:.15em}.updates .hint{text-align:center;color:var(--mahogany-light)}.updates__list{list-style:none;margin:0;padding:0;display:grid;gap:10px}.updates__item{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:center;padding:12px 16px;border-radius:4px;background:#ffffffb3;border:1px solid var(--gold-dark);box-shadow:inset 0 1px #ffffff80}.updates__item--gain{border-left:4px solid var(--mana-green);background:linear-gradient(90deg,#00733e1a,#ffffffb3 20%)}.updates__item--loss{border-left:4px solid var(--mana-red);background:linear-gradient(90deg,#d320291a,#ffffffb3 20%)}.updates__time{font-family:Cinzel,serif;font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;padding:6px 12px;border-radius:4px;background:var(--mahogany);color:var(--parchment-light)}.updates__message{font-size:.95rem;color:var(--mahogany)}.deckmaster-badge{display:flex;justify-content:center;margin-top:16px;padding:12px 24px;font-family:Cinzel,serif;font-size:.7rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold-dark);border-top:1px solid rgba(139,115,85,.3);border-bottom:1px solid rgba(139,115,85,.3)}.ornament{display:flex;align-items:center;justify-content:center;gap:16px;margin:8px 0;color:var(--gold-dark)}.ornament:before,.ornament:after{content:"";flex:1;max-width:100px;height:1px;background:linear-gradient(90deg,transparent,var(--gold-dark),transparent)}.ornament__symbol{font-size:1.2rem;color:var(--gold);text-shadow:0 0 10px rgba(201,162,39,.3)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes glow{0%,to{box-shadow:inset 0 0 30px #0000004d,0 0 20px #c9a22733}50%{box-shadow:inset 0 0 30px #0000004d,0 0 30px #c9a22766}}@media(max-width:720px){#root{padding:32px 16px 60px}.hero{gap:32px}.hero__panel{grid-template-columns:1fr}.lobby__header{flex-direction:column;align-items:stretch}.lobby__id{min-width:auto}.player-card__actions{grid-template-columns:repeat(2,1fr)}.player-card__life{font-size:2.8rem;width:100px;height:70px}}