
:root{
  --aether-theme-primary:#7b57de;
  --aether-theme-primary-rgb:123, 87, 222;
  --aether-theme-primary-soft:#9e7fff;
  --aether-theme-primary-soft-rgb:158, 127, 255;
  --aether-theme-primary-deep:#4e338e;
  --aether-theme-primary-deep-rgb:78, 51, 142;
  --aether-theme-accent:#efc671;
  --aether-theme-accent-rgb:239, 198, 113;
  --aether-theme-accent-soft:#f8dfac;
  --aether-theme-accent-soft-rgb:248, 223, 172;
  --aether-theme-accent-deep:#b89549;
  --aether-theme-accent-deep-rgb:184, 149, 73;
  --arc-bg:#08060d;
  --arc-bg-rgb:8, 6, 13;
  --arc-bg-2:#100c18;
  --arc-bg-2-rgb:16, 12, 24;
  --arc-panel:#16111f;
  --arc-panel-rgb:22, 17, 31;
  --arc-panel-2:#21192d;
  --arc-panel-2-rgb:33, 25, 45;
  --arc-panel-3:#2b203b;
  --arc-panel-3-rgb:43, 32, 59;
  --arc-smoke:#171214;
  --arc-smoke-rgb:23, 18, 20;
  --arc-smoke-deep:#09070a;
  --arc-smoke-deep-rgb:9, 7, 10;
  --arc-ash:#5d554e;
  --arc-ash-rgb:93, 85, 78;
  --arc-relic:#7d6542;
  --arc-relic-rgb:125, 101, 66;
  --arc-relic-soft:#c9af87;
  --arc-relic-soft-rgb:201, 175, 135;
  --arc-parchment:#99836b;
  --arc-parchment-rgb:153, 131, 107;
  --arc-parchment-deep:#4d4137;
  --arc-parchment-deep-rgb:77, 65, 55;
  --arc-stain:#382b26;
  --arc-stain-rgb:56, 43, 38;
  --arc-burn:#1c100c;
  --arc-burn-rgb:28, 16, 12;
  --arc-void:#05040a;
  --arc-line:rgba(var(--aether-theme-primary-rgb),.42);
  --arc-line-soft:rgba(var(--aether-theme-primary-rgb),.22);
  --arc-gold-line:rgba(var(--aether-theme-accent-rgb),.28);
  --arc-text:#f6f0e6;
  --arc-text-soft:#d9cbe8;
  --arc-muted:#af9fc5;
  --arc-accent:var(--aether-theme-primary);
  --arc-accent-2:var(--aether-theme-primary-soft);
  --arc-accent-3:var(--aether-theme-primary-deep);
  --arc-gold:var(--aether-theme-accent);
  --arc-gold-soft:var(--aether-theme-accent-soft);
  --arc-danger:#b74a67;
  --arc-danger-2:#7e2748;
  --arc-success:#4fb986;
  --arc-shadow:0 22px 60px rgba(0,0,0,.44);
  --arc-shadow-soft:0 14px 34px rgba(0,0,0,.28);
  --arc-sheen:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0) 28%);
  --arc-panel-fill:linear-gradient(180deg, rgba(34,25,48,.94), rgba(16,12,24,.98));
  --arc-panel-fill-strong:linear-gradient(180deg, rgba(40,30,58,.97), rgba(16,12,24,.99));
}
html,body{
  background:
    radial-gradient(circle at 14% -5%, rgba(var(--aether-theme-primary-rgb),.25), transparent 28%),
    radial-gradient(circle at 86% 8%, rgba(var(--aether-theme-accent-rgb),.10), transparent 22%),
    radial-gradient(circle at 50% 120%, rgba(var(--aether-theme-primary-rgb),.12), transparent 36%),
    linear-gradient(180deg, var(--arc-bg-2), var(--arc-bg));
  color:var(--arc-text);
}
body{position:relative;}
body::before{
  content:""; position:fixed; inset:0; pointer-events:none; z-index:0;
  background:
    radial-gradient(circle at 20% 20%, rgba(255,255,255,.035), transparent 18%),
    radial-gradient(circle at 80% 28%, rgba(255,255,255,.02), transparent 20%),
    radial-gradient(circle at center, transparent 0 62%, rgba(0,0,0,.30) 100%);
  opacity:.9;
}
body::after{
  content:""; position:fixed; inset:0; pointer-events:none; z-index:0;
  background-image:
    linear-gradient(transparent 0, rgba(255,255,255,.026) 50%, transparent 100%),
    radial-gradient(circle, rgba(255,255,255,.08) .7px, transparent .8px);
  background-size:100% 3px, 20px 20px;
  opacity:.05; mix-blend-mode:screen;
}
#app,.portal-shell,.campaign-shell,.gm-shell,.characters-shell,.builder-shell{position:relative; z-index:1;}
*{scrollbar-width:thin; scrollbar-color:rgba(var(--aether-theme-primary-soft-rgb),.45) rgba(0,0,0,.14);}
*::-webkit-scrollbar{width:10px;height:10px;} *::-webkit-scrollbar-track{background:rgba(0,0,0,.12);} *::-webkit-scrollbar-thumb{background:linear-gradient(180deg, rgba(var(--aether-theme-primary-soft-rgb),.72), rgba(var(--aether-theme-primary-deep-rgb),.92)); border-radius:999px; border:2px solid transparent;}
button,input,select,textarea{transition:transform .14s ease, box-shadow .18s ease, border-color .2s ease, background .2s ease, color .2s ease, opacity .18s ease;}
button:active{transform:translateY(1px) scale(.985);} button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:none; box-shadow:0 0 0 1px rgba(var(--aether-theme-primary-soft-rgb),.34), 0 0 0 4px rgba(var(--aether-theme-primary-rgb),.16), 0 0 24px rgba(var(--aether-theme-primary-rgb),.12);}
@media (max-width: 860px){
  input,
  select,
  textarea,
  .gm-input,
  .gm-select,
  .gm-textarea,
  .portal-input,
  .characters-search,
  .characters-select,
  .characters-input,
  .characters-textarea,
  .cards-search,
  .message-thread-select{
    font-size:16px !important;
  }
}
.header,.portal-panel,.campaign-panel,.panel,.panel-card,.quick-card,.sheet-section,.sheet-hero,#quickview,.gm-panel,.gm-sidebar,.gm-main,.gm-card,.gm-detail,.gm-list-item,.gm-picker-shell,.characters-sidebar,.characters-detail,.character-card,.characters-modal-shell,.card-modal-shell,.gm-box{
  position:relative; background:var(--arc-panel-fill) !important; border:1px solid var(--arc-line) !important; box-shadow:var(--arc-shadow-soft), inset 0 1px 0 rgba(255,255,255,.05); backdrop-filter:blur(10px);
}
.header::before,.portal-panel::before,.campaign-panel::before,.panel::before,.panel-card::before,.quick-card::before,.sheet-section::before,.sheet-hero::before,#quickview::before,.gm-panel::before,.gm-sidebar::before,.gm-main::before,.gm-card::before,.gm-detail::before,.gm-list-item::before,.gm-picker-shell::before,.characters-sidebar::before,.characters-detail::before,.character-card::before,.characters-modal-shell::before,.card-modal-shell::before,.gm-box::before{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none; background:linear-gradient(140deg, rgba(248,223,172,.11), transparent 16%, transparent 78%, rgba(123,87,222,.12)), var(--arc-sheen);
}
.header,.portal-panel,.campaign-panel,.gm-panel,.characters-sidebar,.characters-detail{overflow:hidden;}
.header{background:linear-gradient(180deg, rgba(25,19,36,.98), rgba(14,11,22,.98)) !important; border-bottom:1px solid rgba(152,120,224,.34) !important; box-shadow:0 18px 40px rgba(0,0,0,.35), inset 0 -1px 0 rgba(255,255,255,.05) !important;}
.header .title,.portal-title,.campaign-title,.gm-title,.characters-title,.sheet-name{color:#fff7eb; letter-spacing:.05em; text-shadow:0 0 24px rgba(var(--aether-theme-primary-rgb),.24), 0 0 1px rgba(255,255,255,.3);} 
.portal-subtitle,.campaign-subtitle,.gm-sub,.characters-kicker,.section-title,.conditions-title,.quick-label,.gm-label,.sheet-subtitle{color:var(--arc-gold) !important; letter-spacing:.14em; text-transform:uppercase;}
.session,.quick-subvalue,.portal-status,.campaign-status,.character-card-meta,.character-card-owner,.character-card-summary,.gm-entry-sub,.gm-empty,.gm-box,.characters-subtitle{color:var(--arc-text-soft) !important;}
.panel,.panel-card,.quick-card,.gm-card,.gm-detail,.gm-list-item,.character-card,.portal-panel,.campaign-panel,.gm-panel,.gm-sidebar,.gm-main,.sheet-section,.sheet-hero,.gm-box{transition:transform .2s ease, box-shadow .22s ease, border-color .22s ease, filter .22s ease;}
.panel:hover,.panel-card:hover,.quick-card:hover,.gm-card:hover,.gm-detail:hover,.gm-list-item:hover,.character-card:hover,.portal-panel:hover,.campaign-panel:hover,.gm-panel:hover,.gm-sidebar:hover,.gm-main:hover,.sheet-section:hover,.sheet-hero:hover,.gm-box:hover{transform:translateY(-2px); box-shadow:var(--arc-shadow), 0 0 0 1px rgba(var(--aether-theme-accent-rgb),.08), 0 0 28px rgba(var(--aether-theme-primary-rgb),.14) !important; border-color:rgba(var(--aether-theme-primary-soft-rgb),.64) !important;}
.portal-btn,.campaign-btn,.gm-btn,.gm-btn-soft,.characters-primary-btn,.characters-secondary-btn,.characters-danger-btn,.card-modal-btn,#tabs .tab,button.tab,button{
  border:1px solid rgba(var(--aether-theme-primary-rgb),.34); color:#f7f0ff; box-shadow:0 10px 22px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.07);
}
.portal-btn,.campaign-btn,.gm-btn,.gm-btn-soft,.characters-secondary-btn,.card-modal-btn,#tabs .tab,button.tab,button:not(.characters-primary-btn):not(.characters-danger-btn):not(.portal-btn-accent){background:linear-gradient(180deg, rgba(57,43,79,.96), rgba(30,22,42,.98)) !important;}
.portal-btn:hover,.campaign-btn:hover,.gm-btn:hover,.gm-btn-soft:hover,.characters-primary-btn:hover,.characters-secondary-btn:hover,.characters-danger-btn:hover,.card-modal-btn:hover,#tabs .tab:hover,button.tab:hover,button:hover{box-shadow:0 18px 28px rgba(0,0,0,.28), 0 0 24px rgba(var(--aether-theme-primary-rgb),.18), inset 0 1px 0 rgba(255,255,255,.08);}
.portal-btn-accent,.characters-primary-btn,.gm-btn-soft.alt,#tabs .tab.active,button.tab.active{background:linear-gradient(180deg, var(--aether-theme-primary-soft), var(--aether-theme-primary-deep)) !important; border-color:rgba(var(--aether-theme-primary-soft-rgb),.55) !important; color:#fff !important;}
.characters-danger-btn,.gm-btn-soft.warn,.card-modal-btn.danger-soft{background:linear-gradient(180deg, var(--arc-danger), var(--arc-danger-2)) !important; border-color:rgba(222,118,150,.36) !important;}
.portal-btn-accent,.characters-primary-btn,.gm-btn-soft.alt{box-shadow:0 16px 30px rgba(var(--aether-theme-primary-deep-rgb),.34), 0 0 24px rgba(var(--aether-theme-primary-rgb),.22), inset 0 1px 0 rgba(255,255,255,.10) !important;}
.portal-btn-accent:hover,.characters-primary-btn:hover,.gm-btn-soft.alt:hover{box-shadow:0 18px 34px rgba(var(--aether-theme-primary-deep-rgb),.38), 0 0 30px rgba(var(--aether-theme-primary-rgb),.28), inset 0 1px 0 rgba(255,255,255,.11) !important;}
input,select,textarea,.gm-input,.gm-select,.gm-textarea,.portal-input,.characters-search,.characters-select{background:linear-gradient(180deg, rgba(14,11,22,.96), rgba(10,8,16,.98)) !important; color:var(--arc-text) !important; border:1px solid rgba(var(--aether-theme-primary-rgb),.32) !important; box-shadow:inset 0 1px 0 rgba(255,255,255,.03), inset 0 -8px 18px rgba(0,0,0,.14);} 
input::placeholder,textarea::placeholder{color:#9687ad;}
#tabs{background:linear-gradient(180deg, rgba(17,13,24,.96), rgba(10,8,15,.98)) !important; border-right:1px solid rgba(130,100,194,.25) !important; padding:10px 8px; gap:8px;}
#tabs .tab,button.tab{border-radius:12px; margin:0; padding:12px 12px; color:#d9c9f6;}
#tabs .tab.active,button.tab.active{box-shadow:0 0 0 1px rgba(var(--aether-theme-accent-rgb),.2), 0 16px 28px rgba(0,0,0,.26), 0 0 28px rgba(var(--aether-theme-primary-rgb),.20) !important;}
.character-pill,.campaign-pill,.gm-pill,.builder-step-pill,.campaign-badge{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;border:1px solid rgba(var(--aether-theme-accent-rgb),.22);background:linear-gradient(180deg, rgba(70,51,102,.88), rgba(35,26,49,.94));color:#fff5de;font-size:11px;font-weight:800;letter-spacing:.10em;text-transform:uppercase;box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 8px 18px rgba(0,0,0,.16);}
.character-pill::before,.campaign-badge::before{content:"✦"; color:var(--arc-gold); opacity:.95;}
.character-card.active,.campaign-card.active,.gm-nav-btn.active{border-color:rgba(var(--aether-theme-accent-rgb),.72) !important; box-shadow:0 0 0 1px rgba(var(--aether-theme-accent-rgb),.18),0 0 30px rgba(var(--aether-theme-primary-rgb),.18), inset 0 1px 0 rgba(255,255,255,.06) !important;}
.arcane-session-banner{position:relative; margin:12px 16px 0; padding:14px 16px; border-radius:16px; border:1px solid rgba(var(--aether-theme-accent-rgb),.30); background:linear-gradient(90deg, rgba(var(--aether-theme-primary-deep-rgb),.46), rgba(22,17,32,.94) 42%, rgba(var(--aether-theme-primary-rgb),.18)); color:var(--arc-text); display:flex; justify-content:space-between; align-items:center; gap:16px; overflow:hidden; box-shadow:0 18px 40px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.06), 0 0 28px rgba(var(--aether-theme-primary-rgb),.20);} 
.arcane-session-banner::before{content:""; position:absolute; inset:0; background:linear-gradient(110deg, transparent 14%, rgba(255,255,255,.07) 24%, transparent 36%); transform:translateX(-120%); animation:bannerShimmer 6s ease-in-out infinite; pointer-events:none;} 
.arcane-session-banner::after{content:""; position:absolute; inset:0; background:radial-gradient(circle at 12% 50%, rgba(var(--aether-theme-accent-rgb),.08), transparent 18%), radial-gradient(circle at 88% 50%, rgba(var(--aether-theme-primary-rgb),.14), transparent 22%); pointer-events:none;} 
.arcane-session-banner .banner-title{font-weight:900; letter-spacing:.08em; text-transform:uppercase;} .arcane-session-banner .banner-sub{color:var(--arc-text-soft); font-size:13px;} .arcane-session-banner .banner-badge{padding:6px 12px; border-radius:999px; border:1px solid rgba(var(--aether-theme-accent-rgb),.34); background:rgba(16,12,24,.44); color:#fff3cf; font-weight:800; letter-spacing:.14em; text-transform:uppercase; box-shadow:inset 0 1px 0 rgba(255,255,255,.05), 0 0 20px rgba(var(--aether-theme-accent-rgb),.10);} .arcane-session-banner.hidden{display:none !important;}
.arcane-toast-stack{position:fixed; right:16px; bottom:16px; display:grid; gap:10px; z-index:9999;}
.arcane-toast{position:relative; min-width:260px; max-width:380px; padding:13px 15px; border-radius:16px; background:linear-gradient(180deg, rgba(36,27,52,.98), rgba(15,12,22,.98)); border:1px solid rgba(var(--aether-theme-accent-rgb),.24); color:var(--arc-text); box-shadow:0 18px 40px rgba(0,0,0,.34), 0 0 26px rgba(var(--aether-theme-primary-rgb),.16), inset 0 1px 0 rgba(255,255,255,.06); overflow:hidden; animation:arcaneToastIn .22s ease;}
.arcane-toast::before{content:""; position:absolute; left:0; top:0; bottom:0; width:3px; background:linear-gradient(180deg, var(--arc-gold), var(--arc-accent-2)); box-shadow:0 0 16px rgba(var(--aether-theme-accent-rgb),.24);} .arcane-toast-title{font-weight:900; margin-bottom:3px; letter-spacing:.06em; text-transform:uppercase;} .arcane-toast-sub{color:var(--arc-text-soft); font-size:13px; line-height:1.4;} .arcane-toast.hide{opacity:0; transform:translateY(10px); transition:opacity .18s ease, transform .18s ease;}
.status-light{width:10px;height:10px;border-radius:999px;display:inline-block;margin-right:8px;box-shadow:0 0 14px currentColor, 0 0 3px currentColor;}
.status-green{color:var(--arc-success); background:var(--arc-success);} .status-red{color:#ef7799; background:#ef7799;} .status-yellow{color:var(--arc-gold); background:var(--arc-gold);} .arcane-status-line{display:inline-flex;align-items:center;font-size:13px;color:var(--arc-text-soft);}
.arcane-modal-overlay{position:fixed;inset:0;background:rgba(7,5,10,.74);display:flex;align-items:center;justify-content:center;padding:18px;z-index:9998;backdrop-filter:blur(4px);} 
.arcane-modal-card{position:relative; width:min(560px,100%); border-radius:22px; border:1px solid rgba(239,198,113,.26); background:linear-gradient(180deg, rgba(37,28,54,.99), rgba(16,12,24,.995)); box-shadow:var(--arc-shadow), 0 0 34px rgba(123,87,222,.18); overflow:hidden; animation:arcaneModalIn .18s ease;} 
.arcane-modal-card::before{content:""; position:absolute; inset:0; background:linear-gradient(140deg, rgba(248,223,172,.09), transparent 20%, transparent 80%, rgba(123,87,222,.11)), var(--arc-sheen); pointer-events:none;} 
.arcane-modal-head,.arcane-modal-foot{padding:18px 20px; position:relative;} .arcane-modal-head{border-bottom:1px solid rgba(239,198,113,.10);} .arcane-modal-foot{border-top:1px solid rgba(239,198,113,.10); display:flex; justify-content:flex-end; gap:10px;} .arcane-modal-title{font-size:21px;font-weight:900;letter-spacing:.04em;} .arcane-modal-sub{margin-top:5px;color:var(--arc-text-soft);} .arcane-modal-body{padding:15px 20px 20px; display:grid; gap:10px;} .arcane-modal-choice{width:100%; text-align:left; border:none; cursor:pointer; padding:15px 16px; border-radius:16px; background:linear-gradient(180deg, rgba(65,48,98,.92), rgba(31,23,43,.98)); color:var(--arc-text); border:1px solid rgba(123,87,222,.22); box-shadow:inset 0 1px 0 rgba(255,255,255,.05), 0 10px 18px rgba(0,0,0,.14);} .arcane-modal-choice .choice-name{font-weight:900; letter-spacing:.04em;} .arcane-modal-choice .choice-sub{color:var(--arc-text-soft); font-size:13px; margin-top:4px; line-height:1.4;} .arcane-modal-choice:hover{transform:translateY(-1px); border-color:rgba(239,198,113,.36); box-shadow:0 14px 22px rgba(0,0,0,.18), 0 0 18px rgba(123,87,222,.14);}
@keyframes arcaneModalIn{from{opacity:0; transform:translateY(8px) scale(.985);} to{opacity:1; transform:none;}}
@keyframes arcaneToastIn{from{opacity:0; transform:translateY(10px);} to{opacity:1; transform:none;}}
@keyframes bannerShimmer{0%,10%{transform:translateX(-130%);} 28%,100%{transform:translateX(130%);}}


/* === Iteration 6: patina / weathering / default-surface overrides === */
:root{
  --arc-panel-aged:linear-gradient(180deg, rgba(24,18,33,.985), rgba(10,8,17,.995));
  --arc-panel-aged-2:linear-gradient(180deg, rgba(34,25,46,.97), rgba(13,10,22,.995));
  --arc-metal:var(--aether-theme-accent-deep);
  --arc-metal-soft:var(--aether-theme-accent-soft);
  --arc-frost:rgba(218,201,255,.08);
  --arc-dust:rgba(196,172,118,.05);
}

html,body{
  background:
    radial-gradient(circle at 12% 0%, rgba(var(--aether-theme-primary-rgb),.18), transparent 26%),
    radial-gradient(circle at 88% 10%, rgba(var(--aether-theme-accent-deep-rgb),.08), transparent 18%),
    radial-gradient(circle at 50% 120%, rgba(var(--aether-theme-primary-deep-rgb),.14), transparent 38%),
    linear-gradient(180deg, var(--arc-bg-2), var(--arc-bg));
}
body::before{
  background:
    radial-gradient(circle at 18% 16%, rgba(255,244,221,.028), transparent 18%),
    radial-gradient(circle at 82% 24%, rgba(255,244,221,.02), transparent 20%),
    radial-gradient(circle at center, transparent 0 61%, rgba(0,0,0,.42) 100%),
    linear-gradient(180deg, rgba(255,255,255,.015), transparent 22%, transparent 80%, rgba(0,0,0,.18));
  opacity:1;
}
body::after{
  background-image:
    linear-gradient(transparent 0, rgba(255,255,255,.012) 50%, transparent 100%),
    radial-gradient(circle, rgba(255,255,255,.07) .65px, transparent .75px),
    radial-gradient(circle at 20% 30%, rgba(184,149,73,.045), transparent 10%),
    radial-gradient(circle at 80% 70%, rgba(var(--aether-theme-primary-rgb),.045), transparent 10%);
  background-size:100% 3px, 24px 24px, 280px 280px, 360px 360px;
  opacity:.08;
  mix-blend-mode:soft-light;
}

.header,.portal-panel,.campaign-panel,.panel,.panel-card,.quick-card,.sheet-section,.sheet-hero,#quickview,.gm-panel,.gm-sidebar,.gm-main,.gm-card,.gm-detail,.gm-list-item,.gm-picker-shell,.characters-sidebar,.characters-detail,.character-card,.characters-modal-shell,.card-modal-shell,.gm-box{
  background:var(--arc-panel-aged-2) !important;
  border:1px solid rgba(var(--aether-theme-primary-soft-rgb),.38) !important;
  box-shadow:
    0 22px 60px rgba(0,0,0,.48),
    0 0 0 1px rgba(var(--aether-theme-accent-rgb),.06),
    inset 0 1px 0 rgba(255,255,255,.04),
    inset 0 -24px 40px rgba(0,0,0,.22),
    inset 0 0 30px rgba(var(--aether-theme-primary-rgb),.08) !important;
}
.header::before,.portal-panel::before,.campaign-panel::before,.panel::before,.panel-card::before,.quick-card::before,.sheet-section::before,.sheet-hero::before,#quickview::before,.gm-panel::before,.gm-sidebar::before,.gm-main::before,.gm-card::before,.gm-detail::before,.gm-list-item::before,.gm-picker-shell::before,.characters-sidebar::before,.characters-detail::before,.character-card::before,.characters-modal-shell::before,.card-modal-shell::before,.gm-box::before{
  background:
    linear-gradient(140deg, rgba(var(--aether-theme-accent-rgb),.06), transparent 15%, transparent 76%, rgba(var(--aether-theme-primary-rgb),.08)),
    linear-gradient(180deg, rgba(255,255,255,.035), transparent 22%),
    radial-gradient(circle at 12% 16%, rgba(var(--aether-theme-accent-rgb),.03), transparent 12%),
    radial-gradient(circle at 84% 76%, rgba(var(--aether-theme-primary-rgb),.04), transparent 18%);
}
.header::after,.portal-panel::after,.campaign-panel::after,.panel::after,.panel-card::after,.quick-card::after,.sheet-section::after,.sheet-hero::after,#quickview::after,.gm-panel::after,.gm-sidebar::after,.gm-main::after,.gm-card::after,.gm-detail::after,.gm-list-item::after,.gm-picker-shell::after,.characters-sidebar::after,.characters-detail::after,.character-card::after,.characters-modal-shell::after,.card-modal-shell::after,.gm-box::after{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  background-image:
    radial-gradient(circle at 18% 28%, rgba(255,255,255,.018) .6px, transparent .9px),
    radial-gradient(circle at 72% 78%, rgba(var(--aether-theme-accent-rgb),.02) .7px, transparent 1px),
    linear-gradient(115deg, transparent 0 12%, rgba(0,0,0,.05) 13%, transparent 15%, transparent 82%, rgba(255,255,255,.015) 84%, transparent 86%);
  background-size:26px 26px, 32px 32px, 100% 100%;
  mix-blend-mode:soft-light;
  opacity:.55;
}
.panel:hover,.panel-card:hover,.quick-card:hover,.gm-card:hover,.gm-detail:hover,.gm-list-item:hover,.character-card:hover,.portal-panel:hover,.campaign-panel:hover,.gm-panel:hover,.gm-sidebar:hover,.gm-main:hover,.sheet-section:hover,.sheet-hero:hover,.gm-box:hover{
  box-shadow:
    0 28px 64px rgba(0,0,0,.56),
    0 0 0 1px rgba(var(--aether-theme-accent-rgb),.08),
    0 0 22px rgba(var(--aether-theme-primary-rgb),.12),
    inset 0 1px 0 rgba(255,255,255,.05),
    inset 0 -26px 42px rgba(0,0,0,.24) !important;
}

