html{color-scheme:light}
html[data-theme="dark"]{color-scheme:dark}
body.aspire-shell{
  margin:0;
  min-height:100vh;
  font-family:"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  background:var(--bg);
  color:var(--ink);
}
.aspire-topbar{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:0.65rem 1rem;
  padding:0.75rem 1.25rem;
  border-bottom:1px solid var(--line);
  background:var(--panel);
  min-width:0;
  max-width:100%;
}
.aspire-topbar h1{margin:0;font-size:1.25rem;font-weight:800;flex:1 1 8rem;min-width:0}
.aspire-topbar-actions,
.aspire-topbar > :not(h1){
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-end;
  gap:0.5rem 0.75rem;
  min-width:0;
  flex:1 1 12rem;
  max-width:100%;
}
.aspire-main{width:100%;max-width:52rem;margin:0 auto;padding:1.5rem 1.25rem 3rem;min-width:0;box-sizing:border-box}
.aspire-card{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:12px;
  padding:1.25rem 1.5rem;
  box-shadow:var(--shadow);
}
.aspire-card h2{margin:0 0 0.75rem;font-size:1.25rem}
.aspire-field{margin-bottom:1rem}
.aspire-field label{display:block;margin-bottom:0.35rem;color:var(--muted);font-size:0.9rem;font-weight:700}
.aspire-field input,.aspire-field select{
  width:100%;
  max-width:20rem;
  padding:0.45rem 0.55rem;
  border:1px solid var(--line2);
  border-radius:8px;
  background:var(--panel);
  color:var(--ink);
  font:inherit;
}
.aspire-btn{
  display:inline-block;
  padding:var(--btn-pad-y) var(--btn-pad-x);
  border:1px solid var(--link);
  border-radius:var(--btn-radius);
  background:var(--link);
  color:#fff;
  font:inherit;
  font-size:var(--btn-font-size);
  font-weight:700;
  cursor:pointer;
  text-decoration:none;
}
.aspire-btn:hover{filter:brightness(.95)}
.aspire-btn.ghost{background:transparent;color:var(--accent2);border-color:var(--accent2)}
html[data-theme="dark"] .aspire-btn.ghost{color:var(--accent2);border-color:var(--accent2)}
.aspire-btn.danger{border-color:var(--accent);background:transparent;color:var(--accent)}
.aspire-error{color:var(--accent);margin:0.5rem 0}
.aspire-muted{color:var(--muted);font-size:0.9rem}
.aspire-char-list{list-style:none;margin:0;padding:0}
.aspire-char-list li{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:0.5rem 0.75rem;
  padding:0.65rem 0;
  border-bottom:1px solid var(--line);
  min-width:0;
  max-width:100%;
}
.aspire-char-list li > strong{
  flex:1 1 6rem;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
}
.aspire-char-list .meta{
  flex:1 1 100%;
  min-width:0;
  color:var(--muted);
  font-size:0.85rem;
  overflow-wrap:anywhere;
}
.aspire-char-list .aspire-btn{flex:0 1 auto;max-width:100%}
.aspire-page-title{margin:0 0 1rem;font-size:1.5rem;font-weight:800;color:var(--accent)}
.aspire-toolbar{display:flex;flex-wrap:wrap;gap:0.5rem;margin-bottom:1rem}
.theme-switch{display:flex;gap:0.35rem;align-items:center;font-size:0.85rem;color:var(--muted);font-weight:700}
.theme-switch select{
  width:auto;
  padding:0.25rem 0.4rem;
  border:1px solid var(--line2);
  border-radius:8px;
  background:var(--panel);
  color:var(--ink);
  font:inherit;
}

