html.sp-light{color-scheme:light}html.sp-light body{background:#eef3f7!important;color:#17212b!important}html.sp-light .sp-top,html.sp-light header.sp-top,html.sp-light header.top{background:#f8fafc!important;border-bottom-color:#cbd6df!important}html.sp-light .sp-nav a,html.sp-light header nav a{color:#536577!important}html.sp-light .sp-nav a:hover,html.sp-light header nav a:hover{color:#17212b!important;background:#e7edf3!important}html.sp-light .sp-account,html.sp-light .login{background:#f7f9fb!important;color:#273746!important;border-color:#c6d2dc!important}html.sp-light .panel,html.sp-light .card,html.sp-light .section,html.sp-light .build-card,html.sp-light .stat,html.sp-light .info-card,html.sp-light .stat-card,html.sp-light .jutsu-row,html.sp-light .chip,html.sp-light .attr,html.sp-light .weapon-box{background:#f8fafc!important;border-color:#cbd7e2!important;color:#17212b!important}html.sp-light h1,html.sp-light h2,html.sp-light h3{color:#17212b!important}html.sp-light p,html.sp-light .muted,html.sp-light .description,html.sp-light .desc,html.sp-light .meta,html.sp-light .label{color:#5d7082!important}html.sp-light input,html.sp-light select,html.sp-light textarea{background:#fff!important;color:#17212b!important;border-color:#bdcbd8!important}.sp-pref-wrap{position:relative;display:flex;align-items:center;gap:6px;margin-left:4px;flex:none}.sp-pref-slot{position:relative}.sp-pref-button{height:38px;min-width:40px;padding:0 10px;border:1px solid #263b50;border-radius:9px;background:#0c151f;color:#dbe7f2;cursor:pointer;font:800 12px/1 inherit;display:inline-flex;align-items:center;justify-content:center}.sp-pref-button:hover,.sp-pref-button.active{border-color:#ff6a00}.sp-pref-popover{position:absolute;right:0;top:46px;width:230px;padding:10px;background:#0d1721;border:1px solid #263b50;border-radius:12px;box-shadow:0 18px 45px #0008;z-index:99999;display:none}.sp-pref-popover.open{display:block}.sp-pref-title{padding:7px 8px;color:#e9f0f6;font-size:10px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.sp-pref-option{width:100%;display:flex;justify-content:space-between;padding:9px 10px;border:0;border-radius:8px;background:transparent;color:#dce7ef;cursor:pointer;font:700 12px/1.2 inherit;text-align:left}.sp-pref-option:hover{background:#132231}.sp-pref-option.selected{background:#ff6a0017;color:#fff}.sp-pref-option .check{color:#ff6a00;font-weight:900}

/* ================================================================
   LIGHT THEME — ALL OTHER PAGES
   Complements the Index fix. No HTML/JS/layout changes.
   ================================================================ */
html.sp-light {
  --sp-bg:#eef3f7;
  --sp-surface:#f8fafc;
  --sp-surface-2:#ffffff;
  --sp-border:#cbd7e2;
  --sp-text:#172533;
  --sp-muted:#5c7184;
  --sp-soft:#edf3f7;
  --sp-dark-panel:#f4f7fa;
}

/* Global page containers */
html.sp-light .sp-main,
html.sp-light .sp-page,
html.sp-light .page,
html.sp-light main {
  color:var(--sp-text)!important;
}

/* Headers / hero blocks used outside index */
html.sp-light .hero,
html.sp-light .hero-card,
html.sp-light .build-hero,
html.sp-light .profile-hero,
html.sp-light .hero-main,
html.sp-light .build-view-card {
  background:#f8fafc!important;
  color:var(--sp-text)!important;
  border-color:var(--sp-border)!important;
  box-shadow:0 8px 24px rgba(31,55,73,.05)!important;
}
html.sp-light .hero h1,
html.sp-light .hero h2,
html.sp-light .hero h3,
html.sp-light .hero-title,
html.sp-light .profile-name,
html.sp-light .build-hero .title,
html.sp-light .build-hero .name {
  color:var(--sp-text)!important;
}
html.sp-light .hero p,
html.sp-light .hero-desc,
html.sp-light .hero-meta,
html.sp-light .hero .muted,
html.sp-light .hero-card .muted,
html.sp-light .profile-hero .muted {
  color:var(--sp-muted)!important;
}

/* Cards, panels and sections */
html.sp-light .panel,
html.sp-light .card,
html.sp-light .section,
html.sp-light .panel-body,
html.sp-light .panel-head,
html.sp-light .info-card,
html.sp-light .summary-stack,
html.sp-light .column,
html.sp-light .cards,
html.sp-light .card.section,
html.sp-light .card.summary,
html.sp-light .account-card,
html.sp-light .sp-page-card,
html.sp-light .tech-panel,
html.sp-light .combat,
html.sp-light .combat-layout,
html.sp-light .character-picker {
  background:#f8fafc!important;
  color:var(--sp-text)!important;
  border-color:var(--sp-border)!important;
}

/* Every common heading/text class that previously inherited white */
html.sp-light .title,
html.sp-light .name,
html.sp-light .char-name,
html.sp-light .section-title,
html.sp-light .panel-title,
html.sp-light .summary-title,
html.sp-light .character-picker-title,
html.sp-light .mastery-name,
html.sp-light .weapon-name,
html.sp-light .jutsu-name,
html.sp-light .listing-name,
html.sp-light .listing-header-title,
html.sp-light .account-lead,
html.sp-light .subtitle,
html.sp-light .intro,
html.sp-light .tech-name,
html.sp-light .stat strong,
html.sp-light .statbox strong,
html.sp-light .value,
html.sp-light .val {
  color:var(--sp-text)!important;
}

html.sp-light .muted,
html.sp-light .desc,
html.sp-light .description,
html.sp-light .hint,
html.sp-light .meta,
html.sp-light .label,
html.sp-light .subtitle,
html.sp-light .section-note,
html.sp-light .panel-sub,
html.sp-light .character-picker-sub,
html.sp-light .combat-foot,
html.sp-light .account-lead {
  color:var(--sp-muted)!important;
}

/* Eyebrows remain orange */
html.sp-light .eyebrow,
html.sp-light .sp-eyebrow,
html.sp-light .hero-category,
html.sp-light .listing-category,
html.sp-light .home-item-category {
  color:#e85d00!important;
}

/* Toolbar / filters */
html.sp-light .toolbar,
html.sp-light .filters,
html.sp-light .compare-selects,
html.sp-light .controls,
html.sp-light .savebar,
html.sp-light .form,
html.sp-light .form-actions {
  color:var(--sp-text)!important;
}
html.sp-light .field input,
html.sp-light .field select,
html.sp-light .field textarea,
html.sp-light .search,
html.sp-light .select,
html.sp-light .selectbox,
html.sp-light .compare-selects select,
html.sp-light .controls select,
html.sp-light .character-picker-control select {
  background:#fff!important;
  color:#172533!important;
  border-color:#bdccd8!important;
}
html.sp-light .field label,
html.sp-light .field .label,
html.sp-light .field small {
  color:#53697b!important;
}

/* Buttons on all pages */
html.sp-light .btn:not(.primary):not(.danger):not(.success),
html.sp-light button:not(.sp-pref-button):not(.sp-pref-option):not(.primary):not(.danger):not(.success) {
  background:#f8fafc!important;
  color:#243746!important;
  border-color:#bdccd8!important;
}
html.sp-light .btn:not(.primary):not(.danger):not(.success):hover,
html.sp-light button:not(.sp-pref-button):not(.sp-pref-option):not(.primary):not(.danger):not(.success):hover {
  background:#fff!important;
  color:#172533!important;
  border-color:#ff8a45!important;
}
html.sp-light .btn.primary,
html.sp-light button.primary,
html.sp-light .btn.success,
html.sp-light button.success {
  color:#fff!important;
  background:#ff6a00!important;
  border-color:#ff6a00!important;
}
html.sp-light .btn.danger,
html.sp-light button.danger {
  color:#b42332!important;
  background:#fff7f8!important;
  border-color:#e3aab1!important;
}

/* BUILD COMMUNITY / RANKING */
html.sp-light .community-ranking,
html.sp-light .community-ranking-head,
html.sp-light .community-ranking-grid,
html.sp-light .community-rank-card,
html.sp-light .community-rank-empty {
  color:var(--sp-text)!important;
}
html.sp-light .community-rank-card {
  background:#f8fafc!important;
  border-color:var(--sp-border)!important;
  box-shadow:0 7px 20px rgba(31,55,73,.05)!important;
}
html.sp-light .community-rank-name,
html.sp-light .community-rank-pos,
html.sp-light .community-ranking-title {
  color:var(--sp-text)!important;
}
html.sp-light .community-rank-meta,
html.sp-light .community-ranking-sub,
html.sp-light .community-rank-votes {
  color:var(--sp-muted)!important;
}
html.sp-light .build-rating-count,
html.sp-light .build-rating-value {
  color:#53697b!important;
}

/* BUILD BUILDER */
html.sp-light .attribute-budget,
html.sp-light .weapon-filter-wrap,
html.sp-light .weapon-results,
html.sp-light .weapon-select,
html.sp-light .result-list,
html.sp-light .result-row,
html.sp-light .tech-calc,
html.sp-light .tech-result,
html.sp-light .tech-formula,
html.sp-light .slot,
html.sp-light .jutsu,
html.sp-light .note,
html.sp-light .notice {
  color:var(--sp-text)!important;
  border-color:var(--sp-border)!important;
}
html.sp-light .jutsu,
html.sp-light .result-row,
html.sp-light .slot,
html.sp-light .tech-calc,
html.sp-light .tech-result,
html.sp-light .tech-formula {
  background:#f8fafc!important;
}
html.sp-light .jutsu .muted,
html.sp-light .result-row .muted,
html.sp-light .tech-formula,
html.sp-light .note,
html.sp-light .notice {
  color:var(--sp-muted)!important;
}
html.sp-light .tech-damage,
html.sp-light .tech-result strong,
html.sp-light .result-row .orange,
html.sp-light .orange {
  color:#e85d00!important;
}
html.sp-light .blue,
html.sp-light .tech-result .blue {
  color:#2670a8!important;
}
html.sp-light .red {
  color:#b42332!important;
}
html.sp-light .check,
html.sp-light .ok {
  color:#16824f!important;
}
html.sp-light .weapon-filter {
  background:#fff!important;
  color:#30485b!important;
  border-color:#c5d2dd!important;
}
html.sp-light .weapon-filter.active {
  background:#fff1e8!important;
  color:#172533!important;
  border-color:#ff8a45!important;
}

/* BUILD VIEW */
html.sp-light .identity-grid,
html.sp-light .attribute-list,
html.sp-light .combat-grid,
html.sp-light .ring-group,
html.sp-light .ring-list,
html.sp-light .jutsu-list,
html.sp-light .weapon-box,
html.sp-light .stat-card,
html.sp-light .attr {
  color:var(--sp-text)!important;
}
html.sp-light .stat-card,
html.sp-light .attr,
html.sp-light .weapon-box,
html.sp-light .jutsu-row,
html.sp-light .ring-group {
  background:#f8fafc!important;
  border-color:var(--sp-border)!important;
}
html.sp-light .jutsu-main,
html.sp-light .jutsu-name,
html.sp-light .weapon-name,
html.sp-light .ring-title,
html.sp-light .stat-card .value,
html.sp-light .attr .value {
  color:var(--sp-text)!important;
}
html.sp-light .jutsu-damage {
  color:#e85d00!important;
}
html.sp-light .jutsu-damage .label,
html.sp-light .weapon-label,
html.sp-light .panel-sub,
html.sp-light .hero-meta {
  color:var(--sp-muted)!important;
}

/* PROFILE */
html.sp-light .combat-item,
html.sp-light .combat-main-row,
html.sp-light .combat-weapons-row,
html.sp-light .row,
html.sp-light .mastery1,
html.sp-light .mastery2,
html.sp-light .buff,
html.sp-light .tech,
html.sp-light .character-picker-info {
  background:#f8fafc!important;
  color:var(--sp-text)!important;
  border-color:var(--sp-border)!important;
}
html.sp-light .combat-item .label,
html.sp-light .combat-item .muted,
html.sp-light .buff-state,
html.sp-light .tech-level {
  color:var(--sp-muted)!important;
}
html.sp-light .combat-item .value,
html.sp-light .combat-item .value.attack,
html.sp-light .combat-item .value.chakra,
html.sp-light .combat-item .value.hp,
html.sp-light .buff-name,
html.sp-light .tech-name,
html.sp-light .mastery-name {
  color:var(--sp-text)!important;
}
html.sp-light .tech.learned,
html.sp-light .buff.active {
  background:#ecfaf3!important;
  border-color:#8bd2ae!important;
}
html.sp-light .tag,
html.sp-light .tag.blue,
html.sp-light .tag.green,
html.sp-light .tag.purple {
  color:#30485b!important;
  background:#eef3f7!important;
  border-color:#cbd7e2!important;
}

/* COMPARE */
html.sp-light .compare,
html.sp-light .compare .left,
html.sp-light .compare .right,
html.sp-light .compare .col,
html.sp-light .compare .col.center,
html.sp-light .side-stats,
html.sp-light .summary-detail,
html.sp-light .metric,
html.sp-light .side-row {
  color:var(--sp-text)!important;
}
html.sp-light .compare .col,
html.sp-light .compare .col.center,
html.sp-light .metric,
html.sp-light .side-row,
html.sp-light .summary-detail {
  background:#f8fafc!important;
  border-color:var(--sp-border)!important;
}
html.sp-light .compare .row,
html.sp-light .compare-row,
html.sp-light .metric .row {
  background:#ffffff!important;
  color:var(--sp-text)!important;
  border-color:#d4dee6!important;
}
html.sp-light .char-name,
html.sp-light .summary-winner,
html.sp-light .summary-title,
html.sp-light .side-title {
  color:var(--sp-text)!important;
}
html.sp-light .char-meta,
html.sp-light .compare-label,
html.sp-light .muted {
  color:var(--sp-muted)!important;
}
html.sp-light .winner,
html.sp-light .val.winner {
  color:#16824f!important;
}

/* MARKET / MY MARKET */
html.sp-light .listing-card,
html.sp-light .listing-header,
html.sp-light .listing-main,
html.sp-light .listing-info,
html.sp-light .listing-footer,
html.sp-light .listing-price-box,
html.sp-light .listing-description,
html.sp-light .listing-contact,
html.sp-light .item-results,
html.sp-light .selected-item,
html.sp-light .item-option,
html.sp-light .modal.card {
  background:#f8fafc!important;
  color:var(--sp-text)!important;
  border-color:var(--sp-border)!important;
}
html.sp-light .listing-header-title,
html.sp-light .listing-name,
html.sp-light .listing-price,
html.sp-light .listing-description-title,
html.sp-light .listing-seller {
  color:var(--sp-text)!important;
}
html.sp-light .listing-subtitle,
html.sp-light .listing-price-label,
html.sp-light .listing-price-sub,
html.sp-light .listing-seller-label,
html.sp-light .listing-created,
html.sp-light .listing-description-text,
html.sp-light .item-meta {
  color:var(--sp-muted)!important;
}
html.sp-light .listing-price {
  color:#e85d00!important;
}
html.sp-light .listing-badge,
html.sp-light .meta-pill,
html.sp-light .listing-category {
  color:#30485b!important;
  background:#eef3f7!important;
  border-color:#cbd7e2!important;
}
html.sp-light .listing-badge.active {
  color:#11734a!important;
  background:#ecfaf3!important;
  border-color:#8bd2ae!important;
}
html.sp-light .notice {
  background:#f5f8fa!important;
  color:#43596b!important;
}

/* ACCOUNT / HELP / ADMIN */
html.sp-light .account-card,
html.sp-light .staff-card,
html.sp-light .table,
html.sp-light .wrap,
html.sp-light .tabpage,
html.sp-light .help-card,
html.sp-light .grid .card {
  background:#f8fafc!important;
  color:var(--sp-text)!important;
  border-color:var(--sp-border)!important;
}
html.sp-light .staff-card .name,
html.sp-light .staff-card .role,
html.sp-light .table th,
html.sp-light .table td,
html.sp-light .tab,
html.sp-light .account-card h1,
html.sp-light .account-card h2,
html.sp-light .account-card h3 {
  color:var(--sp-text)!important;
}
html.sp-light .table th,
html.sp-light .table td {
  border-color:#d3dee6!important;
}
html.sp-light .table thead,
html.sp-light .table tr:nth-child(even) {
  background:#f2f6f9!important;
}
html.sp-light .tab.active {
  background:#fff1e8!important;
  color:#172533!important;
  border-color:#ff8a45!important;
}
html.sp-light .status,
html.sp-light .role {
  color:#53697b!important;
}

/* Keep preference popover intentionally dark in light mode */
html.sp-light .sp-pref-popover{
  background:#0d1721!important;
  color:#dce7ef!important;
  border-color:#263b50!important;
}
html.sp-light .sp-pref-title{color:#e9f0f6!important}
html.sp-light .sp-pref-option{color:#dce7ef!important}
html.sp-light .sp-pref-option:hover{background:#132231!important}
html.sp-light .sp-pref-option.selected{color:#fff!important}


/* ============================================================
   SHINOBI PROFILE — LIGHT THEME COLOR PACK
   Versão colorida — preserva o modo escuro.
   Somente quando html.sp-light está ativo.
   ============================================================ */

html.sp-light{
  --sp-bg:#edf5fb;
  --sp-surface:#f8fbfe;
  --sp-surface-2:#ffffff;
  --sp-border:#bfd4e5;
  --sp-text:#172d43;
  --sp-muted:#58728a;
  --sp-orange:#ff6a00;
  --sp-orange-soft:#fff0e5;
  --sp-blue:#2f8fd6;
  --sp-blue-soft:#e8f4ff;
  --sp-green:#17a66a;
  --sp-green-soft:#e8f9f1;
  --sp-purple:#7857c9;
  --sp-purple-soft:#f0ebff;
  --sp-gold:#c98a00;
  --sp-gold-soft:#fff5d8;
}

/* Fundo com identidade azul */
html.sp-light body{
  background:
    radial-gradient(850px 500px at 88% -5%,rgba(47,143,214,.14),transparent 62%),
    radial-gradient(750px 500px at 5% 45%,rgba(255,106,0,.07),transparent 65%),
    linear-gradient(180deg,#eef6fc 0%,#e8f2f9 100%) !important;
  color:var(--sp-text)!important;
}

/* Header */
html.sp-light .sp-top,
html.sp-light header.sp-top,
html.sp-light header.top{
  background:rgba(250,253,255,.96)!important;
  border-bottom-color:#bfd4e5!important;
  box-shadow:0 4px 20px rgba(35,76,108,.08)!important;
}

/* Navegação */
html.sp-light .sp-nav a,
html.sp-light header nav a{
  color:#3d5b73!important;
}
html.sp-light .sp-nav a:hover,
html.sp-light header nav a:hover{
  color:#17324a!important;
  background:linear-gradient(135deg,#eaf5ff,#fff3e9)!important;
}
html.sp-light .sp-nav a.active{
  color:#17324a!important;
  background:linear-gradient(135deg,#fff1e6,#e9f5ff)!important;
  border-color:#ffb27a!important;
  box-shadow:inset 0 -2px #ff6a00,0 4px 12px rgba(255,106,0,.09)!important;
}

/* Conta */
html.sp-light .sp-account,
html.sp-light .login{
  background:linear-gradient(135deg,#fff,#edf6fc)!important;
  color:#17324a!important;
  border-color:#bfd4e5!important;
}

/* Cards gerais: não mais branco puro */
html.sp-light .panel,
html.sp-light .card,
html.sp-light .section,
html.sp-light .build-card,
html.sp-light .stat,
html.sp-light .info-card,
html.sp-light .stat-card,
html.sp-light .jutsu-row,
html.sp-light .chip,
html.sp-light .attr,
html.sp-light .weapon-box{
  background:linear-gradient(145deg,#ffffff 0%,#f3f8fc 100%)!important;
  border-color:#bfd4e5!important;
  color:var(--sp-text)!important;
  box-shadow:0 8px 24px rgba(31,73,105,.055)!important;
}

/* Títulos */
html.sp-light h1,
html.sp-light h2,
html.sp-light h3,
html.sp-light .title,
html.sp-light .name,
html.sp-light .char-name{
  color:#17324a!important;
}

/* Texto */
html.sp-light p,
html.sp-light .muted,
html.sp-light .description,
html.sp-light .desc,
html.sp-light .meta,
html.sp-light .label{
  color:#58728a!important;
}

/* Eyebrows / categorias */
html.sp-light .eyebrow,
html.sp-light .sp-eyebrow,
html.sp-light .hero-category,
html.sp-light .listing-category,
html.sp-light .home-item-category{
  color:#e85d00!important;
}

/* Inputs */
html.sp-light input,
html.sp-light select,
html.sp-light textarea{
  background:#fff!important;
  color:#17324a!important;
  border-color:#b9cfdf!important;
  box-shadow:inset 0 1px 2px rgba(35,76,108,.035)!important;
}
html.sp-light input:focus,
html.sp-light select:focus,
html.sp-light textarea:focus{
  border-color:#5ba9df!important;
  box-shadow:0 0 0 3px rgba(47,143,214,.12)!important;
}

/* Botão primário */
html.sp-light .btn.primary,
html.sp-light button.primary,
html.sp-light .btn.success,
html.sp-light button.success{
  background:linear-gradient(135deg,#ff7a18,#ff5a00)!important;
  border-color:#ff6a00!important;
  color:#fff!important;
  box-shadow:0 5px 14px rgba(255,106,0,.18)!important;
}

/* Botões secundários */
html.sp-light .btn:not(.primary):not(.danger):not(.success),
html.sp-light button:not(.sp-pref-button):not(.sp-pref-option):not(.primary):not(.danger):not(.success){
  background:linear-gradient(135deg,#ffffff,#edf6fc)!important;
  color:#29475e!important;
  border-color:#b9cfdf!important;
}
html.sp-light .btn:not(.primary):not(.danger):not(.success):hover,
html.sp-light button:not(.sp-pref-button):not(.sp-pref-option):not(.primary):not(.danger):not(.success):hover{
  background:linear-gradient(135deg,#fff7f1,#edf7ff)!important;
  border-color:#ff9852!important;
}

/* Chips / tags */
html.sp-light .chip,
html.sp-light .tag,
html.sp-light .meta-pill,
html.sp-light .listing-badge{
  background:linear-gradient(135deg,#edf6fc,#f7fbfe)!important;
  color:#34566f!important;
  border-color:#bfd4e5!important;
}
html.sp-light .tag.blue{
  background:var(--sp-blue-soft)!important;
  color:#2475b2!important;
  border-color:#9ecff0!important;
}
html.sp-light .tag.green,
html.sp-light .listing-badge.active{
  background:var(--sp-green-soft)!important;
  color:#128052!important;
  border-color:#8bd7b3!important;
}
html.sp-light .tag.purple{
  background:var(--sp-purple-soft)!important;
  color:#6247aa!important;
  border-color:#c5b5ee!important;
}

/* Raridade */
html.sp-light .rarity,
html.sp-light .meta-pill.rarity{
  background:var(--sp-gold-soft)!important;
  color:#9a6700!important;
  border-color:#e5bd5e!important;
}

/* Linhas / separadores */
html.sp-light hr,
html.sp-light .divider,
html.sp-light .home-divider,
html.sp-light .listing-divider{
  border-color:#cbdce8!important;
  background:#cbdce8!important;
}

/* Footer */
html.sp-light .footer{
  background:rgba(248,252,255,.96)!important;
  color:#607b91!important;
  border-top-color:#bfd4e5!important;
}