/* kill bright default surfaces on sheet widgets */
.level-badge,
.big-stat-card,
.trait-badge,
.trait-value,
.weapon-meta,
.weapon-dmg,
.weapon-card,
.weapon-lines > div,
.sheet-note,
.sheet-callout,
.sheet-box,
.sheet-chip,
.sheet-stat-badge,
.sheet-surface-light,
.sheet-surface,
.quick-badge,
.conditions-card,
.big-stat-label,
.level-label{
  background:var(--arc-panel-aged) !important;
  color:var(--arc-text) !important;
  border-color:rgba(184,149,73,.48) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    inset 0 -16px 24px rgba(0,0,0,.18),
    0 8px 18px rgba(0,0,0,.16),
    0 0 0 1px rgba(184,149,73,.05);
}
.level-badge,
.big-stat-card,
.trait-badge,
.conditions-card{
  position:relative;
  overflow:hidden;
}
.level-badge::before,
.big-stat-card::before,
.trait-badge::before,
.conditions-card::before,
.weapon-meta::before,
.weapon-dmg::before,
.trait-value::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(180deg, rgba(255,255,255,.025), transparent 28%),
    radial-gradient(circle at 14% 22%, rgba(208,176,113,.045), transparent 14%),
    radial-gradient(circle at 82% 70%, rgba(123,87,222,.045), transparent 18%);
  mix-blend-mode:screen;
}
.big-stat-value,.level-value,.trait-name,.trait-value{color:#f3ead8 !important; text-shadow:0 0 14px rgba(0,0,0,.18);} 
.weapon-meta,.weapon-dmg{
  background:linear-gradient(180deg, rgba(20,15,31,.98), rgba(11,9,18,.995)) !important;
  color:#e8decc !important;
  border:1px solid rgba(110,133,196,.72) !important;
  border-radius:16px;
}
.weapon-type{color:#a89aba !important;}
.weapon-name{color:#f4ead8 !important; text-shadow:0 0 12px rgba(123,87,222,.12);} 
.trait-value,
.level-badge,
.big-stat-card,
.trait-badge{border-width:2px !important;}

/* form surfaces + interactive bubbles */
button,
input,
select,
textarea,
.mini-bubble,
.bubble,
.dot,
input[type="number"],
input[type="text"],
input[type="search"],
textarea,
select{
  background-color:transparent;
}
input,select,textarea,.gm-input,.gm-select,.gm-textarea,.portal-input,.characters-search,.characters-select,.characters-input,.characters-textarea,.cards-search{
  background:linear-gradient(180deg, rgba(14,11,22,.98), rgba(9,7,15,.995)) !important;
  border:1px solid rgba(134,106,197,.34) !important;
  color:var(--arc-text) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03), inset 0 -12px 24px rgba(0,0,0,.2), 0 0 0 1px rgba(184,149,73,.03);
}
button,
.portal-btn,.campaign-btn,.gm-btn,.gm-btn-soft,.characters-primary-btn,.characters-secondary-btn,.characters-danger-btn,.card-modal-btn,#tabs .tab,button.tab{
  background:linear-gradient(180deg, rgba(48,35,67,.96), rgba(24,18,34,.995)) !important;
  border-color:rgba(138,110,201,.35) !important;
}
.portal-btn-accent,.characters-primary-btn,.gm-btn-soft.alt,#tabs .tab.active,button.tab.active{
  background:linear-gradient(180deg, #7650d6, #462d84) !important;
  border-color:rgba(197,171,255,.4) !important;
}
.characters-danger-btn,.gm-btn-soft.warn,.card-modal-btn.danger-soft{
  background:linear-gradient(180deg, #87405d, #4b1f31) !important;
}
.mini-bubble,.bubble,.dot{
  background:linear-gradient(180deg, rgba(14,11,22,.95), rgba(9,7,15,.98)) !important;
  border-color:rgba(91,130,207,.72) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025), 0 6px 12px rgba(0,0,0,.14);
}
.mini-bubble.filled,.bubble.filled,.dot.filled{background:linear-gradient(180deg, #b89549, #846329) !important; border-color:#d1af67 !important;}
.mini-bubble.dark-filled,.bubble.dark-filled,.dot.dark-filled{background:linear-gradient(180deg, #6f8fd2, #4761a0) !important; border-color:#8db0ff !important;}

.section-title,.panel-title,.characters-title,.sheet-name,.gm-title,.campaign-title,.portal-title{
  text-shadow:0 0 18px rgba(123,87,222,.12), 0 1px 0 rgba(0,0,0,.35);
}
.section-title,.panel-title{
  border-color:rgba(184,149,73,.52) !important;
  background:linear-gradient(180deg, rgba(16,13,24,.96), rgba(10,8,16,.995)) !important;
}
.section-title::after,.arcane-modal-title::after{
  content:"";
  display:block;
  height:1px;
  margin-top:8px;
  background:linear-gradient(90deg, transparent, rgba(184,149,73,.55), transparent);
}

.arcane-session-banner{
  background:linear-gradient(90deg, rgba(62,36,114,.38), rgba(14,11,22,.97) 38%, rgba(68,45,122,.16)) !important;
  border-color:rgba(184,149,73,.34) !important;
  box-shadow:0 22px 46px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.05), 0 0 24px rgba(123,87,222,.12) !important;
}
.arcane-toast{
  background:linear-gradient(180deg, rgba(25,19,36,.97), rgba(11,9,18,.99)) !important;
  border-color:rgba(184,149,73,.24) !important;
}
.arcane-modal-card{
  background:linear-gradient(180deg, rgba(29,22,42,.995), rgba(11,9,18,.998)) !important;
  border-color:rgba(184,149,73,.28) !important;
}

/* subtle age on key shells */
.main,#content,.characters-shell,.campaign-shell,.portal-shell,.gm-shell,.sheet-shell{
  position:relative;
}
.main::before,#content::before,.characters-shell::before,.campaign-shell::before,.portal-shell::before,.gm-shell::before,.sheet-shell::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 0% 0%, rgba(208,176,113,.025), transparent 18%),
    radial-gradient(circle at 100% 100%, rgba(123,87,222,.03), transparent 22%),
    linear-gradient(115deg, transparent 0 4%, rgba(0,0,0,.03) 5%, transparent 6%, transparent 94%, rgba(255,255,255,.01) 95%, transparent 96%);
  mix-blend-mode:soft-light;
}


/* === Iteration 7: consistency / filled pips / forged weapon cards === */
:root{
  --arc-metal-aged:#b28945;
  --arc-metal-deep:#8e6a32;
  --arc-violet-ash:#9f8db8;
  --arc-pip-empty:#2f2740;
  --arc-pip-empty-border:rgba(140,114,193,.55);
  --arc-pip-blue:#6f96de;
  --arc-pip-blue-deep:#5375b4;
  --arc-pip-gold:#d4b067;
  --arc-pip-gold-deep:#9f7a34;
}

/* heavier, less surgical pips */
.mini-bubble,
.bubble,
.dot{
  position:relative;
  border-radius:999px;
  background:radial-gradient(circle at 34% 32%, rgba(255,255,255,.06), transparent 28%), linear-gradient(180deg, rgba(55,46,73,.96), rgba(29,22,39,.98)) !important;
  border:2px solid var(--arc-pip-empty-border) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04), inset 0 -10px 14px rgba(0,0,0,.24), 0 4px 10px rgba(0,0,0,.20), 0 0 0 1px rgba(0,0,0,.18);
}
.mini-bubble::after,
.bubble::after,
.dot::after{
  content:"";
  position:absolute;
  inset:4px;
  border-radius:inherit;
  background:radial-gradient(circle at 35% 35%, rgba(255,255,255,.06), transparent 40%);
  opacity:.65;
  pointer-events:none;
}
.mini-bubble.filled,
.bubble.filled,
.dot.filled,
.mini-bubble.gold-filled,
.bubble.gold-filled,
.dot.gold-filled{
  background:radial-gradient(circle at 34% 30%, rgba(255,248,214,.20), transparent 30%), linear-gradient(180deg, var(--arc-pip-gold), var(--arc-pip-gold-deep)) !important;
  border-color:rgba(240,207,133,.88) !important;
  box-shadow:inset 0 1px 0 rgba(255,248,214,.20), inset 0 -8px 10px rgba(100,64,10,.24), 0 0 12px rgba(212,176,103,.18), 0 4px 10px rgba(0,0,0,.22), 0 0 0 1px rgba(104,77,24,.26);
}
.mini-bubble.dark-filled,
.bubble.dark-filled,
.dot.dark-filled,
.mini-bubble.blue-filled,
.bubble.blue-filled,
.dot.blue-filled{
  background:radial-gradient(circle at 34% 30%, rgba(230,240,255,.18), transparent 30%), linear-gradient(180deg, var(--arc-pip-blue), var(--arc-pip-blue-deep)) !important;
  border-color:rgba(155,190,255,.82) !important;
  box-shadow:inset 0 1px 0 rgba(236,244,255,.18), inset 0 -8px 10px rgba(18,36,88,.24), 0 0 12px rgba(111,150,222,.16), 0 4px 10px rgba(0,0,0,.22), 0 0 0 1px rgba(37,58,109,.24);
}

/* weapon cards should match the forged console material */
.weapon-card{
  position:relative;
  background:linear-gradient(180deg, rgba(28,21,40,.99), rgba(12,9,21,.995)) !important;
  border:1px solid rgba(178,137,69,.58) !important;
  box-shadow:0 18px 34px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.04), inset 0 -18px 28px rgba(0,0,0,.22), 0 0 0 1px rgba(178,137,69,.06) !important;
  overflow:hidden;
}
.weapon-card::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(145deg, rgba(208,176,113,.06), transparent 14%, transparent 78%, rgba(123,87,222,.08)),
    radial-gradient(circle at 16% 22%, rgba(255,255,255,.02), transparent 14%),
    radial-gradient(circle at 80% 74%, rgba(123,87,222,.05), transparent 18%),
    linear-gradient(180deg, rgba(255,255,255,.025), transparent 22%);
  mix-blend-mode:screen;
}
.weapon-card::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background-image:
    radial-gradient(circle at 18% 32%, rgba(255,255,255,.016) .7px, transparent .9px),
    radial-gradient(circle at 72% 68%, rgba(178,137,69,.025) .8px, transparent 1px),
    linear-gradient(116deg, transparent 0 14%, rgba(0,0,0,.06) 15%, transparent 17%, transparent 81%, rgba(255,255,255,.012) 83%, transparent 85%);
  background-size:28px 28px, 34px 34px, 100% 100%;
  opacity:.55;
  mix-blend-mode:soft-light;
}
.weapon-header{
  position:relative;
  background:linear-gradient(180deg, rgba(67,49,110,.96), rgba(42,31,71,.98)) !important;
  color:#f7edd8 !important;
  border-bottom:1px solid rgba(178,137,69,.30);
  box-shadow:inset 0 -1px 0 rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.04);
  letter-spacing:.09em;
}
.weapon-body{
  position:relative;
  background:linear-gradient(180deg, rgba(23,17,33,.995), rgba(11,9,18,.998)) !important;
  color:var(--arc-text) !important;
}
.weapon-name{
  background:transparent !important;
  color:#f4ead6 !important;
  text-shadow:0 0 12px rgba(123,87,222,.10);
  letter-spacing:.01em;
}
.weapon-type{
  color:var(--arc-violet-ash) !important;
  text-shadow:none !important;
}
.weapon-meta,
.weapon-dmg{
  background:linear-gradient(180deg, rgba(17,13,27,.99), rgba(8,7,15,.995)) !important;
  color:#efe4d0 !important;
  border:1px solid rgba(111,150,222,.58) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035), inset 0 -12px 16px rgba(0,0,0,.24), 0 8px 16px rgba(0,0,0,.18), 0 0 0 1px rgba(57,78,126,.14) !important;
}

