@import "https://fonts.googleapis.com/css2?family=Cinzel:wght@500;700&family=Spectral:wght@400;600&display=swap";:root{--bg-deep:#13172a;--bg-surface:#1d2542;--bg-surface-2:#252f54;--ink:#ebe7d8;--ink-soft:#b9b8c6;--gold:#c6a763;--green-active:#2c9f62;--gray-upcoming:#7d8296;--red-hp:#d45757;--border:#3a4474}*{box-sizing:border-box}body{min-height:100vh;color:var(--ink);background:radial-gradient(circle at 5% 10%,#c6a76329,#0000 30%),radial-gradient(circle at 80% 20%,#3c247852,#0000 38%),linear-gradient(150deg,#101327 0%,#1a1a2e 45%,#1a2240 100%);margin:0;font-family:Spectral,serif}#root{min-height:100vh}h1,h2,h3,h4{letter-spacing:.04em;margin:0;font-family:Cinzel,serif}.app-shell{width:min(1380px,100% - 2rem);margin:1rem auto 2rem}.top-banner{border:1px solid var(--border);background:linear-gradient(160deg,#1f2a50,#171f39);border-radius:14px;grid-template-columns:1.2fr 1fr auto;align-items:end;gap:1rem;padding:1rem;display:grid;box-shadow:0 16px 48px #00000073}.top-banner h1{color:#e6d5a9;font-size:clamp(1.4rem,2.4vw,2rem)}label{color:var(--ink-soft);flex-direction:column;gap:.32rem;font-weight:600;display:flex}input,select,button{font:inherit}input,select{color:var(--ink);border:1px solid var(--border);background:#121a30;border-radius:8px;padding:.45rem .62rem}.layout-grid{grid-template-columns:1.1fr .9fr;gap:1rem;margin-top:1rem;display:grid}.panel{border:1px solid var(--border);background:linear-gradient(#232d52f0,#151b32f2);border-radius:14px;padding:1rem}.panel h2{margin-bottom:.9rem;font-size:1.35rem}.quick-add{flex-wrap:wrap;gap:.45rem;margin-bottom:.85rem;display:flex}.btn-quick,.btn-primary,.btn-outline,.btn-danger{cursor:pointer;border:1px solid #0000;border-radius:10px;padding:.5rem .8rem;transition:transform .16s,filter .16s,opacity .16s}.btn-quick:hover,.btn-primary:hover,.btn-outline:hover,.btn-danger:hover{filter:brightness(1.08);transform:translateY(-1px)}.btn-quick{color:var(--ink);background:#2c3e77;border-color:#43539b}.btn-primary{color:#eff6ef;background:#2d7e52;border-color:#419966}.btn-outline{color:#d4d8e8;background:0 0;border-color:#6b7397}.btn-danger{color:#fce8ed;background:#7d2c3f;border-color:#b04560}button:disabled{opacity:.55;cursor:not-allowed;transform:none}.monster-form{grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem;margin-bottom:1rem;display:grid}.monster-form .btn-primary{align-self:end}.monster-list{gap:.7rem;display:grid}.monster-card{background:linear-gradient(150deg,#131b38f5,#1d2442f0);border:1px solid #415085;border-radius:12px;padding:.75rem}.monster-card.dragging{opacity:.72}.monster-header{grid-template-columns:auto 1fr auto;align-items:center;gap:.55rem;margin-bottom:.7rem;display:grid}.drag-handle{color:var(--ink);cursor:grab;background:#243562;border:1px solid #415085;border-radius:8px;width:2rem;height:2rem}.spawn-pill{border-radius:999px;padding:.22rem .6rem;font-size:.8rem}.spawn-pill.active{border:1px solid var(--green-active);background:#2c9f6240}.spawn-pill.upcoming{border:1px solid var(--gray-upcoming);background:#7e83963d}.card-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem;display:grid}.hp-section{margin-top:.7rem}.hp-inputs{align-items:center;gap:.4rem;display:inline-flex}.hp-inputs input{width:5rem}.hp-bar{background:#2a2f48;border:1px solid #404563;border-radius:999px;width:100%;height:10px;margin-top:.4rem;overflow:hidden}.hp-bar span{background:linear-gradient(90deg,#c44,#e56565);height:100%;display:block}.status-list{flex-wrap:wrap;gap:.4rem;margin-top:.7rem;display:flex}.status-chip{color:var(--ink);background:#82889b26;border:1px solid #69708f;border-radius:999px;padding:.2rem .5rem}.status-chip.on{background:#845328;border-color:#be8b50}.card-actions{gap:.55rem;margin-top:.7rem;display:flex}.turn-indicator{text-align:center;color:#d3f0ff;background:#10283f;border:1px solid #365d89;border-radius:10px;padding:.55rem .7rem}.timeline{gap:.5rem;margin-bottom:1rem;display:grid}.timeline-step{background:#1a1d34d9;border:1px solid #3c4267;border-radius:10px;grid-template-columns:90px 1fr;align-items:center;gap:.5rem;padding:.45rem .6rem;display:grid}.timeline-step.now{border-color:#d6b05e;box-shadow:0 0 0 1px #d6b05e99}.control-row{flex-wrap:wrap;gap:.55rem;margin-bottom:1rem;display:flex}.subpanel{background:#111831c7;border:1px solid #3a4165;border-radius:12px;margin-bottom:.8rem;padding:.75rem}.subpanel h3{margin-bottom:.55rem}.display-list{gap:.5rem;display:grid}.display-card{border:1px solid #4d5380;border-radius:10px;padding:.45rem .55rem}.display-card.active{background:#20664340;border-color:#2a8f59}.display-card.upcoming{background:#66687533;border-color:#7c7f8b}.hp-red{color:var(--red-hp)}.empty{color:#9ea3b8;margin:0}@media (width<=1080px){.layout-grid,.top-banner{grid-template-columns:1fr}}@media (width<=760px){.monster-form,.card-grid{grid-template-columns:1fr 1fr}.timeline-step{grid-template-columns:1fr}.card-actions{flex-direction:column}}@media (width<=520px){.monster-form,.card-grid{grid-template-columns:1fr}}