/* Site navigation (all pages) */
.aspire-site-nav{
  border-bottom:1px solid var(--line);
  background:var(--panel);
  padding:0.55rem 1rem;
  min-width:0;
  max-width:100%;
  box-sizing:border-box;
}
.aspire-site-nav-inner{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:0.35rem 0.65rem;
  max-width:120rem;
  margin:0 auto;
  min-width:0;
}
.aspire-site-nav-brand{
  font-weight:800;
  font-size:1rem;
  color:var(--accent);
  text-decoration:none;
  margin-right:0.35rem;
}
.aspire-site-nav-brand:hover{text-decoration:underline}
.aspire-site-nav-link{
  font-size:0.9rem;
  font-weight:700;
  color:var(--accent2);
  text-decoration:none;
  padding:0.35rem 0.5rem;
  border-radius:6px;
}
.aspire-site-nav-link:hover{text-decoration:underline}
.aspire-site-nav-link.is-active{
  color:var(--ink);
  background:rgba(200,16,46,.12);
  text-decoration:none;
}
html[data-theme="dark"] .aspire-site-nav-link.is-active{background:rgba(255,123,123,.15)}
.aspire-site-nav-spacer{flex:1 1 2rem;min-width:0}
.aspire-site-nav-account-inner{display:flex;flex-wrap:wrap;align-items:center;gap:0.35rem 0.65rem;min-width:0}
.aspire-site-nav-user{font-size:0.85rem;color:var(--muted);font-weight:700;max-width:12rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.aspire-site-nav-signout,.aspire-site-nav-signin{
  font:inherit;
  font-size:0.85rem;
  font-weight:700;
  cursor:pointer;
  border:1px solid var(--line2);
  border-radius:6px;
  padding:0.3rem 0.55rem;
  background:transparent;
  color:var(--accent2);
  text-decoration:none;
}
.aspire-site-nav-signout:hover,.aspire-site-nav-signin:hover{filter:brightness(.95)}
.aspire-site-nav-browse{position:relative;display:flex;align-items:center;gap:0.35rem;min-width:0}
.aspire-site-nav-browse-btn{
  font:inherit;
  font-size:0.9rem;
  font-weight:700;
  border:1px solid transparent;
  border-radius:6px;
  padding:0.35rem 0.5rem;
  background:transparent;
  color:var(--accent2);
  cursor:pointer;
}
.aspire-site-nav-browse-btn.is-active,.aspire-site-nav-browse-btn[aria-expanded="true"]{
  color:var(--ink);
  background:rgba(200,16,46,.12);
}
.aspire-site-nav-browse-panel{
  position:absolute;
  top:100%;
  left:0;
  z-index:40;
  min-width:10rem;
  margin-top:0.25rem;
  padding:0.35rem;
  border:1px solid var(--line);
  border-radius:8px;
  background:var(--panel);
  box-shadow:var(--shadow);
  display:flex;
  flex-direction:column;
  gap:0.15rem;
}
.aspire-site-nav-browse-panel[hidden]{display:none}
.aspire-site-nav-browse-link{
  display:block;
  padding:0.4rem 0.55rem;
  border-radius:6px;
  font-size:0.88rem;
  font-weight:700;
  color:var(--accent2);
  text-decoration:none;
}
.aspire-site-nav-browse-link:hover{background:var(--hover-surface);text-decoration:none}
.aspire-site-nav-browse-link.is-active{background:rgba(200,16,46,.12);color:var(--ink)}
.aspire-site-nav-browse-inline{display:none;flex-wrap:wrap;gap:0.15rem 0.35rem;align-items:center}
@media (min-width:900px){
  .aspire-site-nav-browse-btn{display:none}
  .aspire-site-nav-browse-panel{display:none!important}
  .aspire-site-nav-browse-inline{display:flex}
}
.aspire-site-nav-theme{margin-left:0.15rem;flex-shrink:0}
.aspire-site-nav-account-btn{
  display:none;
  align-items:center;
  justify-content:center;
  min-width:40px;
  min-height:40px;
  padding:0.35rem;
  border:1px solid var(--line2);
  border-radius:8px;
  background:var(--panel);
  color:var(--accent2);
  cursor:pointer;
  flex-shrink:0;
}
.aspire-site-nav-account-btn:hover{border-color:var(--accent)}
.aspire-site-nav-account-panel{
  position:absolute;
  top:100%;
  right:0;
  z-index:45;
  min-width:11rem;
  margin-top:0.25rem;
  padding:0.45rem;
  border:1px solid var(--line);
  border-radius:8px;
  background:var(--panel);
  box-shadow:var(--shadow);
  display:flex;
  flex-direction:column;
  gap:0.35rem;
}
.aspire-site-nav-account-panel[hidden]{display:none}
.aspire-site-nav-account-panel-user{font-size:0.85rem;color:var(--muted);font-weight:700;padding:0.25rem 0.35rem}
.aspire-site-nav-account-panel-actions{display:flex;flex-direction:column;gap:0.25rem}
.aspire-site-nav-account-panel .aspire-site-nav-link,
.aspire-site-nav-account-panel .aspire-site-nav-signout{
  display:flex;
  align-items:center;
  min-height:40px;
  padding:0.35rem 0.55rem;
  box-sizing:border-box;
}
.aspire-site-nav-account{position:relative;min-width:0;display:flex;align-items:center;gap:0.25rem}

/* Home page */
.aspire-home-main{max-width:960px}
.home-hero{text-align:center;margin-bottom:1.75rem}
.home-hero h1{margin:0.35rem 0 0.5rem;font-size:2rem;color:var(--accent)}
.home-tagline{margin:0;color:var(--muted);font-size:1rem}
.home-tiles{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:0.85rem;
  margin-bottom:2rem;
}
.home-tile{
  display:flex;
  flex-direction:column;
  gap:0.35rem;
  padding:1.1rem 1.25rem;
  border-radius:12px;
  border:1px solid var(--line);
  background:var(--panel);
  box-shadow:var(--shadow);
  text-decoration:none;
  color:inherit;
  min-width:0;
}
.home-tile:hover{border-color:var(--accent)}
.home-tile-primary{border-color:rgba(200,16,46,.35)}
.home-tile-accent{border-style:dashed}
.home-tile-title{font-size:1.15rem;font-weight:800;color:var(--ink)}
.home-tile-desc{font-size:0.9rem;color:var(--muted);line-height:1.4}
.home-section-h{
  font-size:0.75rem;
  font-weight:800;
  letter-spacing:0.06em;
  text-transform:uppercase;
  color:var(--muted);
  margin:0 0 0.75rem;
}
.home-browse-grid{margin-bottom:1.5rem}
.aspire-create .wrap{padding-top:1rem}

.campaign-warn-host:empty{display:none}
.campaign-warn-banner{
  display:flex;
  align-items:flex-start;
  gap:0.5rem;
  margin:0.5rem 0.75rem 0;
  padding:0.65rem 0.75rem;
  border-radius:10px;
  border:1px solid rgba(200,16,46,.35);
  color:var(--ink);
  font-size:0.9rem;
  line-height:1.4;
}
.campaign-warn-banner .phosphor-icon{color:var(--accent);flex-shrink:0;margin-top:0.1rem}
.campaign-src-warn{display:inline-flex;vertical-align:middle;margin-left:0.25rem;color:var(--accent)}
.campaign-src-warn .phosphor-icon{color:var(--accent)}
.ed-card.is-disabled{opacity:0.45;pointer-events:none;filter:grayscale(0.2)}
.campaign-book-presets{margin:0.35rem 0 0}
.campaign-book-presets .aspire-btn{font-size:0.85rem;padding:0.35rem 0.65rem}
.campaign-book-picker{
  display:flex;
  flex-wrap:wrap;
  gap:0.35rem 0.5rem;
  margin:0.5rem 0 0.75rem;
  max-height:12rem;
  overflow:auto;
  padding:0.35rem;
  border:1px solid var(--line);
  border-radius:10px;
}
.campaign-book-chip{
  display:inline-flex;
  align-items:center;
  gap:0.35rem;
  font-size:0.8rem;
  padding:0.2rem 0.45rem;
  border-radius:999px;
  border:1px solid var(--line);
  cursor:pointer;
  user-select:none;
}
.campaign-book-chip input{accent-color:var(--accent)}
.aspire-field-inline{display:flex;flex-wrap:wrap;align-items:center;gap:0.5rem;margin-bottom:0.75rem}
.aspire-field-inline label{margin:0}
.aspire-card-nested{margin-top:1rem;padding:0.85rem;border-style:dashed}
.admin-campaign-board{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(min(100%,17rem),1fr));
  gap:0.75rem;
  margin:0.75rem 0 1rem;
}
.admin-campaign-box{
  display:flex;
  flex-direction:column;
  gap:0.5rem;
  padding:0.75rem;
  border:1px solid var(--line);
  border-radius:12px;
  background:var(--panel);
  min-height:8rem;
}
.admin-campaign-box.is-drop-target{
  border-color:var(--accent);
  box-shadow:0 0 0 2px rgba(200,16,46,.25);
}
.admin-campaign-box-head{display:flex;flex-wrap:wrap;align-items:flex-start;gap:0.35rem 0.5rem}
.admin-campaign-title-wrap{flex:1 1 8rem;min-width:0}
.admin-campaign-title-input{
  width:100%;
  font-size:1rem;
  font-weight:700;
  padding:0.15rem 0.35rem;
  border:1px solid transparent;
  border-radius:8px;
  background:transparent;
  color:var(--ink);
}
.admin-campaign-title-input:not(:disabled):hover{border-color:var(--line)}
.admin-campaign-title-input:not(:disabled):focus{border-color:var(--accent);outline:none}
.admin-campaign-title-input:disabled{opacity:1;cursor:default}
.admin-campaign-box-meta{margin:0;flex:1 1 100%}
.admin-campaign-settings-btn{margin-left:auto}
.admin-campaign-settings-menu{
  z-index:40;
  display:flex;
  flex-direction:column;
  gap:0.25rem;
  padding:0.5rem;
  min-width:12rem;
  max-width:min(20rem,calc(100vw - 1rem));
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--panel);
  box-shadow:0 8px 24px rgba(0,0,0,.18);
}
.admin-campaign-settings-item{justify-content:flex-start;width:100%}
.admin-campaign-drop{
  display:flex;
  flex-wrap:wrap;
  gap:0.5rem;
  align-content:flex-start;
  min-height:5.5rem;
  padding:0.35rem;
  border-radius:10px;
  border:1px dashed var(--line);
}
.admin-campaign-empty{margin:0.35rem;font-size:0.85rem;width:100%}
.admin-char-tile{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:0.25rem;
  width:5.5rem;
  padding:0.35rem;
  border-radius:10px;
  border:1px solid var(--line);
  background:var(--bg);
  touch-action:none;
  cursor:grab;
}
.admin-char-tile:focus{outline:2px solid var(--accent);outline-offset:2px}
.admin-char-tile.is-dragging{opacity:0.55;cursor:grabbing}
body.admin-campaign-dragging .admin-char-tile{cursor:grabbing}
.admin-char-portrait{
  width:3.25rem;
  height:3.25rem;
  border-radius:8px;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--panel);
  border:1px solid var(--line);
}
.admin-char-portrait-img{width:100%;height:100%;object-fit:cover;display:block}
.admin-char-portrait-fallback{color:var(--muted)}
.admin-char-name{
  font-size:0.72rem;
  line-height:1.25;
  text-align:center;
  word-break:break-word;
  max-width:100%;
}
.admin-char-move-label{width:100%;margin:0}
.admin-char-move-select{
  width:100%;
  font-size:0.68rem;
  max-width:100%;
  margin-top:0.15rem;
}
.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}
.admin-campaign-row{align-items:flex-start}
.admin-campaign-actions{display:flex;flex-wrap:wrap;gap:0.35rem;margin-left:auto}
.campaign-assign-select{max-width:100%;min-width:10rem}