/* dent the surfaces a bit more */
.header,.portal-panel,.campaign-panel,.panel,.panel-card,.quick-card,.sheet-section,.sheet-hero,#quickview,.gm-panel,.gm-sidebar,.gm-main,.gm-card,.gm-detail,.gm-list-item,.gm-picker-shell,.characters-sidebar,.characters-detail,.character-card,.characters-modal-shell,.card-modal-shell,.gm-box{
  box-shadow:0 24px 60px rgba(0,0,0,.54), 0 0 0 1px rgba(178,137,69,.05), inset 0 1px 0 rgba(255,255,255,.035), inset 0 -22px 36px rgba(0,0,0,.24), inset 0 0 24px rgba(92,61,155,.05) !important;
}
.header::after,.portal-panel::after,.campaign-panel::after,.panel::after,.panel-card::after,.quick-card::after,.sheet-section::after,.sheet-hero::after,#quickview::after,.gm-panel::after,.gm-sidebar::after,.gm-main::after,.gm-card::after,.gm-detail::after,.gm-list-item::after,.gm-picker-shell::after,.characters-sidebar::after,.characters-detail::after,.character-card::after,.characters-modal-shell::after,.card-modal-shell::after,.gm-box::after{
  opacity:.72 !important;
}

/* reduce surgical brightness on labels that were still too clean */
.weapon-pill,
.section-title,
.level-label,
.big-stat-label{
  background:linear-gradient(180deg, rgba(17,14,28,.98), rgba(10,9,17,.995)) !important;
  color:#f6e8cb !important;
  border-color:rgba(178,137,69,.44) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03), 0 8px 14px rgba(0,0,0,.18);
}


