:root{--ccx-bg: #050b14;--ccx-panel: rgba(10, 22, 34, .92);--ccx-border: rgba(120, 170, 210, .25);--ccx-text: #cfe2f0;--ccx-dim: #7d95ab;--ccx-amber: #ffb347;--ccx-own: #6ac8e8;--ccx-foe: #e88c6a}html,body{margin:0;padding:0;height:100%;overflow:hidden;background:var(--ccx-bg);color:var(--ccx-text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Noto Sans CJK SC,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;-webkit-font-smoothing:antialiased}.ccx-app{position:relative;width:100%;height:100%;overflow:hidden}.ccx-canvas{display:block;width:100%;height:100%;touch-action:none}.ccx-hud{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 16px;background:linear-gradient(180deg,#050b14eb,#050b1400);pointer-events:none;opacity:0;transition:opacity .16s ease;z-index:30}.ccx-hud.is-visible{opacity:1}.ccx-hud__group{display:flex;align-items:center;gap:14px;flex-wrap:wrap;pointer-events:auto}.ccx-hud__item{display:flex;align-items:baseline;gap:6px;padding:4px 10px;border:1px solid var(--ccx-border);border-radius:4px;background:var(--ccx-panel)}.ccx-hud__label{font-size:11px;letter-spacing:.08em;color:var(--ccx-dim);text-transform:uppercase}.ccx-hud__value{font-family:SF Mono,Noto Sans Mono,monospace;font-size:15px;font-weight:600;color:var(--ccx-text);font-variant-numeric:tabular-nums}.ccx-hud__value--own{color:var(--ccx-own)}.ccx-hud__value--foe{color:var(--ccx-foe)}.ccx-btn{appearance:none;border:1px solid var(--ccx-border);border-radius:4px;background:var(--ccx-panel);color:var(--ccx-text);font-size:14px;padding:8px 16px;cursor:pointer;transition:background .14s ease,border-color .14s ease;font-family:inherit}.ccx-btn:hover{background:#1e3c5af2;border-color:#8cbee673}.ccx-btn:active{transform:translateY(1px)}.ccx-btn--hud{padding:5px 12px;font-size:13px}.ccx-btn--primary{background:#ffb34729;border-color:#ffb34780;color:var(--ccx-amber);font-weight:600;font-size:15px;padding:11px 28px}.ccx-btn--primary:hover{background:#ffb34747;border-color:var(--ccx-amber)}.ccx-overlay{position:absolute;inset:0;display:none;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 40%,#0a1e30d9,#03070cf5);z-index:20;padding:20px;overflow-y:auto}.ccx-overlay.is-visible{display:flex}.ccx-modal{width:min(520px,100%);padding:28px 30px;border:1px solid var(--ccx-border);border-radius:8px;background:#08121cf7;box-shadow:0 20px 60px #0009}.ccx-modal__title{margin:0 0 10px;font-size:26px;letter-spacing:.06em;color:var(--ccx-amber);font-weight:600}.ccx-modal__sub{margin:0 0 20px;font-size:13px;line-height:1.7;color:var(--ccx-dim)}.ccx-modal__hint{margin:16px 0 0;font-size:12px;color:var(--ccx-dim);line-height:1.6}.ccx-modal__actions{display:flex;gap:10px;margin-top:22px;flex-wrap:wrap}.ccx-modal__actions .ccx-btn{flex:1 1 auto}.ccx-form{display:flex;flex-direction:column;gap:14px;margin-bottom:22px}.ccx-form__row{display:flex;align-items:center;gap:14px}.ccx-form__label{min-width:44px;font-size:12px;letter-spacing:.08em;color:var(--ccx-dim);text-transform:uppercase}.ccx-chips{display:flex;gap:8px;flex-wrap:wrap}.ccx-chip{appearance:none;border:1px solid var(--ccx-border);border-radius:3px;background:transparent;color:var(--ccx-dim);font-size:13px;padding:7px 14px;cursor:pointer;font-family:inherit;transition:all .14s ease}.ccx-chip:hover{border-color:#8cbee673;color:var(--ccx-text)}.ccx-chip.is-active{background:#ffb34724;border-color:var(--ccx-amber);color:var(--ccx-amber)}.ccx-stats{display:flex;flex-direction:column;gap:1px;margin:18px 0 4px;border:1px solid var(--ccx-border);border-radius:4px;overflow:hidden}.ccx-stats__row{display:flex;justify-content:space-between;padding:9px 14px;background:#0e1c2ab3;font-size:13px}.ccx-stats__label{color:var(--ccx-dim)}.ccx-stats__value{font-family:SF Mono,Noto Sans Mono,monospace;font-variant-numeric:tabular-nums;color:var(--ccx-text)}.ccx-ui-root{position:absolute;inset:56px 0 0;pointer-events:none;z-index:15}.ccx-ui-root>*{pointer-events:auto}@media (max-width: 899px){.ccx-modal{padding:22px 18px}.ccx-modal__title{font-size:21px}.ccx-hud{padding:8px 10px}.ccx-hud__group{gap:8px}.ccx-hud__item{padding:3px 7px}.ccx-hud__value{font-size:13px}}
