@import"https://fonts.googleapis.com/css2?family=Orbitron:wght@400;600&family=Share+Tech+Mono&display=swap";:root{--bg: #020b05;--bg-glow: #062112;--panel: rgba(6, 25, 15, .92);--panel-border: rgba(132, 255, 145, .25);--accent: #b7ff7a;--accent-strong: #e1ff9c;--text: #d6ffd9;--text-muted: rgba(183, 255, 122, .65);--warning: #ffef5c;--danger: #ff6c6c;--shadow: 0 0 30px rgba(117, 255, 135, .15)}*{box-sizing:border-box}body{margin:0;min-height:100vh;font-family:Share Tech Mono,Orbitron,IBM Plex Mono,monospace;background:radial-gradient(circle at 20% 20%,rgba(9,45,28,.4),transparent 45%),radial-gradient(circle at 80% 0%,rgba(10,65,40,.3),transparent 35%),linear-gradient(135deg,#010402,#031208,#010402);color:var(--text);letter-spacing:.04em}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(rgba(183,255,122,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(183,255,122,.04) 1px,transparent 1px);background-size:60px 60px;mix-blend-mode:color-dodge;pointer-events:none;z-index:-1}#root{min-height:100vh}.app-background{min-height:100vh;padding:2.5rem 1.25rem 3rem;display:flex;justify-content:center;align-items:flex-start}.app-shell{width:min(1100px,100%);background:var(--panel);border:1px solid var(--panel-border);border-radius:18px;padding:2rem;position:relative;overflow:hidden;box-shadow:var(--shadow)}.app-shell:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(transparent 0%,rgba(183,255,122,.03) 50%,transparent 100%);background-size:100% 4px;animation:scanlines 6s linear infinite;pointer-events:none}@keyframes scanlines{0%{background-position-y:0}to{background-position-y:100%}}.app-header{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;padding-bottom:1.25rem;border-bottom:1px solid var(--panel-border);position:relative}.header-actions{display:flex;align-items:center;gap:.75rem}.app-header h1{font-family:Orbitron,Share Tech Mono,monospace;letter-spacing:.25em;font-size:clamp(1.8rem,3vw,2.4rem);margin:0;color:var(--accent)}.header-kicker{font-size:.9rem;text-transform:uppercase;color:var(--text-muted);letter-spacing:.4em;margin:0 0 .3rem}.status-pill{border:1px solid var(--panel-border);padding:.75rem 1rem;border-radius:999px;background:#b7ff7a14;color:var(--accent);display:flex;flex-direction:column;text-align:right;font-size:.9rem}.status-pill strong{font-size:1.15rem;color:var(--accent-strong)}.audio-toggle{width:46px;height:46px;border-radius:50%;border:1px solid rgba(183,255,122,.5);background:radial-gradient(circle at 50% 50%,#b7ff7a2e,#0006);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;position:relative;box-shadow:0 0 18px #b7ff7a33,inset 0 0 10px #00000073;transition:border-color .12s ease,box-shadow .16s ease,transform .12s ease}.audio-toggle:hover{border-color:#b7ff7ae6;box-shadow:0 0 20px #b7ff7a4d,inset 0 0 12px #00000080;transform:translateY(-1px)}.audio-toggle:active{transform:translateY(0);box-shadow:0 0 16px #b7ff7a40,inset 0 0 14px #0000008c}.audio-icon{position:relative;display:inline-flex;align-items:center;justify-content:center}.audio-icon-svg{width:22px;height:22px;stroke:none;fill:none}.speaker-body{fill:var(--accent);filter:drop-shadow(0 0 6px rgba(183,255,122,.4))}.speaker-wave{stroke:var(--accent);stroke-width:1.75;stroke-linecap:round;opacity:.95;filter:drop-shadow(0 0 6px rgba(183,255,122,.4));transition:opacity .12s ease}.audio-toggle.muted .speaker-wave{opacity:.2}.audio-toggle:after{content:"";position:absolute;top:-3px;right:-3px;bottom:-3px;left:-3px;border-radius:50%;border:1px solid rgba(183,255,122,.25);pointer-events:none}.audio-slash{position:absolute;width:26px;height:2px;background:linear-gradient(90deg,transparent 8%,rgba(183,255,122,.85) 25%,rgba(183,255,122,.85) 75%,transparent 92%);transform:rotate(-32deg);filter:drop-shadow(0 0 4px rgba(183,255,122,.35))}.audio-toggle.muted{border-color:#b7ff7a40;box-shadow:0 0 12px #b7ff7a1f,inset 0 0 10px #00000080}.section-card{margin-top:2rem;border:1px solid var(--panel-border);border-radius:16px;padding:1.75rem;background:#0003;box-shadow:inset 0 0 30px #00000040;position:relative}.section-card:before{content:"";position:absolute;top:12px;right:12px;bottom:12px;left:12px;border:1px solid rgba(183,255,122,.1);border-radius:10px;pointer-events:none}.section-header{margin-bottom:1.5rem}.section-kicker{text-transform:uppercase;letter-spacing:.45em;font-size:.75rem;color:var(--text-muted);margin:0}.section-title{margin:.2rem 0;text-transform:uppercase;letter-spacing:.3em;font-size:1.4rem;color:var(--accent)}.section-subtitle{margin:0;font-size:.9rem;color:var(--text-muted)}.data-sync-banner{display:flex;flex-wrap:wrap;gap:1rem;align-items:center;justify-content:space-between;margin-bottom:1.5rem;padding:.9rem 1.2rem;border:1px solid rgba(183,255,122,.35);border-radius:12px;background:#00000059}.data-sync-banner strong{display:block;font-size:.95rem;color:var(--accent-strong);letter-spacing:.15em}.data-sync-banner button{flex-shrink:0}.data-sync-error{margin:-.5rem 0 1.25rem;padding:.75rem 1rem;border-radius:10px;border:1px solid rgba(255,108,108,.4);background:#ff6c6c14;color:var(--danger);font-size:.85rem;letter-spacing:.08em}.control-grid{display:grid;gap:1.25rem;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.options-expander{margin-top:1.5rem;border:1px solid rgba(183,255,122,.25);border-radius:14px;background:#00000040}.options-expander summary{cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.9rem 1.1rem;color:var(--accent);text-transform:uppercase;letter-spacing:.3em}.options-expander summary::-webkit-details-marker,.options-expander summary::marker{display:none}.options-expander[open] summary{border-bottom:1px solid rgba(183,255,122,.2)}.options-pill{font-size:.7rem;letter-spacing:.2em;color:var(--text-muted)}.options-body{padding:1rem 1.1rem 1.2rem}.option-toggle{display:flex;gap:.85rem;align-items:flex-start}.option-toggle input{margin-top:.4rem;transform:scale(1.2);accent-color:var(--accent)}.option-toggle strong{text-transform:uppercase;letter-spacing:.2em;color:var(--accent-strong)}.option-toggle p{margin:.2rem 0 0;font-size:.85rem;color:var(--text-muted)}.option-inline{margin:.9rem 0 1rem;display:flex;flex-direction:column;gap:.35rem}.keyword-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.35rem .65rem}.keyword-toggle{display:flex;align-items:center;gap:.4rem;text-transform:capitalize;color:var(--text);font-size:.95rem}.keyword-toggle input{accent-color:var(--accent);transform:scale(1.05)}.control label{display:block;margin-bottom:.5rem;text-transform:uppercase;font-size:.8rem;color:var(--text-muted);letter-spacing:.3em}.holo-input,.holo-select{width:100%;background:#00000073;border:1px solid rgba(183,255,122,.4);color:var(--text);border-radius:10px;padding:.75rem 1rem;font-family:inherit;font-size:1rem;outline:none;transition:border-color .2s,box-shadow .2s}.holo-input:focus,.holo-select:focus{border-color:var(--accent);box-shadow:0 0 12px #b7ff7a66}.action-bar{margin-top:1.75rem;display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}.holo-button{border:1px solid rgba(183,255,122,.5);background:#082311e6;color:var(--accent-strong);padding:.85rem 1.6rem;text-transform:uppercase;letter-spacing:.3em;font-size:.9rem;border-radius:999px;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,background .15s ease}.holo-button.primary{background:linear-gradient(120deg,#b7ff7a59,#22aa5aa6);color:#041206;font-weight:700;box-shadow:0 0 25px #b7ff7a73}.holo-button:disabled{opacity:.3;cursor:not-allowed;box-shadow:none}.holo-button:not(:disabled):hover{transform:translateY(-2px);box-shadow:0 10px 25px #b7ff7a66}.draft-layout{display:flex;flex-direction:column;gap:1.5rem}@media (min-width: 900px){.draft-layout{flex-direction:row;align-items:flex-start}}.offer-grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}.detachment-panel{border:1px dashed rgba(183,255,122,.4);border-radius:16px;padding:1.5rem;background:#00000040}.detachment-offer-grid{margin-top:1.25rem;display:grid;gap:1rem;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:1fr;align-items:stretch}@media (max-width: 960px){.detachment-offer-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}}.detachment-card{border:1px solid rgba(183,255,122,.45);border-radius:14px;padding:1rem;background:#0006;color:var(--text);text-align:left;display:flex;flex-direction:column;justify-content:flex-start;gap:.35rem;cursor:pointer;transition:border-color .2s ease,transform .2s ease;position:relative;overflow:hidden}.detachment-card:hover{border-color:#b7ff7ae6;transform:translateY(-2px)}.detachment-card-head{display:flex;align-items:flex-start;gap:.75rem;justify-content:space-between}.detachment-card-title{display:flex;flex-direction:column;gap:.35rem}.detachment-card-title strong{font-size:1.05rem;color:var(--accent-strong)}.detachment-card-title span{font-size:.8rem;color:var(--text-muted)}.detachment-info-button{width:36px;height:36px;aspect-ratio:1 / 1;border-radius:50%;border:1px solid rgba(183,255,122,.6);background:#00000059;color:var(--accent-strong);font-weight:700;display:inline-flex;align-items:center;justify-content:center;padding:0;flex-shrink:0;cursor:pointer;transition:border-color .2s ease,transform .2s ease}.detachment-info-button:hover{border-color:#b7ff7af2;transform:translateY(-1px)}.detachment-abilities{flex:1;display:flex;flex-direction:column;gap:.65rem}.detachment-ability-title{font-size:.9rem;color:var(--accent);letter-spacing:.08em;text-transform:uppercase}.detachment-ability-text{font-size:.85rem;color:var(--text-muted);line-height:1.35;white-space:pre-line}.detachment-ability.extra{font-size:.8rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.15em}.detachment-ability-type{font-size:.78rem;color:var(--text-muted);letter-spacing:.1em;text-transform:uppercase}.detachment-card-foot{font-size:.8rem;text-transform:uppercase;letter-spacing:.2em;color:var(--text-muted);text-align:center;margin-top:auto;padding-top:.2rem}.detachment-form{display:flex;flex-direction:column;gap:.75rem;margin-top:1.25rem}.detachment-form label{font-size:.85rem;text-transform:uppercase;letter-spacing:.25em;color:var(--text-muted)}.detachment-form input{border:1px solid rgba(183,255,122,.4);border-radius:12px;padding:.9rem 1rem;background:#04140aa6;color:var(--text);font:inherit}.detachment-form input:focus{outline:none;border-color:#b7ff7ae6;box-shadow:0 0 15px #b7ff7a59}.detachment-modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#04140ab3;display:flex;align-items:center;justify-content:center;padding:1.5rem;z-index:1000}.detachment-modal{background:#000000bf;border:1px solid rgba(183,255,122,.5);border-radius:16px;padding:1.25rem 1.5rem;max-width:900px;width:min(900px,100%);box-shadow:0 20px 60px #00000073}.detachment-modal-header{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1rem}.detachment-modal-title{margin:.35rem 0}.detachment-modal-source{font-size:.9rem;color:var(--text-muted)}.detachment-modal-body{display:flex;flex-direction:column;gap:.85rem}.unit-card{border:1px solid rgba(183,255,122,.4);border-radius:14px;padding:1rem;text-align:left;background:#0006;color:var(--text);min-height:160px;display:flex;flex-direction:column;justify-content:space-between;position:relative}.unit-card.locking,.detachment-card.locking{border-color:#ffc478f2;box-shadow:0 0 24px #ff94444d,0 0 48px #ffc67a66,inset 0 0 24px #ffba6e8c;animation:lock-press .14s ease-out,lock-shudder .52s ease-in-out 90ms 2,lock-rune-glow 2s ease-out;transform:translateZ(0)}.unit-card.locking:before,.detachment-card.locking:before{content:"";position:absolute;top:-14%;right:-14%;bottom:-14%;left:-14%;background:radial-gradient(circle,rgba(255,190,110,.24) 0%,rgba(255,190,110,.1) 42%,transparent 64%),linear-gradient(90deg,rgba(255,164,92,.34) 0 12%,transparent 12% 88%,rgba(255,164,92,.34) 88% 100%),linear-gradient(180deg,rgba(255,164,92,.28) 0 10%,transparent 10% 90%,rgba(255,164,92,.3) 90% 100%),conic-gradient(from 30deg,transparent 0deg 24deg,rgba(255,148,68,.32) 24deg 36deg,transparent 36deg 78deg,rgba(255,148,68,.38) 78deg 96deg,transparent 96deg 138deg,rgba(255,148,68,.32) 138deg 160deg,transparent 160deg 200deg,rgba(255,148,68,.34) 200deg 222deg,transparent 222deg 260deg,rgba(255,148,68,.36) 260deg 286deg,transparent 286deg 328deg,rgba(255,148,68,.3) 328deg 350deg,transparent 350deg 360deg);mix-blend-mode:screen;filter:drop-shadow(0 0 14px rgba(255,190,110,.32));animation:lock-rune-ring 2s ease-out forwards,lock-rune-flicker .24s steps(2) 3;pointer-events:none}.unit-card.locking:after,.detachment-card.locking:after{content:"";position:absolute;top:10px;right:10px;bottom:10px;left:10px;border-radius:12px;border:1px solid rgba(255,196,120,.65);box-shadow:0 0 24px #ffbe6e66,inset 0 0 14px #ffb05e66;background:repeating-linear-gradient(90deg,transparent 0 22px,rgba(255,168,92,.34) 22px 26px,transparent 26px 48px),repeating-linear-gradient(0deg,transparent 0 20px,rgba(255,132,60,.32) 20px 24px,transparent 24px 46px),linear-gradient(120deg,rgba(255,214,150,.16),transparent 60%),radial-gradient(circle,rgba(255,186,110,.14),transparent 58%);mix-blend-mode:screen;animation:lock-glyph-sweep 2s ease-out forwards,lock-rune-flicker .22s steps(2) 4;pointer-events:none}button.unit-card{cursor:pointer;font:inherit}button.unit-card:disabled{cursor:not-allowed}.unit-card strong{font-size:1.1rem;color:var(--accent-strong)}.unit-card small{color:var(--text-muted)}.unit-card .unit-points{font-size:1.2rem;color:var(--accent)}.unit-card-foot{margin-top:.75rem;padding-top:.75rem;border-top:1px solid rgba(183,255,122,.25);display:flex;flex-direction:column;align-items:stretch;gap:.5rem;font-size:.85rem}.unit-size-label{text-transform:uppercase;letter-spacing:.25em;color:var(--text-muted)}.unit-size-toggle{text-transform:uppercase;letter-spacing:.2em;font-size:.7rem;border:1px solid rgba(183,255,122,.4);border-radius:999px;padding:.2rem .6rem;cursor:pointer;color:var(--accent)}.unit-size-toggle:hover{background:#b7ff7a1a}.unit-size-splitter{display:flex;width:100%;border:1px solid rgba(183,255,122,.4);background:#b7ff7a0f;border-radius:12px;overflow:hidden;box-shadow:0 0 12px #b7ff7a26}.unit-size-segment{flex:1;padding:.5rem .35rem;display:flex;flex-direction:column;gap:.15rem;align-items:center;justify-content:center;text-align:center;cursor:pointer;background:linear-gradient(180deg,#b7ff7a1a,#b7ff7a05);color:#fff;transition:background .14s ease,box-shadow .14s ease}.unit-size-segment+.unit-size-segment{border-left:1px solid rgba(183,255,122,.25)}.unit-size-segment:hover,.unit-size-segment:focus-visible{background:linear-gradient(180deg,#b7ff7a29,#b7ff7a0f);box-shadow:inset 0 0 12px #b7ff7a33}.unit-size-segment.active{background:linear-gradient(180deg,#b7ff7a3d,#b7ff7a14);box-shadow:inset 0 0 18px #b7ff7a47}.unit-size-segment-label{font-size:.8rem;letter-spacing:.12em}.unit-size-segment-points{font-size:.78rem;color:var(--accent)}.unit-size-note{text-transform:uppercase;font-size:.7rem;color:var(--text-muted)}.unit-size-pill{margin-top:.2rem;font-size:.8rem;color:var(--accent)}.unit-card.disabled{opacity:.4;border-color:#ff6c6c66}.unit-card .badge{margin-top:.6rem;font-size:.75rem;text-transform:uppercase;letter-spacing:.3em}.unit-card .badge.danger{color:var(--danger)}.unit-card.enhancement-card{border-style:dashed}.unit-card.placeholder-card{border-style:dotted;opacity:.5;justify-content:center;text-align:center}@keyframes lock-press{0%{transform:translateY(0)}28%{transform:translateY(4px) scale(.985)}to{transform:translateY(0) scale(1)}}@keyframes lock-shudder{0%{transform:translate(0)}20%{transform:translate(-1px)}40%{transform:translate(1.5px)}60%{transform:translate(-.75px)}80%{transform:translate(.5px)}to{transform:translate(0)}}@keyframes lock-rune-glow{0%{box-shadow:0 0 10px #ffac5852,inset 0 0 12px #ff984847}12%{box-shadow:0 0 42px #ffbc6eb3,inset 0 0 26px #ffba6ea6}42%{box-shadow:0 0 58px #ffce92bf,inset 0 0 34px #ffc478b3}72%{box-shadow:0 0 36px #ffbc6e8c,inset 0 0 18px #ffac5880}to{box-shadow:0 0 18px #ffa24e52,inset 0 0 10px #ff944447}}@keyframes lock-rune-ring{0%{opacity:.8;transform:scale(.9) rotate(0)}30%{opacity:1;transform:scale(1.02) rotate(2deg)}62%{opacity:.55;transform:scale(1.08) rotate(-1deg)}to{opacity:.28;transform:scale(1.05) rotate(0)}}@keyframes lock-glyph-sweep{0%{background-position:-180px 0,0 180px,0 0,0 0;opacity:.65}22%{background-position:-60px 0,0 60px,0 0,0 0;opacity:1}55%{background-position:0 0,0 0,0 0,0 0;opacity:.9}78%{background-position:36px -24px,-24px 36px,0 0,0 0;opacity:.65}to{background-position:60px -40px,-40px 60px,0 0,0 0;opacity:.45}}@keyframes lock-rune-flicker{0%{opacity:.4}25%{opacity:.95}50%{opacity:.55}75%{opacity:.9}to{opacity:.35}}.enhancement-card .enhancement-target{margin-top:.4rem;font-size:.8rem;color:#fffc}.enhancement-pill{margin-top:.25rem;font-size:.85rem;color:#8ef}.reroll-row{margin-top:1.25rem;display:flex;align-items:center;gap:.9rem;flex-wrap:wrap}.roster-panel{border:1px solid rgba(183,255,122,.4);border-radius:16px;padding:1.25rem;background:#00000059;width:100%}.detachment-pill{border:1px solid rgba(183,255,122,.4);border-radius:12px;padding:.5rem .9rem;margin-bottom:.75rem;display:inline-flex;flex-direction:column;gap:.2rem}.detachment-pill span{font-size:.7rem;text-transform:uppercase;letter-spacing:.3em;color:var(--text-muted)}.detachment-pill strong{color:var(--accent)}.detachment-pill.pending{border-style:dashed;color:var(--text-muted)}@media (min-width: 900px){.roster-panel{max-width:320px}}.roster-panel h3{margin-top:0;color:var(--accent);letter-spacing:.2em;text-transform:uppercase}.roster-panel ul{list-style:none;padding:0;margin:1rem 0;max-height:320px;overflow-y:auto}.roster-panel li{padding:.35rem 0;border-bottom:1px solid rgba(183,255,122,.08);font-size:.95rem}.roster-panel li:last-child{border-bottom:none}.review-list{list-style:none;padding:0;margin:1.5rem 0;border-top:1px solid rgba(183,255,122,.1)}.review-list li{padding:.75rem 0;border-bottom:1px solid rgba(183,255,122,.1)}.review-stats{display:flex;flex-wrap:wrap;gap:2rem;align-items:baseline;font-size:1.1rem}.review-stats strong{color:var(--accent-strong);font-size:1.6rem}.footer{margin-top:2.5rem;padding-top:1.25rem;border-top:1px solid var(--panel-border);font-size:.75rem;color:var(--text-muted);text-align:center}.footer strong{color:var(--accent)}