/* === Iteration 8: push it 10x further / forged asymmetry / real pips === */
:root{
  --arc-soot: rgba(4,3,8,.46);
  --arc-dust: rgba(208,176,113,.028);
  --arc-violet-smoke: rgba(92,61,155,.12);
  --arc-border-dim: rgba(178,137,69,.42);
  --arc-subtle-text: #9d93b5;
}

body{
  background:
    radial-gradient(circle at 16% 10%, rgba(123,87,222,.12), transparent 26%),
    radial-gradient(circle at 84% 18%, rgba(208,176,113,.05), transparent 20%),
    radial-gradient(circle at 50% 100%, rgba(0,0,0,.55), transparent 50%),
    linear-gradient(180deg, #0c0813, #09060f 55%, #05040a 100%) !important;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 8% 14%, rgba(255,255,255,.02) 0 1px, transparent 1.2px 100%),
    radial-gradient(circle at 81% 26%, rgba(208,176,113,.018) 0 1px, transparent 1.2px 100%),
    radial-gradient(circle at 36% 74%, rgba(255,255,255,.014) 0 .8px, transparent 1px 100%),
    linear-gradient(118deg, transparent 0 8%, rgba(255,255,255,.012) 9%, transparent 10%, transparent 87%, rgba(0,0,0,.08) 89%, transparent 91%),
    linear-gradient(0deg, rgba(0,0,0,.12), rgba(0,0,0,.12));
  background-size: 31px 31px, 41px 41px, 53px 53px, 100% 100%, 100% 100%;
  opacity:.55;
  mix-blend-mode:soft-light;
}
body::after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 20% 20%, rgba(0,0,0,.18), transparent 22%),
    radial-gradient(circle at 82% 76%, rgba(0,0,0,.22), transparent 25%),
    radial-gradient(circle at 50% 50%, transparent 48%, rgba(0,0,0,.24) 100%);
  mix-blend-mode:multiply;
  opacity:.85;
}

/* make panels feel old, heavy, and slightly abused */
.header,.portal-panel,.campaign-panel,.panel,.panel-card,.quick-card,.sheet-section,.sheet-hero,#quickview,.gm-panel,.gm-sidebar,.gm-main,.gm-card,.gm-detail,.gm-list-item,.gm-picker-shell,.characters-sidebar,.characters-detail,.character-card,.characters-modal-shell,.card-modal-shell,.gm-box,.weapon-card{
  position:relative;
}
.header::before,.portal-panel::before,.campaign-panel::before,.panel::before,.panel-card::before,.quick-card::before,.sheet-section::before,.sheet-hero::before,#quickview::before,.gm-panel::before,.gm-sidebar::before,.gm-main::before,.gm-card::before,.gm-detail::before,.gm-list-item::before,.gm-picker-shell::before,.characters-sidebar::before,.characters-detail::before,.character-card::before,.characters-modal-shell::before,.card-modal-shell::before,.gm-box::before,.weapon-card::before{
  background:
    radial-gradient(circle at 14% 16%, rgba(255,255,255,.03), transparent 11%),
    radial-gradient(circle at 85% 78%, rgba(0,0,0,.22), transparent 20%),
    radial-gradient(circle at 72% 24%, rgba(123,87,222,.07), transparent 16%),
    linear-gradient(137deg, rgba(208,176,113,.035), transparent 13%, transparent 82%, rgba(0,0,0,.12) 100%);
  mix-blend-mode:screen;
  opacity:.9;
}
.header::after,.portal-panel::after,.campaign-panel::after,.panel::after,.panel-card::after,.quick-card::after,.sheet-section::after,.sheet-hero::after,#quickview::after,.gm-panel::after,.gm-sidebar::after,.gm-main::after,.gm-card::after,.gm-detail::after,.gm-list-item::after,.gm-picker-shell::after,.characters-sidebar::after,.characters-detail::after,.character-card::after,.characters-modal-shell::after,.card-modal-shell::after,.gm-box::after,.weapon-card::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(120deg, transparent 0 7%, rgba(0,0,0,.08) 9%, transparent 11%, transparent 59%, rgba(255,255,255,.012) 61%, transparent 63%),
    radial-gradient(circle at 12% 84%, rgba(0,0,0,.12), transparent 17%),
    radial-gradient(circle at 88% 12%, rgba(208,176,113,.018), transparent 14%);
  background-size:100% 100%, 100% 100%, 100% 100%;
  opacity:.72;
  mix-blend-mode:soft-light;
}
.header,.portal-panel,.campaign-panel,.panel,.panel-card,.quick-card,.sheet-section,.sheet-hero,#quickview,.gm-panel,.gm-sidebar,.gm-main,.gm-card,.gm-detail,.gm-list-item,.gm-picker-shell,.characters-sidebar,.characters-detail,.character-card,.characters-modal-shell,.card-modal-shell,.gm-box{
  background:
    radial-gradient(circle at 0% 0%, rgba(255,255,255,.018), transparent 18%),
    radial-gradient(circle at 100% 100%, rgba(92,61,155,.10), transparent 25%),
    linear-gradient(180deg, rgba(28,20,42,.97), rgba(9,7,16,.992)) !important;
  border-color:rgba(178,137,69,.34) !important;
  box-shadow:
    0 26px 68px rgba(0,0,0,.62),
    inset 0 1px 0 rgba(255,255,255,.03),
    inset 0 -28px 42px rgba(0,0,0,.28),
    inset 10px 0 26px rgba(0,0,0,.06),
    inset -12px -4px 20px rgba(92,61,155,.05),
    0 0 0 1px rgba(178,137,69,.04) !important;
}

/* weapon names are buttons: strip every last browser/button treatment */
.weapon-name,
button.weapon-name{
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  padding:6px 10px !important;
  border-radius:10px !important;
  overflow:hidden !important;

  background:linear-gradient(
    180deg,
    rgba(72,52,118,.18),
    rgba(24,18,36,.22)
  ) !important;
  border:1px solid rgba(178,137,69,.14) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.025),
    inset 0 -8px 12px rgba(0,0,0,.18),
    0 4px 10px rgba(0,0,0,.12) !important;

  outline:none !important;
  appearance:none !important;
  -webkit-appearance:none !important;
  -webkit-tap-highlight-color: transparent !important;

  color:#f0e4cd !important;
  text-shadow:0 1px 0 rgba(0,0,0,.45), 0 0 10px rgba(123,87,222,.08) !important;
}

.weapon-name:hover,
.weapon-name:focus,
.weapon-name:focus-visible,
.weapon-name:active,
button.weapon-name:hover,
button.weapon-name:focus,
button.weapon-name:focus-visible,
button.weapon-name:active{
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
}

.weapon-name::selection,
button.weapon-name::selection{
  background: transparent !important;
  color: inherit !important;
}

.weapon-name::-moz-selection,
button.weapon-name::-moz-selection{
  background: transparent !important;
  color: inherit !important;
}
.weapon-name:hover,
.weapon-name:active,
button.weapon-name:hover,
button.weapon-name:active{
  background:none !important;
  border:none !important;
  box-shadow:none !important;
}
.weapon-type{color:#9589af !important; letter-spacing:.025em !important;}
.weapon-meta,.weapon-dmg{color:#ecdfc8 !important; border-color:rgba(103,133,196,.78) !important;}
.weapon-card{
  background:
    radial-gradient(circle at 14% 18%, rgba(255,255,255,.02), transparent 12%),
    radial-gradient(circle at 84% 72%, rgba(92,61,155,.12), transparent 18%),
    linear-gradient(180deg, rgba(25,18,37,.992), rgba(7,6,13,.998)) !important;
  border:1px solid rgba(178,137,69,.48) !important;
  box-shadow:
    0 24px 54px rgba(0,0,0,.50),
    inset 0 1px 0 rgba(255,255,255,.03),
    inset 0 -24px 34px rgba(0,0,0,.28),
    inset 0 0 22px rgba(92,61,155,.05),
    0 0 0 1px rgba(178,137,69,.04) !important;
}
.weapon-header{
  background:linear-gradient(180deg, rgba(86,62,146,.80), rgba(48,35,82,.96) 68%, rgba(32,24,56,.98)) !important;
  border-bottom:1px solid rgba(178,137,69,.24) !important;
}
.weapon-body{
  background:
    linear-gradient(180deg, rgba(20,15,31,.995), rgba(6,5,12,.999)) !important;
}

/* real filled pips, not rings */
.mini-bubble,.bubble,.dot{
  appearance:none !important;
  -webkit-appearance:none !important;
  padding:0 !important;
  border:none !important;
  width:22px !important;
  height:22px !important;
  min-width:22px !important;
  min-height:22px !important;
  border-radius:999px !important;
  background: radial-gradient(circle at 34% 30%, rgba(255,255,255,.06), transparent 28%), linear-gradient(180deg, #332a45, #211a2f) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    inset 0 -8px 10px rgba(0,0,0,.28),
    0 0 0 1px rgba(108,89,149,.26),
    0 6px 12px rgba(0,0,0,.22) !important;
  position:relative;
  overflow:hidden;
}
.mini-bubble::before,.bubble::before,.dot::before{
  content:"";
  position:absolute;
  inset:3px;
  border-radius:inherit;
  background:linear-gradient(180deg, rgba(43,34,58,.98), rgba(24,19,34,.98));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}
.mini-bubble::after,.bubble::after,.dot::after{
  content:"";
  position:absolute;
  inset:5px;
  border-radius:inherit;
  background:radial-gradient(circle at 34% 30%, rgba(255,255,255,.05), transparent 40%);
  opacity:.65;
}
.mini-bubble.filled,.bubble.filled,.dot.filled,.mini-bubble.gold-filled,.bubble.gold-filled,.dot.gold-filled{
  background:linear-gradient(180deg, #d7b66d, #8e6a2e) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,248,214,.24),
    inset 0 -8px 10px rgba(92,58,10,.32),
    0 0 0 1px rgba(239,211,142,.40),
    0 0 18px rgba(212,176,103,.20),
    0 8px 14px rgba(0,0,0,.22) !important;
}
.mini-bubble.filled::before,.bubble.filled::before,.dot.filled::before,
.mini-bubble.gold-filled::before,.bubble.gold-filled::before,.dot.gold-filled::before{
  background:linear-gradient(180deg, rgba(215,182,109,.98), rgba(140,102,41,.96)) !important;
}

/* Armor tracker bubbles */

.mini-bubble.armor-filled,
.bubble.armor-filled{
  background: linear-gradient(180deg, #3a86ff, #1f4fd6) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.25),
    inset 0 -6px 8px rgba(0,0,60,.35),
    0 0 0 1px rgba(60,110,255,.6),
    0 0 10px rgba(60,110,255,.35),
    0 8px 14px rgba(0,0,0,.22) !important;
}

.mini-bubble.armor-filled::before,
.bubble.armor-filled::before{
  background: linear-gradient(180deg, rgba(72,134,255,.98), rgba(31,79,214,.96)) !important;
}
/* Fear tracker bubbles*/
.mini-bubble.dark-filled,
.bubble.dark-filled,
.dot.dark-filled,
.mini-bubble.blue-filled,
.bubble.blue-filled,
.dot.blue-filled{
  background:linear-gradient(180deg, #8b0f1a, #4a0008) !important;
  animation: fearPulse 1.4s ease-in-out infinite;
  box-shadow:
    inset 0 1px 0 rgba(255,180,180,.15),
    inset 0 -8px 10px rgba(40,0,0,.45),
    0 0 0 1px rgba(120,0,0,.45),
    0 0 14px rgba(120,0,0,.35),
    0 6px 10px rgba(0,0,0,.35) !important;
}
.mini-bubble.dark-filled::before,
.bubble.dark-filled::before,
.dot.dark-filled::before,
.mini-bubble.blue-filled::before,
.bubble.blue-filled::before,
.dot.blue-filled::before{
  background:linear-gradient(180deg, rgba(150,20,30,.95), rgba(90,0,10,.95)) !important;
}
/* even inactive pips should feel solid, not outlined */
.mini-bubble-row .mini-bubble,
.readonly-bubble-track .bubble,
.bubble-track .bubble{
  transform:translateZ(0);
}

/* trait values can read like pressable insets */
.trait-value{
  background:linear-gradient(180deg, rgba(25,20,37,.98), rgba(10,8,16,.995)) !important;
  color:#f2e6d0 !important;
  border:1px solid rgba(178,137,69,.32) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03), inset 0 -18px 20px rgba(0,0,0,.28), 0 12px 22px rgba(0,0,0,.22) !important;
}

/* make tab/button system feel less plastic */
#tabs .tab,button.tab,.portal-btn,.campaign-btn,.gm-btn,.gm-btn-soft,.characters-primary-btn,.characters-secondary-btn,.characters-danger-btn,.card-modal-btn,button{
  box-shadow:
    0 14px 24px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.05),
    inset 0 -16px 22px rgba(0,0,0,.22),
    0 0 20px rgba(123,87,222,.10) !important;
}
#tabs .tab.active,button.tab.active,.portal-btn-accent,.characters-primary-btn,.gm-btn-soft.alt{
  background:linear-gradient(180deg, rgba(134,96,235,.96), rgba(69,45,127,.98)) !important;
  box-shadow:
    0 18px 30px rgba(0,0,0,.36),
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 -18px 22px rgba(28,14,64,.30),
    0 0 26px rgba(123,87,222,.18) !important;
}

/* debug bar should not scream red */
#debug-status{
  background:linear-gradient(180deg, rgba(40,10,10,.82), rgba(24,7,7,.94)) !important;
  color:#e8d7cc !important;
  border-bottom:1px solid rgba(121,49,49,.45) !important;
}
@keyframes fearPulse {
  0% {
    box-shadow:
      inset 0 1px 0 rgba(255,180,180,.15),
      inset 0 -8px 10px rgba(40,0,0,.45),
      0 0 0 1px rgba(120,0,0,.45),
      0 0 6px rgba(150,0,0,.35);
  }

  50% {
  box-shadow:
    inset 0 1px 0 rgba(255,200,200,.25),
    inset 0 -8px 10px rgba(60,0,0,.55),
    0 0 0 1px rgba(170,0,0,.6),
    0 0 22px rgba(220,0,0,.85),
    0 0 32px rgba(140,0,0,.55);
}

  100% {
    box-shadow:
      inset 0 1px 0 rgba(255,180,180,.15),
      inset 0 -8px 10px rgba(40,0,0,.45),
      0 0 0 1px rgba(120,0,0,.45),
      0 0 6px rgba(150,0,0,.35);
  }
}

/* Shared experience layer */
.portal-btn,.campaign-btn,.gm-btn,.gm-btn-soft,.characters-primary-btn,.characters-secondary-btn,.characters-danger-btn,.card-modal-btn,#tabs .tab,button.tab,.header-nav-btn,button{
  position:relative;
  overflow:hidden;
  isolation:isolate;
}

.portal-btn::after,.campaign-btn::after,.gm-btn::after,.gm-btn-soft::after,.characters-primary-btn::after,.characters-secondary-btn::after,.characters-danger-btn::after,.card-modal-btn::after,#tabs .tab::after,button.tab::after,.header-nav-btn::after,button::after{
  content:"";
  position:absolute;
  inset:-120% auto -120% -40%;
  width:34%;
  background:linear-gradient(180deg, transparent, rgba(255,255,255,.2), transparent);
  transform:rotate(22deg) translateX(-180%);
  opacity:.28;
  pointer-events:none;
}

.portal-btn:hover::after,.campaign-btn:hover::after,.gm-btn:hover::after,.gm-btn-soft:hover::after,.characters-primary-btn:hover::after,.characters-secondary-btn:hover::after,.characters-danger-btn:hover::after,.card-modal-btn:hover::after,#tabs .tab:hover::after,button.tab:hover::after,.header-nav-btn:hover::after,button:hover::after{
  animation:arcaneButtonSweep .7s ease;
}

.player-combat-map-surface,
.gm-combat-map-surface,
.player-combat-map-token,
.gm-combat-map-token,
.gm-combat-map-prop{
  overflow:visible !important;
  isolation:auto !important;
}

.player-combat-map-surface,
.gm-combat-map-surface{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
}

body.combat-mode .gm-main{
  background:transparent !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
}

body.combat-mode .gm-main::before,
body.combat-mode .gm-main::after,
body.combat-mode .gm-combat-map-card::before,
body.combat-mode .gm-combat-map-card::after{
  content:none !important;
  display:none !important;
  background:none !important;
  box-shadow:none !important;
}

.player-combat-map-surface::after,
.gm-combat-map-surface::after,
.player-combat-map-token::after,
.gm-combat-map-token::after,
.gm-combat-map-prop::after{
  content:none !important;
  display:none !important;
  animation:none !important;
  background:none !important;
}

button.player-combat-map-token,
button.player-combat-map-token:hover,
button.player-combat-map-token:active,
button.player-combat-map-token:focus,
button.player-combat-map-token:focus-visible,
button.player-combat-map-token:not(.characters-primary-btn):not(.characters-danger-btn):not(.portal-btn-accent){
  background:transparent !important;
  background-image:none !important;
  border:none !important;
  box-shadow:none !important;
  outline:none !important;
  appearance:none !important;
  -webkit-appearance:none !important;
}

button.player-combat-map-token::before,
button.player-combat-map-token::after{
  content:none !important;
  display:none !important;
  background:none !important;
  animation:none !important;
}

.arcane-pressed{
  animation:arcanePressPulse .22s ease;
}

.arcane-screen-fx{
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:0;
  z-index:9999;
  background:
    radial-gradient(circle at 50% 50%, rgba(0,0,0,.08), rgba(0,0,0,.78) 72%);
}

.arcane-screen-fx.active{
  animation:arcaneScreenPulse .82s ease forwards;
}

.arcane-screen-fx.variant-rest{
  background:
    radial-gradient(circle at 50% 44%, rgba(var(--aether-theme-accent-rgb),.08), transparent 28%),
    radial-gradient(circle at 50% 50%, rgba(0,0,0,.14), rgba(0,0,0,.9) 72%);
}

.arcane-screen-fx.variant-shadow{
  background:
    radial-gradient(circle at 50% 50%, rgba(var(--aether-theme-primary-rgb),.08), transparent 22%),
    radial-gradient(circle at 50% 50%, rgba(0,0,0,.08), rgba(0,0,0,.84) 72%);
}

.card-tile{
  transform-origin:center;
  will-change:transform, opacity;
}

.card-tile.card-tile-spotlight{
  box-shadow:
    0 0 0 1px rgba(var(--aether-theme-accent-rgb),.3),
    0 0 36px rgba(var(--aether-theme-primary-rgb),.24),
    0 18px 30px rgba(0,0,0,.28) !important;
}

.dice-anim-area{
  perspective:1600px;
  min-height:240px;
}

.dice-group-row{
  position:relative;
  align-items:flex-end;
  min-height:96px;
}

.dice-group-row .anim-die{
  transform-style:preserve-3d;
  box-shadow:
    0 18px 34px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.12);
  animation:dieLaunch3D .9s cubic-bezier(.16,.86,.22,1.18);
}

.dice-group-row .anim-die::before,
.dice-group-row .anim-die::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
}

.dice-group-row .anim-die::before{
  background:linear-gradient(145deg, rgba(255,255,255,.18), transparent 40%);
  transform:translateZ(10px);
}

.dice-group-row .anim-die::after{
  inset:auto 8px -12px 8px;
  height:18px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(0,0,0,.4), transparent 72%);
  filter:blur(5px);
  transform:translateZ(-18px);
}

.dice-group-row .anim-die.tumbling{
  animation:dieBarrel3D .55s linear infinite;
}

@keyframes arcaneButtonSweep{
  0%{transform:rotate(22deg) translateX(-180%);}
  100%{transform:rotate(22deg) translateX(420%);}
}

@keyframes arcanePressPulse{
  0%{transform:scale(1);}
  40%{transform:scale(.975);}
  100%{transform:scale(1);}
}

@keyframes arcaneScreenPulse{
  0%{opacity:0;}
  30%{opacity:1;}
  100%{opacity:0;}
}

@keyframes dieLaunch3D{
  0%{transform:translate3d(0,42px,-180px) rotateX(-72deg) rotateY(-96deg) rotateZ(-24deg) scale(.64); opacity:0;}
  100%{transform:translate3d(0,0,0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1); opacity:1;}
}

@keyframes dieBarrel3D{
  0%{transform:translateY(-8px) rotateX(0deg) rotateY(0deg) rotateZ(0deg);}
  25%{transform:translateY(4px) rotateX(110deg) rotateY(78deg) rotateZ(16deg);}
  50%{transform:translateY(-3px) rotateX(220deg) rotateY(160deg) rotateZ(-10deg);}
  75%{transform:translateY(6px) rotateX(310deg) rotateY(238deg) rotateZ(12deg);}
  100%{transform:translateY(-8px) rotateX(360deg) rotateY(320deg) rotateZ(0deg);}
}

html,body{
  background:
    radial-gradient(circle at 12% 0%, rgba(var(--aether-theme-primary-rgb),.24), transparent 28%),
    radial-gradient(circle at 88% 10%, rgba(var(--aether-theme-accent-rgb),.12), transparent 20%),
    radial-gradient(circle at 50% 120%, rgba(var(--aether-theme-primary-deep-rgb),.18), transparent 42%),
    linear-gradient(180deg, var(--arc-bg-2), var(--arc-bg)) !important;
}

.header,
.portal-panel,
.campaign-panel,
.campaign-card,
.panel,
.panel-card,
.quick-card,
.sheet-section,
.sheet-hero,
#quickview,
#tabs,
.gm-panel,
.gm-sidebar,
.gm-main,
.gm-quickview,
.gm-card,
.gm-detail,
.gm-list-item,
.gm-picker-shell,
.gm-box,
.characters-sidebar,
.characters-detail,
.character-card,
.characters-modal-shell,
.card-modal-shell{
  background:var(--arc-panel-fill-strong) !important;
  border-color:rgba(var(--aether-theme-primary-rgb),.34) !important;
}

.gm-quickview,
.campaign-card,
.gm-combatant-card,
.gm-notice-card,
.gm-log-entry,
.gm-picker-item,
.gm-activity-item,
.builder-choice-card,
.builder-trait-card,
.builder-loadout-card{
  background:linear-gradient(180deg, rgba(var(--arc-panel-2-rgb),.96), rgba(var(--arc-panel-rgb),.99)) !important;
  border-color:rgba(var(--aether-theme-primary-rgb),.28) !important;
}

.portal-btn,
.campaign-btn,
.gm-btn,
.gm-btn-soft,
.characters-secondary-btn,
.card-modal-btn,
#tabs .tab,
button.tab,
button:not(.characters-primary-btn):not(.characters-danger-btn):not(.portal-btn-accent){
  background:linear-gradient(180deg, rgba(var(--arc-panel-3-rgb),.98), rgba(var(--arc-panel-rgb),.98)) !important;
}

.portal-btn-accent,
.characters-primary-btn,
.gm-btn-soft.alt,
#tabs .tab.active,
button.tab.active{
  background:linear-gradient(180deg, var(--aether-theme-primary-soft), var(--aether-theme-primary-deep)) !important;
}

.gm-btn-soft.warn,
.characters-danger-btn,
.card-modal-btn.danger-soft,
.portal-btn-danger{
  background:linear-gradient(180deg, var(--arc-danger), var(--arc-danger-2)) !important;
}

input,
select,
textarea,
.gm-input,
.gm-select,
.gm-textarea,
.portal-input,
.characters-search,
.characters-select,
.characters-input,
.characters-textarea,
.message-thread-select{
  background:linear-gradient(180deg, rgba(var(--arc-panel-rgb),.98), rgba(var(--arc-bg-rgb),.98)) !important;
  color:var(--arc-text) !important;
  border-color:rgba(var(--aether-theme-primary-rgb),.3) !important;
}

.campaign-pill,
.gm-pill,
.character-pill,
.builder-step-pill,
.gm-badge,
.gm-stat-chip{
  background:linear-gradient(180deg, rgba(var(--arc-panel-3-rgb),.94), rgba(var(--arc-panel-rgb),.96)) !important;
  border-color:rgba(var(--aether-theme-accent-rgb),.24) !important;
}

html,body{
  background:
    radial-gradient(ellipse at 50% 18%, rgba(var(--arc-parchment-rgb),.035), transparent 34%),
    radial-gradient(ellipse at 14% -4%, rgba(var(--aether-theme-primary-rgb),.10), transparent 30%),
    radial-gradient(ellipse at 84% 6%, rgba(var(--arc-relic-rgb),.05), transparent 24%),
    radial-gradient(ellipse at 50% 84%, rgba(var(--arc-burn-rgb),.28), transparent 46%),
    linear-gradient(180deg, rgba(var(--arc-smoke-deep-rgb),1), rgba(var(--arc-bg-rgb),1) 48%, rgba(var(--arc-smoke-deep-rgb),1)) !important;
}

body::before{
  background:
    radial-gradient(ellipse at 16% 14%, rgba(var(--arc-burn-rgb),.18), transparent 20%),
    radial-gradient(ellipse at 82% 12%, rgba(var(--arc-burn-rgb),.16), transparent 18%),
    radial-gradient(ellipse at 28% 68%, rgba(var(--arc-stain-rgb),.16), transparent 26%),
    radial-gradient(ellipse at 72% 80%, rgba(var(--arc-smoke-rgb),.14), transparent 30%),
    radial-gradient(ellipse at center, transparent 54%, rgba(0,0,0,.34) 100%),
    linear-gradient(180deg, rgba(255,255,255,.012), rgba(0,0,0,.22)) !important;
  opacity:1 !important;
}

body::after{
  background-image:
    radial-gradient(ellipse at 22% 24%, rgba(var(--arc-parchment-rgb),.05), transparent 18%),
    radial-gradient(ellipse at 76% 20%, rgba(var(--arc-stain-rgb),.08), transparent 22%),
    radial-gradient(ellipse at 36% 76%, rgba(var(--arc-relic-rgb),.04), transparent 16%),
    radial-gradient(ellipse at 84% 78%, rgba(var(--arc-smoke-rgb),.08), transparent 20%),
    radial-gradient(circle at 24% 34%, rgba(255,255,255,.012) .55px, transparent .95px),
    radial-gradient(circle at 67% 58%, rgba(0,0,0,.06) .75px, transparent 1.15px);
  background-size:360px 290px, 460px 340px, 380px 320px, 520px 380px, 26px 26px, 32px 32px;
  opacity:.14 !important;
  mix-blend-mode:soft-light !important;
}

.header::before,
.portal-panel::before,
.campaign-panel::before,
.panel::before,
.panel-card::before,
.quick-card::before,
.sheet-section::before,
.sheet-hero::before,
#quickview::before,
.gm-panel::before,
.gm-sidebar::before,
.gm-main::before,
.gm-card::before,
.gm-detail::before,
.gm-list-item::before,
.gm-picker-shell::before,
.gm-box::before,
.characters-sidebar::before,
.characters-detail::before,
.character-card::before,
.characters-modal-shell::before,
.card-modal-shell::before{
  background:
    radial-gradient(ellipse at 18% 18%, rgba(var(--arc-parchment-rgb),.10), transparent 20%),
    radial-gradient(ellipse at 82% 18%, rgba(var(--arc-stain-rgb),.10), transparent 18%),
    radial-gradient(ellipse at 54% 70%, rgba(var(--arc-smoke-rgb),.12), transparent 26%),
    linear-gradient(180deg, rgba(255,255,255,.03), transparent 30%, rgba(0,0,0,.12) 100%) !important;
}

.header::after,
.portal-panel::after,
.campaign-panel::after,
.panel::after,
.panel-card::after,
.quick-card::after,
.sheet-section::after,
.sheet-hero::after,
#quickview::after,
.gm-panel::after,
.gm-sidebar::after,
.gm-main::after,
.gm-card::after,
.gm-detail::after,
.gm-list-item::after,
.gm-picker-shell::after,
.gm-box::after,
.characters-sidebar::after,
.characters-detail::after,
.character-card::after,
.characters-modal-shell::after,
.card-modal-shell::after{
  opacity:.62 !important;
  background-image:
    radial-gradient(circle at 20% 24%, rgba(255,255,255,.012) .55px, transparent .9px),
    radial-gradient(circle at 74% 68%, rgba(0,0,0,.08) .75px, transparent 1.05px),
    radial-gradient(ellipse at center, transparent 58%, rgba(var(--arc-burn-rgb),.22) 100%) !important;
}

.header,
.portal-panel,
.campaign-panel,
.campaign-card,
.panel,
.panel-card,
.quick-card,
.sheet-section,
.sheet-hero,
#quickview,
#tabs,
.gm-panel,
.gm-sidebar,
.gm-main,
.gm-quickview,
.gm-card,
.gm-detail,
.gm-list-item,
.gm-picker-shell,
.gm-box,
.characters-sidebar,
.characters-detail,
.character-card,
.characters-modal-shell,
.card-modal-shell{
  background:
    radial-gradient(ellipse at 50% 28%, rgba(var(--arc-parchment-rgb),.08), transparent 44%),
    linear-gradient(180deg, rgba(var(--arc-burn-rgb),.20), rgba(var(--arc-panel-2-rgb),.88) 16%, rgba(var(--arc-panel-rgb),.985)) !important;
  box-shadow:
    0 18px 40px rgba(0,0,0,.32),
    0 0 0 1px rgba(var(--arc-relic-rgb),.08),
    inset 0 1px 0 rgba(255,255,255,.04),
    inset 0 -26px 38px rgba(0,0,0,.24),
    inset 0 0 34px rgba(var(--arc-smoke-rgb),.08),
    inset 0 0 0 1px rgba(var(--arc-burn-rgb),.16) !important;
}

.portal-btn,
.campaign-btn,
.gm-btn,
.gm-btn-soft,
.characters-secondary-btn,
.card-modal-btn,
#tabs .tab,
button.tab,
button:not(.characters-primary-btn):not(.characters-danger-btn):not(.portal-btn-accent){
  background:
    linear-gradient(180deg, rgba(var(--arc-burn-rgb),.24), rgba(var(--arc-panel-3-rgb),.88) 20%, rgba(var(--arc-smoke-rgb),.98)) !important;
  box-shadow:
    0 12px 24px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.05),
    inset 0 -14px 22px rgba(0,0,0,.20),
    inset 0 0 0 1px rgba(var(--arc-burn-rgb),.14) !important;
}

.portal-btn-accent,
.characters-primary-btn,
.gm-btn-soft.alt,
#tabs .tab.active,
button.tab.active{
  background:
    linear-gradient(180deg, rgba(var(--arc-parchment-rgb),.14), rgba(var(--aether-theme-primary-soft-rgb),.56) 18%, rgba(var(--aether-theme-primary-deep-rgb),.94)) !important;
  box-shadow:
    0 14px 28px rgba(0,0,0,.24),
    0 0 18px rgba(var(--aether-theme-primary-rgb),.12),
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 -16px 24px rgba(0,0,0,.22),
    inset 0 0 0 1px rgba(var(--arc-relic-rgb),.14) !important;
}

.campaign-pill,
.gm-pill,
.character-pill,
.builder-step-pill,
.gm-badge,
.gm-stat-chip{
  background:
    linear-gradient(180deg, rgba(var(--arc-burn-rgb),.16), rgba(var(--arc-panel-3-rgb),.80) 20%, rgba(var(--arc-smoke-rgb),.95)) !important;
  color:#efe4cf !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    inset 0 -10px 16px rgba(0,0,0,.16),
    inset 0 0 0 1px rgba(var(--arc-burn-rgb),.12) !important;
}

/* Combat map interaction layers must remain visually neutral over uploaded art. */
.player-combat-map-surface,
.gm-combat-map-surface{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
}

.player-combat-map-surface::after,
.gm-combat-map-surface::after{
  content:none !important;
  display:none !important;
  background:none !important;
  box-shadow:none !important;
  animation:none !important;
}

body.combat-mode .gm-main,
body.combat-mode .gm-detail.gm-combat-map-card{
  background:transparent !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
}

body.combat-mode .gm-main::before,
body.combat-mode .gm-main::after,
body.combat-mode .gm-detail.gm-combat-map-card::before,
body.combat-mode .gm-detail.gm-combat-map-card::after{
  content:none !important;
  display:none !important;
  background:none !important;
  opacity:0 !important;
  box-shadow:none !important;
}

body.combat-mode .gm-detail.gm-combat-map-card .gm-combat-map-shell,
body.combat-mode .gm-detail.gm-combat-map-card .gm-combat-map-grid{
  background:transparent !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
}

/* When the battlemap is popped out, Safari must not inherit transformed ancestors. */
body.gm-map-popout-open .campaign-shell,
body.gm-map-popout-open .campaign-panel,
body.gm-map-popout-open .campaign-panel:hover,
body.gm-map-popout-open .gm-dashboard,
body.gm-map-popout-open .gm-main,
body.gm-map-popout-open .gm-main:hover,
body.gm-map-popout-open .gm-sidebar,
body.gm-map-popout-open .gm-sidebar:hover,
body.gm-map-popout-open .gm-quickview,
body.gm-map-popout-open .gm-quickview:hover,
body.gm-map-popout-open .gm-card,
body.gm-map-popout-open .gm-card:hover,
body.gm-map-popout-open .gm-detail,
body.gm-map-popout-open .gm-detail:hover{
  transform:none !important;
  filter:none !important;
  transition:none !important;
}

body.gm-map-popout-open .gm-main,
body.gm-map-popout-open .gm-sidebar,
body.gm-map-popout-open .gm-quickview,
body.gm-map-popout-open .campaign-panel{
  box-shadow:none !important;
}


/* Responsive shell overhaul */
:root{
  --aether-shell-max:1720px;
  --aether-shell-pad:clamp(10px, 1.3vw, 20px);
  --aether-shell-gap:clamp(12px, 1.4vw, 18px);
  --aether-tabs-width:clamp(122px, 9vw, 146px);
  --aether-rail-width:clamp(252px, 19vw, 296px);
  --aether-panel-radius:clamp(18px, 2vw, 26px);
}

html,
body{
  min-height:100%;
}

body{
  min-height:100dvh;
  overflow-x:hidden !important;
  overflow-y:auto !important;
}

#app,
.portal-shell,
.campaign-shell{
  min-height:100dvh;
}

#app{
  width:min(100%, var(--aether-shell-max));
  height:auto !important;
  min-height:100dvh;
  margin:0 auto;
  padding:var(--aether-shell-pad);
  gap:var(--aether-shell-gap);
  overflow:visible !important;
}

#debug-status{
  display:none !important;
}

.header{
  position:sticky;
  top:var(--aether-shell-pad);
  z-index:80;
  display:grid !important;
  grid-template-columns:auto minmax(0, 1fr) auto;
  align-items:center !important;
  gap:10px 16px !important;
  padding:clamp(12px, 1.35vw, 16px) clamp(14px, 1.6vw, 20px) !important;
  border-radius:var(--aether-panel-radius);
}

.title{
  font-size:clamp(20px, 2vw, 28px);
  line-height:1;
}

.session{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
  min-width:0;
}

.session span{
  display:inline-flex;
  align-items:center;
  gap:6px;
  min-height:40px;
  max-width:100%;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(var(--arc-relic-rgb), .18);
  background:linear-gradient(180deg, rgba(var(--arc-panel-3-rgb), .72), rgba(var(--arc-panel-rgb), .94));
  color:var(--arc-text, #f3f0e8);
}

.session span + span{
  margin-left:0 !important;
}

.header-nav{
  margin-left:0 !important;
  justify-content:flex-end;
  min-width:0;
}

.header-nav-btn{
  min-height:44px;
}

.main{
  display:grid !important;
  grid-template-columns:var(--aether-tabs-width) minmax(0, 1fr) var(--aether-rail-width);
  grid-template-areas:"tabs content rail";
  gap:var(--aether-shell-gap);
  align-items:start;
  overflow:visible !important;
  min-height:0;
}

#tabs{
  grid-area:tabs;
  display:flex;
  flex-direction:column;
  align-self:start;
  position:sticky;
  top:calc(var(--aether-shell-pad) + 92px);
  min-width:0;
  max-height:calc(100dvh - 150px);
  overflow:auto;
  padding:10px 8px !important;
  border-radius:var(--aether-panel-radius);
}

#tabs .tab,
button.tab{
  min-height:54px;
  padding:12px 10px !important;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:3px;
  align-items:flex-start;
  text-align:left;
  white-space:normal !important;
  overflow-wrap:anywhere;
  word-break:break-word;
  line-height:1.12;
}

#tabs .tab .tab-main,
#tabs .tab .tab-sub,
button.tab .tab-main,
button.tab .tab-sub{
  display:block;
  width:100%;
}

#tabs .tab .tab-main,
button.tab .tab-main{
  font-size:13px;
}

#tabs .tab .tab-sub,
button.tab .tab-sub{
  font-size:10px;
  line-height:1.1;
}

#content{
  grid-area:content;
  min-width:0;
  min-height:0;
  padding:0 !important;
  overflow:visible !important;
}

#content > .panel.active{
  display:block;
  width:min(100%, 1240px);
  margin-inline:auto;
}

#quickview{
  grid-area:rail;
  align-self:start;
  justify-self:end;
  width:min(100%, var(--aether-rail-width)) !important;
  min-width:0 !important;
  max-width:none !important;
  display:grid;
  gap:12px;
  grid-auto-rows:max-content;
  align-content:start;
  padding:clamp(12px, 1.25vw, 16px) !important;
  border-radius:var(--aether-panel-radius);
  overflow:visible !important;
}

#quickview > .quick-card{
  margin-bottom:0;
}

.quick-rail-toolbar,
#qv-optional-modules{
  grid-column:1 / -1;
}

.quick-trackers-list{
  max-height:min(42vh, 420px);
}

.sheet-shell,
.cards-shell{
  width:min(100%, 1240px);
  margin-inline:auto;
}

.cards-toolbar,
.inventory-add,
.manual-roll{
  display:flex;
  flex-wrap:wrap;
  align-items:stretch;
  gap:12px;
}

.cards-toolbar > *,
.inventory-add > *,
.manual-roll > *{
  flex:1 1 180px;
}

.big-text,
.log-box{
  min-height:clamp(220px, 34vh, 520px);
}

.cards-grid{
  grid-template-columns:repeat(auto-fit, minmax(min(100%, 230px), 1fr));
}

.portal-shell,
.campaign-shell{
  align-items:center;
  padding:var(--aether-shell-pad);
}

.portal-panel,
.campaign-panel{
  width:min(100%, 1180px);
  margin-inline:auto;
  padding:clamp(18px, 1.8vw, 26px);
  border-radius:clamp(20px, 2vw, 28px);
}

.portal-panel-wide{
  width:min(100%, 1200px);
}

.portal-actions{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px !important;
  margin-top:18px !important;
}

.campaign-topbar .campaign-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px !important;
}

.campaign-card .campaign-actions{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
}

.portal-footer,
.campaign-topbar{
  gap:12px;
}

.portal-theme-head,
.campaign-topbar{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  flex-wrap:wrap;
}

.campaign-list{
  grid-template-columns:repeat(auto-fit, minmax(320px, 1fr));
}

.campaign-card{
  height:100%;
}

.player-combat-shell{
  width:min(1500px, calc(100vw - 24px));
  max-height:calc(100dvh - 24px);
}

.player-combat-grid{
  grid-template-columns:minmax(0, 1.35fr) minmax(320px, .92fr) !important;
}

.player-combat-map-panel.map-popout{
  width:min(1760px, calc(100vw - 24px));
  height:calc(100dvh - 24px);
  max-height:calc(100dvh - 24px);
}

.characters-shell,
.player-tools-layout{
  width:min(100%, 1600px);
  margin:0 auto;
  gap:var(--aether-shell-gap);
  padding:0 !important;
  height:auto !important;
  min-height:0 !important;
  overflow:visible !important;
  align-items:start;
}

.characters-sidebar,
.characters-detail,
.characters-detail-body,
.character-roster{
  height:auto !important;
  max-height:none;
  overflow:visible !important;
}

.characters-grid{
  max-height:min(58vh, 760px);
  overflow:auto;
  padding-right:4px;
}

body.combat-mode .gm-dashboard{
  grid-template-columns:clamp(200px, 18vw, 240px) minmax(0, 1fr) clamp(280px, 24vw, 340px);
  grid-template-areas:"sidebar main quick";
  gap:var(--aether-shell-gap);
  align-items:start;
}

body.combat-mode .gm-sidebar{
  grid-area:sidebar;
  position:sticky;
  top:var(--aether-shell-pad);
  max-height:calc(100dvh - 42px);
}

body.combat-mode .gm-main{
  grid-area:main;
  padding:clamp(14px, 1.45vw, 18px);
}

body.combat-mode .gm-main-header{
  top:calc(-1 * clamp(14px, 1.45vw, 18px));
}

body.combat-mode .gm-quickview{
  grid-area:quick;
  display:block !important;
  position:sticky;
  top:var(--aether-shell-pad);
  max-height:calc(100dvh - 42px);
  overflow:hidden;
}

body.combat-mode .gm-quickview-scroll{
  max-height:calc(100dvh - 110px);
  overflow:auto;
}

body.combat-mode .campaign-panel{
  width:min(100%, 1720px);
}

body.combat-mode .gm-dashboard{
  grid-template-columns:clamp(180px, 16vw, 220px) minmax(0, 1fr) clamp(280px, 24vw, 340px) !important;
  grid-template-areas:"sidebar main quick";
}

body.combat-mode .gm-sidebar,
body.combat-mode .gm-quickview{
  position:sticky;
  top:var(--aether-shell-pad);
}

@media (max-width:1240px){
  .main{
    grid-template-columns:minmax(0, 1fr) minmax(280px, 34vw);
    grid-template-areas:
      "tabs tabs"
      "content rail";
  }

  #tabs{
    position:sticky;
    top:calc(var(--aether-shell-pad) + 92px);
    flex-direction:row;
    align-items:stretch;
    max-height:none;
    overflow:auto hidden;
    padding:10px 12px !important;
  }

  #tabs .tab,
  button.tab{
    flex:0 0 auto;
    min-width:max-content;
    padding:12px 14px !important;
    text-align:center;
  }

  #tabs .tab.tab-action,
  button.tab.tab-action{
    margin-top:0;
    margin-left:auto;
  }

  body.combat-mode .gm-dashboard{
    grid-template-columns:clamp(220px, 30vw, 280px) minmax(0, 1fr);
    grid-template-areas:
      "sidebar main"
      "quick main";
  }

  body.combat-mode .gm-quickview{
    position:sticky;
    top:var(--aether-shell-pad);
  }
}

@media (max-width:980px){
  .portal-shell,
  .campaign-shell{
    align-items:flex-start;
  }

  .header{
    position:static;
    top:auto;
    grid-template-columns:1fr;
  }

  .header-nav{
    width:100%;
    justify-content:flex-start;
  }

  .main{
    grid-template-columns:1fr;
    grid-template-areas:
      "tabs"
      "content"
      "rail";
  }

  #tabs{
    top:0;
    z-index:40;
  }

  #quickview{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .quick-rail-toolbar,
  #qv-optional-modules{
    grid-column:1 / -1;
  }

  body.combat-mode .gm-dashboard{
    grid-template-columns:1fr !important;
    grid-template-areas:
      "sidebar"
      "main"
      "quick";
  }

  body.combat-mode .gm-sidebar,
  body.combat-mode .gm-quickview{
    position:static;
    max-height:none;
    overflow:visible !important;
  }

  body.combat-mode .gm-main{
    overflow:visible !important;
  }

  .gm-nav{
    grid-template-columns:repeat(auto-fit, minmax(140px, 1fr));
  }

  .player-combat-grid{
    grid-template-columns:1fr !important;
  }

  .characters-shell,
  .player-tools-layout{
    grid-template-columns:1fr;
  }

  .characters-grid{
    max-height:none;
  }
}

@media (max-width:700px){
  #app,
  .portal-shell,
  .campaign-shell{
    padding:12px;
  }

  .header{
    padding:12px !important;
    border-radius:20px;
  }

  .session{
    width:100%;
  }

  .session span{
    width:100%;
    justify-content:flex-start;
  }

  .header-nav{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:8px;
  }

  .header-nav-btn{
    width:100%;
  }

  #tabs{
    padding:8px !important;
    border-radius:20px;
    gap:6px;
  }

  #tabs .tab,
  button.tab{
    min-width:140px;
    padding:10px 12px !important;
  }

  #quickview{
    grid-template-columns:1fr;
    padding:12px !important;
    border-radius:20px;
  }

  .cards-toolbar,
  .inventory-add,
  .manual-roll{
    flex-direction:column;
  }

  .cards-toolbar > *,
  .inventory-add > *,
  .manual-roll > *{
    flex:1 1 auto;
  }

  .player-combat-shell{
    width:min(100vw - 12px, 100%);
    max-height:calc(100dvh - 12px);
    padding:14px;
    border-radius:20px;
  }

  .player-combat-map-panel.map-popout{
    inset:6px;
    left:auto;
    top:auto;
    transform:none;
    width:auto;
    height:auto;
    max-height:none;
    border-radius:20px;
  }

  .portal-panel,
  .campaign-panel{
    padding:16px;
  }

  .portal-actions,
  .campaign-card .campaign-actions{
    grid-template-columns:1fr;
  }

  .campaign-topbar .campaign-actions{
    display:grid;
    grid-template-columns:1fr;
  }

  .campaign-list{
    grid-template-columns:1fr;
  }

  .gm-main-header{
    position:static;
    top:auto;
    background:none;
    backdrop-filter:none;
    padding-bottom:0;
    margin-bottom:0;
  }

  .gm-sidebar,
  .gm-main,
  .gm-quickview{
    border-radius:20px;
  }
}

/* === Iteration 7: astral sigil brand pass === */
:root{
  --aether-theme-aura:#74d8ff;
  --aether-theme-aura-rgb:116, 216, 255;
  --aether-theme-aura-soft:#ecfbff;
  --aether-theme-aura-soft-rgb:236, 251, 255;
  --aether-theme-violet:#b692ff;
  --aether-theme-violet-rgb:182, 146, 255;
  --aether-theme-star:#fbf6ff;
}

html,
body{
  background:
    radial-gradient(circle at 50% -16%, rgba(var(--aether-theme-aura-rgb), .24), transparent 22%),
    radial-gradient(circle at 14% 14%, rgba(var(--aether-theme-violet-rgb), .16), transparent 24%),
    radial-gradient(circle at 86% 10%, rgba(var(--aether-theme-primary-rgb), .18), transparent 22%),
    linear-gradient(180deg, #060916 0%, #090412 42%, #04020b 100%);
}

body::before{
  background:
    radial-gradient(circle at 50% -8%, rgba(var(--aether-theme-aura-rgb), .17), transparent 22%),
    radial-gradient(circle at 50% 10%, rgba(var(--aether-theme-violet-rgb), .13), transparent 20%),
    radial-gradient(circle at 50% 10%, transparent 0 15%, rgba(var(--aether-theme-aura-rgb), .14) 17%, transparent 19%),
    radial-gradient(circle at 18% 20%, rgba(255,255,255,.045), transparent 18%),
    radial-gradient(circle at 82% 24%, rgba(255,255,255,.035), transparent 20%),
    linear-gradient(180deg, rgba(255,255,255,.02), transparent 20%, transparent 76%, rgba(0,0,0,.22));
  opacity:1;
}

body::after{
  background-image:
    radial-gradient(circle at 12% 20%, rgba(255,255,255,.95) .7px, transparent 1px),
    radial-gradient(circle at 68% 30%, rgba(206,167,255,.78) .85px, transparent 1.15px),
    radial-gradient(circle at 42% 10%, rgba(116,216,255,.88) 1px, transparent 1.35px),
    radial-gradient(circle at 50% 10%, rgba(var(--aether-theme-aura-rgb), .18), transparent 18%),
    radial-gradient(circle at 50% 10%, transparent 0 21%, rgba(var(--aether-theme-violet-rgb), .12) 23%, transparent 24%);
  background-size:220px 220px, 280px 280px, 320px 320px, 100% 100%, 100% 100%;
  background-position:0 0, 40px 80px, 80px 20px, center top, center top;
  opacity:.3;
  mix-blend-mode:screen;
  animation:aetherStarfield 26s linear infinite;
}

#app::before,
.portal-shell::before,
.campaign-shell::before,
.characters-shell::before,
.builder-shell::before{
  content:"";
  position:fixed;
  left:50%;
  top:-18vh;
  width:min(74vw, 720px);
  height:min(74vw, 720px);
  transform:translateX(-50%);
  border-radius:50%;
  pointer-events:none;
  z-index:0;
  background:
    radial-gradient(circle, rgba(var(--aether-theme-aura-rgb), .18) 0, rgba(var(--aether-theme-violet-rgb), .14) 26%, rgba(var(--aether-theme-primary-rgb), .08) 44%, transparent 70%),
    radial-gradient(circle, transparent 0 36%, rgba(var(--aether-theme-aura-rgb), .09) 38%, transparent 40%);
  filter:blur(8px);
  opacity:.72;
}

.header,
.campaign-topbar,
.portal-brand-hero,
.characters-sidebar-top,
.characters-detail-top,
.gm-sidebar-head,
.gm-main-header,
.gm-quickview-head,
.sheet-hero{
  background:
    radial-gradient(circle at 18% 34%, rgba(var(--aether-theme-aura-rgb), .12), transparent 18%),
    radial-gradient(circle at 82% 18%, rgba(var(--aether-theme-violet-rgb), .18), transparent 26%),
    linear-gradient(135deg, rgba(8,17,36,.72), rgba(30,12,43,.44) 54%, rgba(6,8,19,.18));
  box-shadow:
    0 24px 58px rgba(0,0,0,.42),
    0 0 0 1px rgba(var(--aether-theme-aura-rgb), .08),
    inset 0 1px 0 rgba(255,255,255,.05),
    inset 0 0 38px rgba(var(--aether-theme-aura-rgb), .06);
}

.title,
.portal-title,
.campaign-title,
.gm-main-title,
.characters-title,
.sheet-name{
  color:var(--aether-theme-star);
  text-shadow:none;
}

.title,
.portal-title,
.campaign-title{
  position:relative;
  display:inline-flex;
  align-items:center;
}

.portal-subtitle,
.campaign-subtitle,
.gm-shell-label,
.gm-label,
.characters-kicker,
.section-title{
  color:#87dfff !important;
  text-shadow:0 0 16px rgba(var(--aether-theme-aura-rgb), .18);
}

.header-nav-btn,
.portal-btn,
.campaign-btn,
.gm-btn,
.gm-btn-soft,
.characters-primary-btn,
.characters-secondary-btn,
.characters-danger-btn{
  text-shadow:0 0 12px rgba(var(--aether-theme-aura-rgb), .12);
}

.sheet-portrait,
.characters-avatar-preview,
.avatar-crop-preview-circle,
.avatar-preview-circle{
  box-shadow:
    0 0 0 1px rgba(var(--aether-theme-aura-rgb), .3),
    0 0 0 6px rgba(var(--aether-theme-aura-rgb), .05),
    0 0 26px rgba(var(--aether-theme-aura-rgb), .18);
}

.gm-main-chip,
.feature-pill,
.sheet-chip,
.gm-pill{
  background:
    linear-gradient(180deg, rgba(37,30,58,.92), rgba(17,14,28,.98));
  border-color:rgba(var(--aether-theme-aura-rgb), .18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04), 0 8px 18px rgba(0,0,0,.16);
}

@keyframes aetherStarfield{
  from{ transform:translateY(0); }
  to{ transform:translateY(24px); }
}

@media (max-width: 720px){
  .title,
  .portal-title,
  .campaign-title{
    gap:10px;
  }

  .title::before,
  .portal-title::before,
  .campaign-title::before{
    width:18px;
    height:18px;
  }

  #app::before,
  .portal-shell::before,
  .campaign-shell::before,
  .characters-shell::before,
  .builder-shell::before{
    width:min(88vw, 540px);
    height:min(88vw, 540px);
    top:-10vh;
  }
}
