/* === SOURCE: css/000-anonymous.css === */

:root{
  --bg:#0d0d0f; --panel:#161618; --panel2:#1b1b1e; --panel3:#202024;
  --text:#f0f0ee; --muted:#929299; --line:#303035;
  --gold:#d0ad58; --gold2:#f0d48d; --danger:#e67a70; --ok:#c9d7a3;
  --high:#e49a90; --medium:#e0b35e; --low:#a8c0a2; --discount:#d3db8c;
  --radius:16px; --shadow:0 16px 44px rgba(0,0,0,.24); --card-pad:16px;
  --space-card:12px;
  --radius-card:16px;
  --radius-control:10px;
  --pad-card-x:16px;
  --fs-section:16px;
  --fs-label:15px;
  --fs-control:16px;
  --fs-secondary:11px;
  --fs-summary:24px;
  --slider-track:5px;
  --slider-thumb:18px;
  font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","PingFang SC","Segoe UI","Microsoft YaHei",Arial,sans-serif;
}
*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;color:var(--text);background:linear-gradient(180deg,#0a0a0c,#101012 48%,#0c0c0e);min-height:100vh}
button,input,select{font:inherit}
.level-value,.level-bottom strong,.ap-total .big,.ap-stat .v,.special-cost,.attr-ap,.stepper input,.category-cost,.mobile-summary-item .v,.mobile-apitem .v{font-variant-numeric:tabular-nums lining-nums}
button{cursor:pointer}
.shell{
  width:100%;
  max-width:none;
  margin:0;
  padding:24px clamp(20px,1.5vw,32px) 76px
}
.topbar{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:20px}
.eyebrow{font-size:11px;letter-spacing:.18em;color:var(--gold);font-weight:700;margin-bottom:7px}
h1{font-size:clamp(28px,3.5vw,46px);line-height:1;margin:0;letter-spacing:-.035em}
.subtitle{margin-top:9px;color:var(--muted);font-size:13px}
.version{font-size:11px;color:#77777e;border:1px solid var(--line);border-radius:999px;padding:7px 10px;white-space:nowrap}

.workspace{
  display:grid;
  grid-template-columns:clamp(300px,18vw,330px) minmax(0,1fr);
  gap:18px;
  align-items:start
}
.sidebar{position:sticky;top:14px;display:grid;gap:var(--space-card)}
.panel,.category-card,.toolbar{background:rgba(22,22,24,.95);border:1px solid var(--line);border-radius:var(--radius-card);box-shadow:var(--shadow)}
.panel{padding:var(--pad-card-x)}
.label{display:block;font-size:var(--fs-label);color:#c7c7cc;font-weight:600;margin-bottom:7px;line-height:1.25}
select{width:100%;height:42px;border:1px solid #38383d;background:#111113;color:var(--text);border-radius:var(--radius-control);padding:0 12px;outline:none}
select:focus{border-color:var(--gold)}
.model-meta{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-top:10px}
.position-pill{font-size:var(--fs-secondary);font-weight:600;background:#29261d;color:#dbc785;border:1px solid #4a4025;border-radius:999px;padding:5px 8px}

.level-row{display:grid;grid-template-columns:52px 1fr;gap:10px;align-items:center}
.level-value{height:40px;display:flex;align-items:center;justify-content:center;border:1px solid #4d4328;background:#1b1811;color:var(--gold2);border-radius:var(--radius-control);font-weight:700;font-size:var(--fs-control);font-variant-numeric:tabular-nums}
input[type="range"]{width:100%;accent-color:var(--gold)}
.level-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:7px;color:var(--muted);font-size:10px}
.level-bottom strong{color:#ddd;font-size:13px}

.status-panel{padding:0;overflow:hidden}
.status-level{
  display:grid;
  grid-template-columns:64px 56px minmax(80px,1fr) 62px;
  gap:9px;
  align-items:center;
  padding:14px 15px;
  border-bottom:1px solid var(--line)
}
.status-level .label{margin:0}
.status-level-ap{
  color:#ddd;
  font-size:var(--fs-control);
  text-align:right;
  white-space:nowrap;
  font-variant-numeric:tabular-nums
}

.status-stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  grid-template-areas:
    "a b c"
    "bar bar bar";
  background:#141416
}
.status-stat{padding:12px 12px 10px;min-width:0}
.status-stat:nth-child(1){grid-area:a}
.status-stat:nth-child(2){grid-area:b}
.status-stat:nth-child(3){grid-area:c}
.status-stat+.status-stat{border-left:1px solid var(--line)}
.status-stat .k{font-size:var(--fs-secondary);color:var(--muted);font-weight:600;white-space:nowrap}
.status-stat .v{font-size:22px;line-height:1.05;margin-top:5px;font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.status-stat .u{font-size:var(--fs-secondary);color:#777}
.status-stat.remaining .v{color:var(--ok)}
.status-stat.remaining.negative .v{color:var(--danger)}
.status-progress{
  grid-area:bar;
  padding:0 12px 12px;
  border-top:1px solid rgba(255,255,255,.03)
}
.status-progress-rail{
  height:8px;
  border-radius:999px;
  background:#252529;
  overflow:hidden;
  display:flex
}
.status-progress-used{
  width:0%;
  background:linear-gradient(90deg,#d8b25b,#f0d48d)
}
.status-progress-remaining{
  width:100%;
  background:linear-gradient(90deg,#98b87b,#c9d7a3)
}
.status-progress.over .status-progress-rail{
  box-shadow:0 0 0 1px rgba(230,122,112,.35) inset
}


.ap-panel{padding:0;overflow:hidden}
.ap-total{padding:16px;background:linear-gradient(180deg,#1b1913,#151411);border-bottom:1px solid #3d351f}
.ap-total .small{font-size:10px;color:#9b8c61;font-weight:800}
.ap-total .big{font-size:32px;line-height:1;margin-top:5px;font-weight:800;color:var(--gold2);font-variant-numeric:tabular-nums}
.ap-total .big span{font-size:11px;color:#81734f;margin-left:4px}
.ap-stats{display:grid;grid-template-columns:1fr 1fr}
.ap-stat{padding:13px 15px}
.ap-stat+.ap-stat{border-left:1px solid var(--line)}
.ap-stat .k{font-size:10px;color:var(--muted);font-weight:800}
.ap-stat .v{font-size:23px;margin-top:4px;font-weight:800;font-variant-numeric:tabular-nums}
.ap-stat.remaining .v{color:var(--ok)}
.ap-stat.remaining.negative .v{color:var(--danger)}
.ap-stat .u{font-size:10px;color:#777;margin-left:3px}

.special-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px}
.special-title strong{font-size:13px}
.special-title span{font-size:10px;color:var(--muted)}
.special-row{padding:10px 0;border-top:1px solid #29292e}
.special-row:first-of-type{border-top:0}
.special-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.special-name{font-size:var(--fs-label);font-weight:600}
.special-cost{font-size:var(--fs-control);color:#d7bc76;font-weight:700}
.star-buttons{display:flex;gap:5px;margin-top:8px;flex-wrap:wrap}
.star-buttons button{height:30px;min-width:42px;padding:0 8px;border:1px solid #35353a;background:#1b1b1e;color:#85858d;border-radius:var(--radius-control);font-size:11px;font-weight:700}
.star-buttons button.base-star{cursor:pointer;background:#242117;color:#b9aa7e;border-color:#4b432d;opacity:1}
.star-buttons button.base-star.current-base{box-shadow:inset 0 0 0 1px #8e7742}
.star-buttons button.added-star{border-color:#8e7742;background:#302916;color:#f0d48d}
.star-buttons button.available-star{color:#8d8d94}
.star-buttons button.cap-disabled:disabled{cursor:not-allowed;background:#141416;color:#48484e;border-color:#29292d;opacity:.5}
.range-note{font-size:9px;color:#696970;margin-top:6px}
.reset-btn{height:40px;width:100%;border:1px solid var(--line);border-radius:var(--radius-control);background:#1a1a1d;color:#cfcfd2;font-size:12px;font-weight:700}
.reset-btn:hover{border-color:#4a4a50;background:#202023}

.main{min-width:0}


/* 属性区辅助设置：紧凑双卡片 */
.attribute-tools{
  margin-bottom:var(--space-card);
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px
}
.view-switch-row,
.cost-help{
  background:rgba(22,22,24,.95);
  border:1px solid var(--line);
  border-radius:var(--radius-card);
  box-shadow:var(--shadow);
  overflow:hidden
}
.view-switch-row{
  min-height:56px;
  padding:0 var(--pad-card-x);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px
}
.tool-title{
  min-width:0;
  font-size:13px;
  font-weight:600;
  color:#e5e5e8;
  line-height:1;
  white-space:nowrap
}
.tool-copy{min-width:0}
.tool-sub{display:none}


/* Apple 风格开关；启用色改为网站金色 */
.ios-switch{
  position:relative;
  flex:0 0 auto;
  width:44px;
  height:26px;
  cursor:pointer
}
.ios-switch input{
  position:absolute;
  opacity:0;
  width:1px;
  height:1px;
  pointer-events:none
}
.switch-track{
  position:absolute;
  inset:0;
  border-radius:999px;
  background:#3a3a3f;
  border:1px solid #46464c;
  transition:background .18s ease,border-color .18s ease
}
.switch-thumb{
  position:absolute;
  top:2px;
  left:2px;
  width:20px;
  height:20px;
  border-radius:50%;
  background:#f4f4f5;
  box-shadow:0 1px 3px rgba(0,0,0,.35);
  transition:transform .18s ease
}
.ios-switch input:checked + .switch-track{
  background:#9b7b32;
  border-color:#b18f3f
}
.ios-switch input:checked + .switch-track .switch-thumb{
  transform:translateX(18px)
}
.ios-switch input:focus-visible + .switch-track{
  outline:2px solid rgba(208,173,88,.45);
  outline-offset:2px
}


.cost-help summary{
  list-style:none;
  min-height:56px;
  padding:0 var(--pad-card-x);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  cursor:pointer;
  color:#e5e5e8;
  font-size:13px;
  font-weight:600
}

.cost-help summary::-webkit-details-marker{display:none}
.cost-help-chevron{
  color:#73737a;
  font-size:18px;
  line-height:1;
  transform:rotate(0deg);
  transition:transform .16s ease
}
.cost-help[open] .cost-help-chevron{transform:rotate(90deg)}
.cost-help-body{
  padding:0 var(--pad-card-x) 14px;
  color:#86868d
}
.cost-legend{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
  padding-top:2px
}
.cost-legend-item{
  min-width:0;
  padding:8px 9px;
  border:1px solid #2c2c31;
  border-radius:10px;
  background:#141416
}
.cost-legend-name{
  display:flex;
  align-items:center;
  gap:6px;
  color:#c9c9ce;
  font-size:11px;
  font-weight:600
}
.cost-dot{
  width:6px;
  height:6px;
  border-radius:50%;
  flex:0 0 auto
}
.cost-dot.high{background:var(--high)}
.cost-dot.medium{background:var(--medium)}
.cost-dot.low{background:var(--low)}
.cost-dot.discount{background:var(--discount)}
.cost-legend-desc{
  margin-top:4px;
  color:#6f6f76;
  font-size:9px;
  line-height:1.35
}
.cost-help-note{
  margin-top:9px;
  font-size:9px;
  line-height:1.45;
  color:#696970
}

.attr-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-card);align-items:start}
.attr-column{display:flex;flex-direction:column;gap:var(--space-card);min-width:0}
.category-card{overflow:hidden;box-shadow:none}
.category-head{height:42px;display:flex;align-items:center;justify-content:space-between;padding:0 var(--pad-card-x);border-bottom:1px solid var(--line);background:#1d1d20}
.category-name{font-size:var(--fs-section);font-weight:600;letter-spacing:0}
.category-cost{font-size:14px;color:#cbb474;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:.01em}
.attr-list{padding:2px 0}
.attr-row{border-bottom:1px solid #28282d}
.attr-row:last-child{border-bottom:0}
.attr-row.hidden{display:none}
.attr-main{display:grid;grid-template-columns:148px minmax(120px,1fr) 98px;gap:10px;align-items:center;padding:8px var(--pad-card-x);min-height:50px}
.attr-row.changed .attr-main{background:linear-gradient(90deg,rgba(208,173,88,.055),transparent 55%)}
.attr-name-wrap{min-width:0;width:148px}
.attr-line{display:flex;align-items:center;gap:5px;min-width:0;white-space:nowrap}
.attr-name{font-size:var(--fs-label);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tier{display:inline-flex;align-items:center;gap:4px;height:16px;padding:0;font-size:var(--fs-secondary);font-weight:500;color:#77777e;background:transparent;border:0;opacity:.72;flex:0 0 auto}
.tier::before{content:"";width:5px;height:5px;border-radius:50%;background:#77777e;opacity:.72}
.tier.high::before{background:var(--high)}
.tier.medium::before{background:var(--medium)}
.tier.low::before{background:var(--low)}
.tier.discount::before{background:var(--discount)}
.stepper{display:grid;grid-template-columns:28px 42px 28px;height:32px;border:1px solid #37373c;border-radius:var(--radius-control);overflow:hidden;background:#111113}
.stepper button{border:0;background:#1d1d20;color:#bcbcc2;font-weight:800;padding:0}
.stepper button:hover{background:#29292d;color:#fff}
.stepper input{width:42px;border:0;background:#111113;color:#eee;text-align:center;font-size:var(--fs-control);font-weight:700;outline:none;appearance:textfield}
.stepper input::-webkit-inner-spin-button,.stepper input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.attr-ap{display:none}
.attr-row.changed .attr-ap{color:#efd48e}
.attr-ap span{display:block;font-size:8px;color:#68686e;margin-top:1px}
.mini-slider{display:grid;grid-template-columns:24px minmax(0,1fr) 24px;gap:6px;align-items:center;min-width:0}
.mini-slider input[type="range"]{width:100%;margin:0;accent-color:#8f7a45}
.mini-slider .endpoint{font-size:9px;color:#6a6a71;font-variant-numeric:tabular-nums;text-align:center}

/* 属性滑杆：固定显示到99；金色=已购买，浅色=当前AP还能购买，灰色=暂不可购买，深灰=模型硬上限之后 */
.mini-slider input[type="range"]{
  -webkit-appearance:none;
  appearance:none;
  height:var(--slider-track);
  border-radius:999px;
  outline:none;
  background:#303036;
}
.mini-slider input[type="range"]::-webkit-slider-runnable-track{
  height:var(--slider-track);
  border-radius:999px;
  background:transparent;
}
.mini-slider input[type="range"]::-moz-range-track{
  height:var(--slider-track);
  border-radius:999px;
  background:transparent;
}
.mini-slider input[type="range"]::-webkit-slider-thumb{
  -webkit-appearance:none;
  appearance:none;
  width:var(--slider-thumb);
  height:var(--slider-thumb);
  border-radius:50%;
  border:1.5px solid #d8ba6b;
  background:#c5a24f;
  margin-top:calc((var(--slider-track) - var(--slider-thumb))/2);
  box-shadow:none;
}
.mini-slider input[type="range"]::-moz-range-thumb{
  width:var(--slider-thumb);
  height:var(--slider-thumb);
  border-radius:50%;
  border:1.5px solid #d8ba6b;
  background:#c5a24f;
  box-shadow:none;
}
.mini-slider input[type="range"]:focus-visible::-webkit-slider-thumb{
  box-shadow:0 0 0 4px rgba(208,173,88,.22)
}
.stepper button:disabled{cursor:not-allowed;color:#55555b;background:#171719}


/* 统一人物等级与属性滑杆 */
#levelSlider{
  -webkit-appearance:none;
  appearance:none;
  height:var(--slider-track);
  border-radius:999px;
  outline:none;
  background:linear-gradient(to right,#d4ae54 0%,#d4ae54 100%);
}
#levelSlider::-webkit-slider-runnable-track{
  height:var(--slider-track);
  border-radius:999px;
  background:transparent;
}
#levelSlider::-moz-range-track{
  height:var(--slider-track);
  border-radius:999px;
  background:transparent;
}
#levelSlider::-webkit-slider-thumb{
  -webkit-appearance:none;
  appearance:none;
  width:var(--slider-thumb);
  height:var(--slider-thumb);
  border-radius:50%;
  border:1.5px solid #d8ba6b;
  background:#c5a24f;
  margin-top:calc((var(--slider-track) - var(--slider-thumb))/2);
  box-shadow:none;
}
#levelSlider::-moz-range-thumb{
  width:var(--slider-thumb);
  height:var(--slider-thumb);
  border-radius:50%;
  border:1.5px solid #d8ba6b;
  background:#c5a24f;
  box-shadow:none;
}
#levelSlider:focus-visible::-webkit-slider-thumb{
  box-shadow:0 0 0 4px rgba(208,173,88,.18)
}

.empty{display:none;border:1px dashed #333338;border-radius:14px;padding:28px;text-align:center;color:var(--muted);font-size:12px}

.mobile-apbar{display:none}
.footer{margin-top:22px;padding-top:15px;border-top:1px solid #252529;color:#696970;font-size:10px;line-height:1.65}
.footer strong{color:#8f8f96}


.mobile-compact-summary{display:none}
.mobile-filter-toggle{display:none}
.mobile-filter-panel{display:contents}
.category-toggle{display:none}


@media(min-width:1600px){
  .workspace{gap:20px}
  .attr-columns{gap:16px}
  .attr-column{gap:16px}
}

@media(max-width:1060px){
  .workspace{grid-template-columns:260px minmax(0,1fr)}
  .attr-columns{grid-template-columns:1fr}
}
@media(max-width:760px){
  :root{
    --m-fs-primary:15px;
    --m-fs-control:16px;
    --m-fs-secondary:11px;
    --m-fs-tiny:10px;
    --m-fs-summary:24px;
    --m-card-gap:12px;
    --m-card-pad:16px;
  }

  .shell{padding:12px 10px 112px}
  .topbar{display:none}
  .workspace{display:block}

  /* ===== Mobile top control stack ===== */
  .sidebar{
    position:static;
    display:grid;
    grid-template-columns:1fr;
    gap:var(--m-card-gap);
    margin-bottom:var(--m-card-gap)
  }
  .panel{padding:10px var(--m-card-pad);border-radius:var(--radius-card)}
  .label{
    margin:0;
    font-size:var(--m-fs-primary);
    line-height:1;
    font-weight:700;
    color:#c5c5ca;
    white-space:nowrap
  }

  /* 手机端顶部控制顺序：人物等级优先，原型选择第二 */
  .status-panel{order:1}
  .model-panel{order:2}
  .special-panel{order:3}
  .reset-panel{order:4}

  /* 原型：严格一行，仅“原型 + 下拉框” */
  .model-panel{
    display:grid;
    grid-template-columns:64px minmax(0,1fr);
    gap:10px;
    align-items:center
  }
  .model-panel .label{grid-column:auto}
  .model-panel select{
    height:38px;
    font-size:var(--m-fs-control);
    padding:0 10px;
    min-width:0
  }
  .model-meta{display:none}

  /* 人物等级：人物等级 | Lv40 | slider | 962 AP */
  .status-panel{padding:0}
  .status-level{
    grid-template-columns:64px 62px minmax(64px,1fr) 60px;
    gap:8px;
    padding:10px var(--m-card-pad);
    border-bottom:0
  }
  .status-level .label{grid-column:auto}
  .level-value{
    width:62px;
    height:36px;
    border-radius:var(--radius-control);
    font-size:var(--fs-control)
  }
  .status-level input[type="range"]{
    min-width:0;
    width:100%
  }
  .status-level-ap{
    font-size:var(--fs-control);
    line-height:1;
    white-space:nowrap;
    text-align:right
  }
  .status-stats{display:none}

  
  /* 移动端紧凑摘要：三数值 + 细进度条 */
  .mobile-compact-summary{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    grid-template-areas:
      "a b c"
      "bar bar bar";
    gap:1px;
    margin-bottom:var(--m-card-gap);
    border:1px solid #3c3523;
    border-radius:var(--radius-card);
    overflow:hidden;
    background:#2f281a
  }
  .mobile-summary-item{padding:8px var(--m-card-pad);background:#171611}
  .mobile-summary-item:nth-child(1){grid-area:a}
  .mobile-summary-item:nth-child(2){grid-area:b}
  .mobile-summary-item:nth-child(3){grid-area:c}
  .mobile-summary-item .k{
    font-size:var(--m-fs-tiny);
    color:#8c8060;
    font-weight:800
  }
  .mobile-summary-item .v{
    font-size:22px;
    font-weight:800;
    margin-top:2px;
    color:#e8e8e6;
    font-variant-numeric:tabular-nums
  }
  .mobile-summary-item.remaining .v{color:var(--ok)}
  .mobile-summary-item.remaining.negative .v{color:var(--danger)}
  .mobile-summary-progress{
    grid-area:bar;
    background:#171611;
    padding:0 var(--m-card-pad) 10px
  }
  .mobile-summary-rail{
    height:7px;
    border-radius:999px;
    background:#252529;
    overflow:hidden;
    display:flex
  }
  .mobile-summary-used{
    width:0%;
    background:linear-gradient(90deg,#d8b25b,#f0d48d)
  }
  .mobile-summary-remaining{
    width:100%;
    background:linear-gradient(90deg,#98b87b,#c9d7a3)
  }
  .mobile-compact-summary.over .mobile-summary-rail{
    box-shadow:0 0 0 1px rgba(230,122,112,.35) inset
  }


  /* 花式/逆足：无总标题，每项严格为“名称 | 五星 | AP” */
  .special-panel{padding:7px var(--m-card-pad)}
  .special-title{display:none}
  .special-row{
    display:grid;
    grid-template-columns:68px minmax(0,1fr) 52px;
    grid-template-areas:"name stars cost";
    align-items:center;
    gap:7px;
    padding:7px 0;
    border-top:0 !important
  }
  .special-row + .special-row{
    border-top:1px solid #29292e !important
  }
  .special-head{display:contents}
  .special-name{
    grid-area:name;
    font-size:var(--fs-label);
    font-weight:600;
    white-space:nowrap
  }
  .special-cost{
    grid-area:cost;
    text-align:right;
    font-size:var(--fs-control);
    font-weight:700;
    white-space:nowrap
  }
  .star-buttons{
    grid-area:stars;
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:3px;
    margin:0;
    min-width:0
  }
  .star-buttons button{
    width:100%;
    height:28px;
    min-width:0;
    padding:0 2px;
    font-size:var(--m-fs-secondary);
    font-weight:700
  }
  .range-note{display:none}
  .reset-panel{display:none}

  
  /* ===== Mobile attribute tools ===== */
  .attribute-tools{
    margin-bottom:var(--m-card-gap);
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px
  }
  .view-switch-row{
    min-height:52px;
    padding:0 var(--m-card-pad)
  }
  .tool-title{font-size:13px}
  .cost-help summary{
    min-height:52px;
    padding:0 var(--m-card-pad);
    font-size:13px
  }
  .cost-help-body{padding:0 var(--m-card-pad) 14px}
  .cost-legend{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:7px
  }
  .cost-legend-item{padding:8px 9px}
  .cost-legend-name{font-size:11px}
  .cost-legend-desc{font-size:9px}


  /* ===== Attribute categories ===== */
  .attr-columns{grid-template-columns:1fr;gap:var(--m-card-gap)}
  .attr-column{gap:var(--m-card-gap)}
  .category-card{border-radius:var(--radius-card)}
  .category-head{
    min-height:40px;
    height:auto;
    padding:0 var(--m-card-pad);
    cursor:pointer;
    background:#202024
  }
  .category-toggle{
    display:inline-flex;
    margin-left:6px;
    color:#6f6f76;
    font-size:var(--m-fs-secondary)
  }
  .category-card.collapsed .attr-list{display:none}
  .category-card.collapsed .category-toggle{transform:rotate(-90deg)}
  .category-name{
    display:flex;
    align-items:center;
    font-size:var(--fs-section);
    font-weight:600
  }
  .category-cost{
    font-size:14px;
    color:#cbb474;
    font-weight:700
  }

  /* 属性：真正单行布局 */
  .attr-main{
    display:grid;
    grid-template-columns:118px minmax(104px,1fr) 84px;
    grid-template-areas:"title control stepper";
    gap:6px;
    align-items:center;
    padding:8px var(--m-card-pad);
    min-height:52px
  }
  .attr-name-wrap{
    grid-area:title;
    min-width:0;
    width:118px
  }
  .attr-line{
    display:flex;
    align-items:center;
    gap:4px;
    min-width:0
  }
  .attr-name{
    font-size:var(--fs-label);
    line-height:1.15;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis
  }
  .tier{
    font-size:var(--m-fs-tiny);
    opacity:.50;
    white-space:nowrap
  }
  .tier::before{width:4px;height:4px}

  .mini-slider{
    grid-area:control;
    display:grid;
    grid-template-columns:20px minmax(0,1fr) 20px;
    gap:4px;
    align-items:center;
    min-width:0;
    padding-right:0
  }
  .mini-slider input[type="range"]{
    width:100%;
    min-width:0;
    margin:0;
    accent-color:#8f7a45
  }
  .mini-slider .endpoint{
    font-size:var(--m-fs-secondary);
    color:#707077;
    text-align:center
  }

  .stepper{
    grid-area:stepper;
    width:86px;
    grid-template-columns:24px 38px 24px;
    height:30px;
    justify-self:end
  }
  .stepper button{
    font-size:var(--m-fs-control);
    padding:0
  }
  .stepper input{
    width:38px;
    font-size:var(--m-fs-control)
  }

  .attr-ap{display:none}
  .attr-row{position:relative}

  /* ===== Persistent bottom AP bar ===== */
  .mobile-apbar{
    position:fixed;
    left:8px;
    right:8px;
    bottom:8px;
    z-index:30;
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) 72px;
    grid-template-areas:
      "progress progress progress"
      "used remain reset";
    gap:1px;
    background:#30291a;
    border:1px solid #695a32;
    border-radius:var(--radius-card);
    overflow:hidden;
    box-shadow:0 14px 40px rgba(0,0,0,.45)
  }
  .mobile-ap-progress{
    grid-area:progress;
    padding:8px 11px 0;
    background:#171611
  }
  .mobile-ap-rail{
    height:7px;
    border-radius:999px;
    background:#2a2a2e;
    overflow:hidden;
    display:flex
  }
  .mobile-ap-used-fill{
    width:0%;
    background:linear-gradient(90deg,#D6B94F,#F0D48D)
  }
  .mobile-ap-remain-fill{
    width:100%;
    background:linear-gradient(90deg,#8FB570,#C9D7A3)
  }
  .mobile-apbar.over .mobile-ap-rail{
    box-shadow:0 0 0 1px rgba(230,122,112,.45) inset
  }
  .mobile-apitem{
    padding:7px 11px 9px;
    background:#171611
  }
  .mobile-apitem.used{grid-area:used}
  .mobile-apitem.remaining{grid-area:remain;border-left:1px solid #4a4026}
  .mobile-apitem .k{font-size:var(--m-fs-tiny);color:#8f815e;font-weight:800}
  .mobile-apitem .v{
    font-size:22px;
    font-weight:800;
    color:#f0d48d;
    font-variant-numeric:tabular-nums;
    margin-top:2px;
    white-space:nowrap
  }
  .mobile-apitem.remaining .v{color:var(--ok)}
  .mobile-apitem.remaining.negative .v{color:var(--danger)}
  .mobile-reset-btn{
    grid-area:reset;
    border:0;
    border-left:1px solid #4a4026;
    background:#1b1a16;
    color:#aaa39a;
    font-size:11px;
    font-weight:700;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:2px;
    padding:0
  }
  .mobile-reset-btn .reset-icon{
    font-size:18px;
    line-height:1;
    color:#d4bd83
  }
  .mobile-reset-btn:active{
    background:#27241b;
    color:#e1d4b4
  }

  .footer{font-size:var(--m-fs-tiny);margin-top:14px;padding-top:10px}
}
@media(max-width:430px){
  .shell{padding-left:8px;padding-right:8px}
  .model-panel{grid-template-columns:60px minmax(0,1fr);gap:8px}
  .status-level{
    grid-template-columns:60px 58px minmax(54px,1fr) 56px;
    gap:6px
  }
  .level-value{width:58px}
  .special-row{
    grid-template-columns:64px minmax(0,1fr) 48px;
    gap:5px
  }
  .star-buttons{gap:2px}
  .star-buttons button{font-size:9px;padding:0 1px}

  .attr-main{
    grid-template-columns:112px minmax(92px,1fr) 80px;
    gap:5px;
    padding:7px 8px
  }
  .mini-slider{
    grid-template-columns:19px minmax(0,1fr) 19px;
    gap:3px
  }
  .stepper{
    width:82px;
    grid-template-columns:23px 36px 23px
  }
  .stepper input{width:36px}
}
@media(max-width:380px){
  .attr-main{
    grid-template-columns:104px minmax(82px,1fr) 76px;
    gap:4px;
    padding:7px 7px
  }
  .attr-name{font-size:11px;white-space:nowrap}
  .tier{font-size:8px}
  .mini-slider{
    grid-template-columns:18px minmax(0,1fr) 18px;
    gap:2px
  }
  .mini-slider .endpoint{font-size:9px}
  .stepper{
    width:78px;
    grid-template-columns:22px 34px 22px
  }
  .stepper input{width:34px}
}

/* === SOURCE: css/001-v29-slider-overrides.css === */

:root{
  --slider-track:7px;
  --slider-thumb:18px;
  --slider-touch:44px;
  /* iOS / Apple-system inspired colors */
  --fc-gold:#D6B94F;
  --fc-orange:#E79A32;
  --fc-green:#55C98B;
  --track-affordable:#D8D8DC;
  --track-unavailable:#5B5B63;
  --track-beyond:#2C2C32;
  --track-gap:1px;
}

/* Attribute and level sliders share the same geometry and touch target. */
.range-shell,
.level-range-shell{
  position:relative;
  display:flex;
  align-items:center;
  min-width:0;
  height:var(--slider-touch);
}
.level-range-shell{width:100%;}

/* ProClubsHQ-like pill construction: the base is a dark rounded rail; each
   semantic segment is its own rounded pill. */
.visual-track,
.level-visual-track{
  position:absolute;
  left:0;
  right:0;
  top:50%;
  height:var(--slider-track);
  transform:translateY(-50%);
  border-radius:999px;
  background:var(--track-beyond);
  pointer-events:none;
  overflow:visible;
}
.track-seg,
.level-filled{
  position:absolute;
  top:0;
  bottom:0;
  border-radius:999px;
  transition:left .08s linear,width .08s linear,background-color .10s ease;
}
.track-seg.purchased{background:var(--active-color,var(--fc-gold))}
.track-seg.affordable{background:var(--track-affordable)}
.track-seg.unavailable{background:var(--track-unavailable)}
.track-seg.beyond-cap{display:none}
.level-filled{left:0;background:#C9A34E}

/* Native range is the invisible 44px interaction layer. */
.mini-slider input[type="range"],
#levelSlider{
  -webkit-appearance:none;
  appearance:none;
  width:100%;
  height:var(--slider-touch) !important;
  margin:0;
  padding:0;
  cursor:pointer;
  touch-action:pan-y;
  -webkit-tap-highlight-color:transparent;
  user-select:none;
  background:transparent !important;
  position:relative;
  z-index:2;
}
.mini-slider input[type="range"]::-webkit-slider-runnable-track,
#levelSlider::-webkit-slider-runnable-track{
  height:var(--slider-track);
  border-radius:999px;
  background:transparent;
}
.mini-slider input[type="range"]::-moz-range-track,
#levelSlider::-moz-range-track{
  height:var(--slider-track);
  border-radius:999px;
  background:transparent;
}

/* ProClubsHQ-like thumb: white center, only the ring follows the attribute color. */
.mini-slider input[type="range"]::-webkit-slider-thumb,
#levelSlider::-webkit-slider-thumb{
  -webkit-appearance:none;
  appearance:none;
  width:var(--slider-thumb);
  height:var(--slider-thumb);
  border-radius:50%;
  border:1.5px solid transparent;
  background:#F5F5F7;
  margin-top:calc((var(--slider-track) - var(--slider-thumb))/2);
  box-shadow:0 1px 2px rgba(0,0,0,.20);
  opacity:0;
  transition:opacity .12s ease,border-color .12s ease;
}
.mini-slider input[type="range"]::-moz-range-thumb,
#levelSlider::-moz-range-thumb{
  width:var(--slider-thumb);
  height:var(--slider-thumb);
  border-radius:50%;
  border:1.5px solid transparent;
  background:#F5F5F7;
  box-shadow:0 1px 2px rgba(0,0,0,.20);
  opacity:0;
  transition:opacity .12s ease,border-color .12s ease;
}
.mini-slider input[type="range"].is-interacting::-webkit-slider-thumb,
#levelSlider.is-interacting::-webkit-slider-thumb,
.mini-slider input[type="range"]:focus-visible::-webkit-slider-thumb,
#levelSlider:focus-visible::-webkit-slider-thumb{
  opacity:1;
  border-color:var(--thumb-stroke,#C9A34E);
}
.mini-slider input[type="range"].is-interacting::-moz-range-thumb,
#levelSlider.is-interacting::-moz-range-thumb,
.mini-slider input[type="range"]:focus-visible::-moz-range-thumb,
#levelSlider:focus-visible::-moz-range-thumb{
  opacity:1;
  border-color:var(--thumb-stroke,#C9A34E);
}
@media (hover:hover) and (pointer:fine){
  .mini-slider input[type="range"]:hover::-webkit-slider-thumb,
  #levelSlider:hover::-webkit-slider-thumb{
    opacity:1;
    border-color:var(--thumb-stroke,#C9A34E);
  }
  .mini-slider input[type="range"]:hover::-moz-range-thumb,
  #levelSlider:hover::-moz-range-thumb{
    opacity:1;
    border-color:var(--thumb-stroke,#C9A34E);
  }
}

.mini-slider{min-height:var(--slider-touch)}
@media(max-width:760px){
  .attr-main{min-height:56px}
  .mini-slider{height:var(--slider-touch)}
  .range-shell,.level-range-shell{height:var(--slider-touch)}
  .status-level{min-height:56px}
}

/* === SOURCE: css/002-v30-dark-glass.css === */

:root{
  --bg:#06090e;
  --panel:rgba(17,23,31,.64);
  --panel2:rgba(23,29,38,.70);
  --panel3:rgba(30,37,47,.72);
  --text:#f4f5f7;
  --muted:#9aa1aa;
  --line:rgba(255,255,255,.075);
  --gold:#d5b666;
  --gold2:#e7cd88;
  --danger:#e78178;
  --ok:#a9c987;

  --glass-bg:rgba(15,21,29,.60);
  --glass-bg-strong:rgba(18,24,33,.74);
  --glass-head:rgba(255,255,255,.032);
  --glass-border:rgba(255,255,255,.085);
  --glass-highlight:rgba(255,255,255,.045);
  --glass-shadow:0 18px 50px rgba(0,0,0,.26);
  --glass-blur:18px;

  --radius-card:20px;
  --radius-control:12px;
  --space-card:14px;
  --pad-card-x:18px;
}

/* Cinematic FC background: no image assets, only restrained light/atmosphere. */
html{
  background:#05080d;
}
body{
  position:relative;
  isolation:isolate;
  color:var(--text);
  background:
    radial-gradient(72vw 54vh at 76% 2%, rgba(46,76,105,.16), transparent 66%),
    radial-gradient(52vw 38vh at 18% 34%, rgba(28,50,72,.10), transparent 72%),
    linear-gradient(180deg,#0a111a 0%,#070b11 46%,#05070b 100%);
  min-height:100vh;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  opacity:.58;
  background:
    linear-gradient(90deg,
      transparent 0%,
      rgba(89,117,144,.025) 12%,
      transparent 22%,
      rgba(89,117,144,.035) 36%,
      transparent 48%,
      rgba(89,117,144,.022) 64%,
      transparent 78%,
      rgba(89,117,144,.03) 90%,
      transparent 100%);
  filter:blur(10px);
}
body::after{
  content:"";
  position:fixed;
  inset:-10%;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(ellipse at center, transparent 30%, rgba(0,0,0,.18) 68%, rgba(0,0,0,.50) 100%);
}
.shell{position:relative;z-index:1}

/* Header stays open and quiet rather than becoming another glass box. */
.topbar{
  align-items:center;
  margin-bottom:18px;
  padding:4px 4px 18px;
  border-bottom:1px solid rgba(255,255,255,.055)
}
.eyebrow{
  color:#bca56c;
  letter-spacing:.20em;
  font-size:10px;
  font-weight:700
}
h1{
  font-size:clamp(30px,2.6vw,40px);
  letter-spacing:-.04em;
  color:#f7f8fa
}
.subtitle{
  color:#7f8995;
  font-size:12px
}
.version{
  color:#84909d;
  background:rgba(255,255,255,.025);
  border-color:rgba(255,255,255,.07);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px)
}

/* PC: one integrated glass control slab on the left. */
.workspace{
  grid-template-columns:clamp(324px,19vw,360px) minmax(0,1fr);
  gap:20px
}
.sidebar{
  top:18px;
  gap:0;
  padding:18px;
  border:1px solid var(--glass-border);
  border-radius:24px;
  background:
    linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.012) 38%,transparent 72%),
    var(--glass-bg);
  box-shadow:var(--glass-shadow);
  backdrop-filter:blur(var(--glass-blur)) saturate(118%);
  -webkit-backdrop-filter:blur(var(--glass-blur)) saturate(118%)
}
.build-control-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:2px 2px 14px;
  border-bottom:1px solid rgba(255,255,255,.06);
  margin-bottom:2px
}
.build-control-eyebrow{
  font-size:11px;
  letter-spacing:.16em;
  color:#d7c18a;
  font-weight:700
}
.build-control-note{
  color:#68727e;
  font-size:10px
}

/* Child panels become sections of one glass slab rather than separate boxes. */
.sidebar > .panel{
  padding:16px 2px;
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none
}
.sidebar > .model-panel,
.sidebar > .status-panel{
  border-bottom:1px solid rgba(255,255,255,.055)
}
.sidebar .reset-panel{
  padding:14px 2px 2px
}
.label{
  color:#b7bec8;
  font-size:13px;
  font-weight:600
}
select{
  height:46px;
  color:#f1f3f6;
  background:rgba(255,255,255,.035);
  border-color:rgba(255,255,255,.085);
  border-radius:12px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)
}
select:hover{border-color:rgba(255,255,255,.13)}
select:focus{
  border-color:rgba(213,182,102,.62);
  box-shadow:0 0 0 3px rgba(213,182,102,.09)
}
.position-pill{
  color:#bfae7e;
  background:rgba(213,182,102,.075);
  border-color:rgba(213,182,102,.16)
}

/* Level and AP become one quieter tool module. */
.status-level{
  padding:2px 0 14px;
  border-bottom:1px solid rgba(255,255,255,.045)
}
.level-value{
  background:rgba(213,182,102,.07);
  border-color:rgba(213,182,102,.20);
  color:#e7cc84
}
.status-level-ap{color:#d8dde3}
.status-stats{
  margin-top:12px;
  background:transparent;
  border:1px solid rgba(255,255,255,.055);
  border-radius:14px;
  overflow:hidden
}
.status-stat{
  padding:10px 10px 8px;
  background:rgba(255,255,255,.018)
}
.status-stat+.status-stat{border-left-color:rgba(255,255,255,.05)}
.status-stat .k{
  color:#7f8994;
  font-size:10px
}
.status-stat .v{
  font-size:20px;
  color:#eef1f4
}
.status-progress{
  padding:0 10px 10px;
  border-top:0;
  background:rgba(255,255,255,.018)
}
.status-progress-rail{
  height:6px;
  background:#252c35
}
.status-progress-used{
  background:linear-gradient(90deg,#c4a451,#e0c57c)
}
.status-progress-remaining{
  background:linear-gradient(90deg,#71955f,#9fbe80)
}

/* Star controls: flatter, lighter, system-like. */
.special-title{margin-bottom:6px}
.special-title strong{
  color:#cfd5dc;
  font-size:12px
}
.special-title span{color:#6d7782}
.special-row{
  padding:11px 0;
  border-color:rgba(255,255,255,.045)
}
.special-name{font-size:14px}
.special-cost{color:#cbb474;font-size:14px}
.star-buttons{gap:4px;margin-top:7px}
.star-buttons button{
  height:28px;
  min-width:38px;
  border-color:rgba(255,255,255,.065);
  background:rgba(255,255,255,.025);
  color:#7e8792;
  border-radius:10px
}
.star-buttons button.base-star{
  background:rgba(213,182,102,.055);
  color:#a99564;
  border-color:rgba(213,182,102,.11)
}
.star-buttons button.base-star.current-base{
  box-shadow:inset 0 0 0 1px rgba(213,182,102,.35)
}
.star-buttons button.added-star{
  border-color:rgba(213,182,102,.34);
  background:rgba(213,182,102,.10);
  color:#e4ca84
}
.star-buttons button.available-star{color:#89929d}
.range-note{color:#5f6974}

.reset-btn{
  height:38px;
  color:#9da6b0;
  border-color:rgba(255,255,255,.065);
  background:rgba(255,255,255,.025)
}
.reset-btn:hover{
  color:#e0e5ea;
  border-color:rgba(255,255,255,.13);
  background:rgba(255,255,255,.045)
}

/* Main auxiliary controls are light glass chips. */
.attribute-tools{
  gap:12px;
  margin-bottom:14px
}
.view-switch-row,
.cost-help{
  background:
    linear-gradient(145deg,rgba(255,255,255,.034),rgba(255,255,255,.012)),
    rgba(17,23,31,.48);
  border-color:rgba(255,255,255,.075);
  border-radius:16px;
  box-shadow:0 12px 30px rgba(0,0,0,.15);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px)
}
.tool-title,
.cost-help summary{
  color:#cbd2da
}
.switch-track{
  background:#333a44;
  border-color:#454d58
}
.ios-switch input:checked + .switch-track{
  background:#8b7436;
  border-color:#aa8e45
}

/* Attribute cards carry the main glass material. */
.category-card{
  border:1px solid var(--glass-border);
  border-radius:20px;
  background:
    linear-gradient(145deg,rgba(255,255,255,.032),transparent 42%),
    rgba(15,21,29,.57);
  box-shadow:0 14px 36px rgba(0,0,0,.18);
  backdrop-filter:blur(16px) saturate(112%);
  -webkit-backdrop-filter:blur(16px) saturate(112%);
  overflow:hidden
}
.category-head{
  height:48px;
  padding:0 18px;
  background:rgba(255,255,255,.028);
  border-bottom-color:rgba(255,255,255,.055)
}
.category-name{
  color:#edf0f3;
  font-size:16px;
  font-weight:600
}
.category-cost{
  color:#cdb77a;
  font-size:14px;
  font-weight:700
}
.attr-list{padding:0}
.attr-row{
  border-bottom-color:rgba(255,255,255,.045)
}
.attr-row.changed .attr-main{
  background:linear-gradient(90deg,rgba(213,182,102,.032),transparent 54%)
}
.attr-main{
  min-height:60px;
  padding:8px 18px
}
.attr-name{color:#eef1f4}
.tier{
  opacity:.52;
  color:#78818c
}
.stepper{
  height:34px;
  border-color:rgba(255,255,255,.07);
  background:rgba(9,13,18,.42);
  border-radius:11px
}
.stepper button{
  color:#a4adb7;
  background:rgba(255,255,255,.025)
}
.stepper button:hover{
  color:#fff;
  background:rgba(255,255,255,.055)
}
.stepper input{
  background:rgba(5,9,14,.34);
  color:#f5f6f8
}

/* Cost explanation uses the same quiet glass language. */
.cost-help-body{color:#868f9a}
.cost-legend-item{
  background:rgba(255,255,255,.022);
  border-color:rgba(255,255,255,.055)
}
.cost-legend-name{color:#c7ced6}
.cost-legend-desc,.cost-help-note{color:#69737e}

/* Footer disappears into the background instead of looking like another section. */
.footer{
  border-top-color:rgba(255,255,255,.045);
  color:#59636e
}
.footer strong{color:#77818c}

/* Subtle hover feedback only on precise pointers. */
@media (hover:hover) and (pointer:fine){
  .category-card{
    transition:border-color .18s ease,background-color .18s ease,transform .18s ease
  }
  .category-card:hover{
    border-color:rgba(255,255,255,.105)
  }
}

/* Large desktop gets a little more breathing room without stretching controls excessively. */
@media(min-width:1700px){
  .shell{padding-left:30px;padding-right:30px}
  .workspace{grid-template-columns:350px minmax(0,1fr);gap:22px}
  .attr-columns{gap:18px}
  .attr-column{gap:18px}
}

/* Mobile: keep proven layout/interaction, apply the same material language. */
@media(max-width:760px){
  body{
    background:
      radial-gradient(120vw 52vh at 78% 0%,rgba(45,75,103,.14),transparent 68%),
      linear-gradient(180deg,#09111a 0%,#070b11 46%,#05070b 100%)
  }
  body::before{opacity:.35}

  .sidebar{
    position:static;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
    gap:var(--m-card-gap)
  }
  .build-control-heading{display:none}

  .sidebar > .panel,
  .mobile-compact-summary,
  .category-card{
    background:
      linear-gradient(145deg,rgba(255,255,255,.035),transparent 46%),
      rgba(15,21,29,.64);
    border:1px solid rgba(255,255,255,.075);
    border-radius:18px;
    box-shadow:0 12px 30px rgba(0,0,0,.18);
    backdrop-filter:blur(14px) saturate(110%);
    -webkit-backdrop-filter:blur(14px) saturate(110%)
  }
  .sidebar > .panel{
    padding:10px var(--m-card-pad);
  }
  .sidebar > .model-panel,
  .sidebar > .status-panel{
    border-bottom:1px solid rgba(255,255,255,.075)
  }
  .status-panel{padding:0 !important}
  .status-level{
    padding:10px var(--m-card-pad);
    border-bottom:0
  }
  .status-stats{display:none}

  .mobile-compact-summary{
    border-color:rgba(255,255,255,.07);
    background:rgba(15,21,29,.64)
  }
  .mobile-summary-item,
  .mobile-summary-progress{
    background:transparent
  }
  .mobile-summary-item .k{color:#7f8994}
  .mobile-summary-item .v{color:#eef1f4}

  .attribute-tools{gap:8px}
  .view-switch-row,.cost-help{
    background:rgba(15,21,29,.58);
    border-color:rgba(255,255,255,.07);
    box-shadow:0 10px 24px rgba(0,0,0,.14)
  }

  .category-head{
    min-height:44px;
    padding:0 var(--m-card-pad);
    background:rgba(255,255,255,.03)
  }
  .attr-main{
    min-height:58px;
    padding:8px var(--m-card-pad)
  }

  /* Floating glass dock at the bottom. */
  .mobile-apbar{
    left:10px;
    right:10px;
    bottom:10px;
    border-color:rgba(255,255,255,.09);
    background:rgba(12,18,25,.72);
    box-shadow:0 18px 44px rgba(0,0,0,.36);
    backdrop-filter:blur(22px) saturate(120%);
    -webkit-backdrop-filter:blur(22px) saturate(120%)
  }
  .mobile-ap-progress,
  .mobile-apitem{
    background:transparent
  }
  .mobile-apitem.remaining{
    border-left-color:rgba(255,255,255,.055)
  }
  .mobile-reset-btn{
    background:rgba(255,255,255,.02);
    border-left-color:rgba(255,255,255,.055);
    color:#a4adb7
  }
  .mobile-reset-btn .reset-icon{color:#cdb77a}
}

/* Narrow phones: keep labels readable, avoid over-glass styling. */
@media(max-width:430px){
  .attribute-tools{gap:7px}
  .view-switch-row,.cost-help{border-radius:16px}
  .tool-title,.cost-help summary{font-size:12px}
}

/* === SOURCE: css/003-darkglass-v304-targeted-tuning.css === */

/* =========================================================
   1. 原型下拉框
   - 金色边框常驻
   - 打开/聚焦时边框略增强
   - 下拉选项改为与 DarkGlass 和谐的深色底
   ========================================================= */
#modelSelect{
  color-scheme:dark;
  background:#111113;
  color:#F0F0EE;
  border:1px solid rgba(208,173,88,.72);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.025),
    0 0 0 1px rgba(208,173,88,.055),
    0 0 14px rgba(208,173,88,.045);
  transition:
    border-color .16s ease,
    box-shadow .16s ease,
    background-color .16s ease;
}

#modelSelect:hover{
  border-color:rgba(224,190,102,.82);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.03),
    0 0 0 1px rgba(208,173,88,.075),
    0 0 16px rgba(208,173,88,.055);
}

#modelSelect:focus,
#modelSelect:focus-visible{
  outline:none;
  background:#131315;
  border-color:rgba(240,212,141,.95);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 0 0 1px rgba(208,173,88,.20),
    0 0 0 3px rgba(208,173,88,.075),
    0 0 20px rgba(208,173,88,.09);
}

/* Chrome / Edge / Firefox 的原生选项菜单 */
#modelSelect option,
#modelSelect optgroup{
  background:#141416;
  color:#F0F0EE;
}

#modelSelect optgroup{
  color:#D0AD58;
  font-weight:700;
}

/* 某些桌面浏览器会采用选中项背景 */
#modelSelect option:checked{
  background:#262218;
  color:#F0D48D;
}

/* =========================================================
   2. 重置模型
   - 金边常驻
   - 平时完全静止
   - 仅鼠标移入时出现 NeoGlass 式扫光
   ========================================================= */
#resetBtn{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border:1px solid rgba(208,173,88,.72);
  background:
    linear-gradient(180deg,rgba(29,29,32,.97),rgba(23,23,26,.97));
  color:#E7E5DF;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.03),
    0 0 0 1px rgba(208,173,88,.045),
    0 0 13px rgba(208,173,88,.035);
  transition:
    border-color .18s ease,
    background-color .18s ease,
    box-shadow .20s ease,
    transform .18s ease,
    color .18s ease;
}

/* 平时不显示动态层 */
#resetBtn::before{
  content:"";
  position:absolute;
  z-index:0;
  top:-125%;
  left:-42%;
  width:34%;
  height:350%;
  transform:rotate(17deg);
  background:linear-gradient(
    90deg,
    transparent 0%,
    rgba(255,246,213,.03) 25%,
    rgba(255,239,190,.24) 43%,
    rgba(191,170,255,.19) 56%,
    rgba(139,121,218,.07) 70%,
    transparent 100%
  );
  filter:blur(5px);
  opacity:0;
  pointer-events:none;
}

#resetBtn::after{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  border-radius:inherit;
  opacity:0;
  background:
    radial-gradient(
      70% 150% at 50% -15%,
      rgba(208,173,88,.075),
      transparent 60%
    );
  transition:opacity .18s ease;
  pointer-events:none;
}

#resetBtn > *{
  position:relative;
  z-index:1;
}

#resetBtn:hover{
  color:#FFFDF7;
  border-color:rgba(240,212,141,.95);
  transform:translateY(-1px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    0 0 0 1px rgba(208,173,88,.12),
    0 0 20px rgba(208,173,88,.10),
    0 0 30px rgba(115,96,185,.055);
}

#resetBtn:hover::before{
  opacity:1;
  animation:darkglass304Sweep 1.35s cubic-bezier(.22,.61,.36,1) both;
}

#resetBtn:hover::after{
  opacity:1;
}

#resetBtn:active{
  transform:translateY(0) scale(.995);
}

@keyframes darkglass304Sweep{
  from{
    left:-42%;
    opacity:0;
  }
  16%{
    opacity:.45;
  }
  48%{
    opacity:.78;
  }
  82%{
    opacity:.30;
  }
  to{
    left:112%;
    opacity:0;
  }
}

/* =========================================================
   3. 去掉原型下方“前锋 / 中场 / 后卫 / 门将”信息
   保留 DOM 供现有 JS 使用，视觉上彻底移除，避免改动功能逻辑。
   ========================================================= */
.model-meta,
#positionPill{
  display:none!important;
}

/* 删除 model-meta 后，不留下多余空白 */
.model-panel{
  padding-bottom:var(--pad-card-x);
}

/* 移动端沿用相同规则 */
@media(max-width:760px){
  #modelSelect{
    border-color:rgba(208,173,88,.70);
  }

  #resetBtn:hover{
    transform:none;
  }
}

/* 用户开启“减少动态效果”时禁用扫光 */
@media(prefers-reduced-motion:reduce){
  #resetBtn:hover::before{
    animation:none!important;
    opacity:0!important;
  }
}

/* === SOURCE: css/004-darkglass-v310-one-screen-pc.css === */

/* =========================================================
   DarkGlass v3.1.0 — PC One Screen Build
   Mobile <=760px keeps the existing v3.0.4 layout.
   ========================================================= */

@media(min-width:761px){
  /* Three attribute columns on PC */
  .attr-columns{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:12px!important;
    align-items:start;
  }
  .attr-column{
    gap:14px!important;
    min-width:0;
  }

  /* The tool block is moved by JS into column 1 on desktop.
     Stack the two tools so they compensate for the shorter column. */
  .attr-column > .attribute-tools{
    margin:0!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
  }
  .attr-column > .attribute-tools .view-switch-row,
  .attr-column > .attribute-tools .cost-help{
    min-height:54px;
    border-radius:var(--radius-card);
  }
  .attr-column > .attribute-tools .cost-help > summary{
    min-height:54px;
  }

  /* Three columns need slightly more efficient row geometry,
     but keep the same controls and interaction sizes. */
  .attr-main{
    grid-template-columns:122px minmax(96px,1fr) 88px;
    gap:8px;
    padding-left:14px;
    padding-right:14px;
  }
  .attr-name-wrap{
    width:122px;
  }
  .category-head{
    padding-left:14px;
    padding-right:14px;
  }

  /* Preserve comfortable spacing on large displays */
  @media(min-width:1600px){
    .attr-columns,
    .attr-column{
      gap:16px!important;
    }
    .attr-main{
      grid-template-columns:132px minmax(110px,1fr) 92px;
      gap:9px;
      padding-left:15px;
      padding-right:15px;
    }
    .attr-name-wrap{width:132px}
    .category-head{
      padding-left:15px;
      padding-right:15px;
    }
  }
}

/* Existing mobile layout stays one column and keeps the tool block above attributes. */
@media(max-width:760px){
  .attr-columns{
    grid-template-columns:1fr!important;
  }
}

/* === SOURCE: css/005-darkglass-v311-absolute-slider-pc.css === */

@media(min-width:761px){
  :root{
    --pc-slider-track:5px;
    --pc-slider-touch:36px;
        --pc-affordable:#858992;
    --pc-unavailable:#50535B;
    --pc-beyond:#2C2F36;
  }

  /* Remove the two repeated endpoint numbers and give the track all available width. */
  .mini-slider{
    grid-template-columns:minmax(0,1fr)!important;
    gap:0!important;
    min-height:var(--pc-slider-touch)!important;
  }
  .mini-slider .endpoint{
    display:none!important;
  }

  /* Slightly denser PC rows. */
  .attr-main{
    min-height:54px!important;
    padding-top:5px!important;
    padding-bottom:5px!important;
  }

  /* Thinner visible track, while keeping a larger invisible mouse target. */
  .mini-slider .range-shell{
    height:var(--pc-slider-touch)!important;
  }
  .mini-slider .visual-track{
    height:var(--pc-slider-track)!important;
    background:var(--pc-beyond)!important;
  }
  .mini-slider input[type="range"]{
    height:var(--pc-slider-touch)!important;
  }
  .mini-slider input[type="range"]::-webkit-slider-runnable-track{
    height:var(--pc-slider-track)!important;
  }
  .mini-slider input[type="range"]::-moz-range-track{
    height:var(--pc-slider-track)!important;
  }

  /* Unpurchased states are intentionally darker than owned <60 white. */
  .mini-slider .track-seg.affordable{
    background:var(--pc-affordable)!important;
  }
  .mini-slider .track-seg.unavailable{
    background:var(--pc-unavailable)!important;
  }

  /* Keep the interaction thumb compact and unobtrusive. */
  .mini-slider input[type="range"]::-webkit-slider-thumb{
    margin-top:calc((var(--pc-slider-track) - var(--slider-thumb))/2)!important;
  }
}

/* === SOURCE: css/006-darkglass-v312-solid-value-colors-pc.css === */

@media(min-width:761px){
  :root{
    /* restrained four-state attribute palette */
    --pc-owned-red:#B85D5A;
    --pc-owned-orange:#D18445;
    --pc-owned-yellow:#D3B84F;
    --pc-owned-green:#55B982;

    /* keep future-buy segment neutral, clearly separate from owned colors */
    --pc-affordable:#B9BBC2;
    --pc-unavailable:#555861;
    --pc-beyond:#2C2F36;
  }

  .mini-slider .track-seg.affordable{
    background:var(--pc-affordable)!important;
  }
  .mini-slider .track-seg.unavailable{
    background:var(--pc-unavailable)!important;
  }
}

/* === SOURCE: css/007-darkglass-v313-pc-microtune.css === */

@media(min-width:761px){
  /* 1) Remove category subtotal number entirely to reduce noise */
  .category-cost,
  [data-cat-cost]{
    display:none!important;
  }
  .category-head{
    justify-content:flex-start!important;
  }

  /* 2) Pull the slider slightly left and give the stepper more breathing room */
  .attr-main{
    grid-template-columns:112px minmax(0,1fr) 96px!important;
    column-gap:12px!important;
  }
  .attr-name-wrap{
    width:112px!important;
  }
  .mini-slider{
    margin-right:4px!important;
  }

  /* 3) Make plus / number / minus box more balanced */
  .stepper{
    grid-template-columns:28px 40px 28px!important;
    height:34px!important;
    min-height:34px!important;
    border-radius:17px!important;
    align-items:stretch!important;
    overflow:hidden!important;
  }
  .stepper button,
  .stepper input{
    height:34px!important;
    min-height:34px!important;
    line-height:1!important;
    margin:0!important;
    padding:0!important;
    box-sizing:border-box!important;
    vertical-align:middle!important;
  }
  .stepper button{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    font-size:18px!important;
    font-weight:700!important;
  }
  .stepper input{
    width:40px!important;
    display:block!important;
    text-align:center!important;
    font-size:17px!important;
    font-weight:700!important;
    padding-top:0!important;
    padding-bottom:0!important;
  }
}

/* === SOURCE: css/008-darkglass-v321-mobile-slider-sync.css === */

@media(max-width:760px){
  :root{
    --mobile-slider-track:5px;
  }

  /* Match PC logic: remove repeated endpoint numbers and give the rail the width. */
  .mini-slider{
    grid-template-columns:minmax(0,1fr)!important;
    gap:0!important;
    min-width:0!important;
  }
  .mini-slider .endpoint{
    display:none!important;
  }

  /* Thin visual rail, keep the existing large touch target. */
  .mini-slider .visual-track{
    height:var(--mobile-slider-track)!important;
  }
  .mini-slider input[type="range"]::-webkit-slider-runnable-track{
    height:var(--mobile-slider-track)!important;
  }
  .mini-slider input[type="range"]::-moz-range-track{
    height:var(--mobile-slider-track)!important;
  }
  .mini-slider input[type="range"]::-webkit-slider-thumb{
    margin-top:calc((var(--mobile-slider-track) - var(--slider-thumb))/2)!important;
  }

  /* Use the freed endpoint space for a longer rail.
     Keep the one-line mobile structure. */
  .attr-main{
    grid-template-columns:112px minmax(0,1fr) 84px!important;
    gap:6px!important;
  }
  .attr-name-wrap{
    width:112px!important;
  }

  /* Keep the numeric stepper symmetric and vertically centered. */
  .stepper{
    width:84px!important;
    grid-template-columns:24px 36px 24px!important;
    height:32px!important;
    min-height:32px!important;
    align-items:stretch!important;
    border-radius:16px!important;
  }
  .stepper button,
  .stepper input{
    height:32px!important;
    min-height:32px!important;
    margin:0!important;
    padding:0!important;
    line-height:1!important;
    box-sizing:border-box!important;
  }
  .stepper button{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }
  .stepper input{
    width:36px!important;
    text-align:center!important;
  }
}

@media(max-width:430px){
  .attr-main{
    grid-template-columns:106px minmax(0,1fr) 82px!important;
    gap:5px!important;
  }
  .attr-name-wrap{width:106px!important}
  .stepper{
    width:82px!important;
    grid-template-columns:23px 36px 23px!important;
  }
}

@media(max-width:380px){
  .attr-main{
    grid-template-columns:98px minmax(0,1fr) 78px!important;
    gap:4px!important;
  }
  .attr-name-wrap{width:98px!important}
  .stepper{
    width:78px!important;
    grid-template-columns:22px 34px 22px!important;
  }
  .stepper input{width:34px!important}
}

/* === SOURCE: css/009-v322-mobile-docked-summary-overrides.css === */

.mobile-summary-sentinel{display:none}
@media(max-width:760px){
  .mobile-summary-sentinel{display:block;height:1px;width:100%;margin:0;padding:0}
  .mobile-compact-summary{
    position:sticky;
    top:8px;
    z-index:28;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    grid-template-areas:
      "bar bar"
      "used remain";
    gap:1px;
    margin-bottom:10px;
    border:1px solid #5f5231;
    border-radius:20px;
    overflow:hidden;
    background:rgba(49,41,23,.94);
    box-shadow:0 10px 30px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.02);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
    transition:border-color .22s ease, box-shadow .22s ease, transform .22s ease, background .22s ease;
  }
  .mobile-compact-summary .mobile-summary-progress{
    grid-area:bar;
    background:#151410;
    padding:9px 10px 0;
    transition:padding .22s ease, background .22s ease;
  }
  .mobile-compact-summary .mobile-summary-rail{
    height:7px;
    border-radius:999px;
    background:#28282d;
    overflow:hidden;
    display:flex;
    transition:height .22s ease, box-shadow .22s ease;
  }
  .mobile-compact-summary .mobile-summary-item{
    min-height:0;
    padding:6px 12px 9px;
    background:#151410;
    transition:max-height .22s ease, padding .22s ease, opacity .18s ease, transform .22s ease, margin .22s ease, background .22s ease;
  }
  .mobile-compact-summary .mobile-summary-item.used{grid-area:used}
  .mobile-compact-summary .mobile-summary-item.remaining{grid-area:remain;border-left:1px solid #453b24}
  .mobile-compact-summary .mobile-summary-item .k{
    font-size:11px;
    line-height:1.1;
    color:#91835e;
    font-weight:800;
  }
  .mobile-compact-summary .mobile-summary-item .v{
    font-size:18px;
    line-height:1.05;
    font-weight:800;
    margin-top:2px;
    color:#f1d58a;
    white-space:nowrap;
    font-variant-numeric:tabular-nums;
  }
  .mobile-compact-summary .mobile-summary-item.remaining .v{color:var(--ok)}
  .mobile-compact-summary .mobile-summary-item.remaining.negative .v{color:var(--danger)}
  .mobile-compact-summary.over .mobile-summary-rail{box-shadow:0 0 0 1px rgba(230,122,112,.4) inset}

  /* docked / condensed state */
  .mobile-compact-summary.is-docked{
    border-color:#6a5a33;
    box-shadow:0 12px 34px rgba(0,0,0,.42), 0 0 0 1px rgba(255,255,255,.02) inset;
    background:rgba(42,35,22,.94);
  }
  .mobile-compact-summary.is-docked .mobile-summary-progress{
    padding:7px 10px;
  }
  .mobile-compact-summary.is-docked .mobile-summary-rail{
    height:8px;
  }
  .mobile-compact-summary.is-docked .mobile-summary-item{
    opacity:0;
    max-height:0;
    padding-top:0;
    padding-bottom:0;
    margin:0;
    overflow:hidden;
    pointer-events:none;
    transform:translateY(-4px);
    border-left-color:transparent;
  }
  .mobile-compact-summary.is-docked .mobile-summary-item .k,
  .mobile-compact-summary.is-docked .mobile-summary-item .v{
    display:none;
  }

  /* the old bottom duplicate bar is removed on mobile */
  .mobile-apbar{display:none!important}
}

/* === SOURCE: css/010-v324-ap-color-language.css === */

:root{
  /* AP budget language — deliberately separate from attribute red/orange/yellow/green */
  --ap-used:#8877CC;
  --ap-used-soft:#A79BE0;
  --ap-remaining:#C7CAD2;
  --ap-remaining-soft:#E0E2E7;
  --ap-track:#292C33;
  --ap-used-text:#B8ADEB;
  --ap-remaining-text:#E1E3E8;
}

/* ===== PC AP summary ===== */
.status-progress-rail{
  background:var(--ap-track)!important;
}
.status-progress-used{
  background:linear-gradient(90deg,var(--ap-used),var(--ap-used-soft))!important;
}
.status-progress-remaining{
  background:linear-gradient(90deg,#B9BDC6,var(--ap-remaining-soft))!important;
}
#usedAP{
  color:var(--ap-used-text);
}
#remainingStat:not(.negative) .v,
#remainingStat:not(.negative) #remainingAP{
  color:var(--ap-remaining-text)!important;
}

/* ===== Mobile compact / docked AP summary ===== */
@media(max-width:760px){
  .mobile-compact-summary{
    border-color:rgba(136,119,204,.30)!important;
    background:rgba(25,26,31,.94)!important;
    box-shadow:
      0 10px 30px rgba(0,0,0,.30),
      inset 0 1px 0 rgba(255,255,255,.025)!important;
  }
  .mobile-compact-summary .mobile-summary-progress,
  .mobile-compact-summary .mobile-summary-item{
    background:#15171C!important;
  }
  .mobile-compact-summary .mobile-summary-item.remaining{
    border-left-color:rgba(255,255,255,.07)!important;
  }
  .mobile-compact-summary .mobile-summary-item .k{
    color:#858A95!important;
  }
  .mobile-compact-summary .mobile-summary-item.used .v,
  #mobileUsedTop{
    color:var(--ap-used-text)!important;
  }
  .mobile-compact-summary .mobile-summary-item.remaining:not(.negative) .v,
  #mobileRemainingTopBox:not(.negative) #mobileRemainingTop{
    color:var(--ap-remaining-text)!important;
  }

  .mobile-summary-rail{
    background:var(--ap-track)!important;
  }
  .mobile-summary-used{
    background:linear-gradient(90deg,var(--ap-used),var(--ap-used-soft))!important;
  }
  .mobile-summary-remaining{
    background:linear-gradient(90deg,#B9BDC6,var(--ap-remaining-soft))!important;
  }

  /* When the summary becomes a dock, keep the same language and remove old gold framing. */
  .mobile-compact-summary.is-docked{
    border-color:rgba(136,119,204,.36)!important;
    background:rgba(20,21,26,.95)!important;
    box-shadow:
      0 12px 34px rgba(0,0,0,.44),
      0 0 0 1px rgba(136,119,204,.035) inset!important;
  }

  /* Legacy bottom bar is already hidden, but keep its palette aligned if ever reused. */
  .mobile-ap-rail{
    background:var(--ap-track)!important;
  }
  .mobile-ap-used-fill{
    background:linear-gradient(90deg,var(--ap-used),var(--ap-used-soft))!important;
  }
  .mobile-ap-remain-fill{
    background:linear-gradient(90deg,#B9BDC6,var(--ap-remaining-soft))!important;
  }
  .mobile-apitem.used .v{color:var(--ap-used-text)!important}
  .mobile-apitem.remaining:not(.negative) .v{color:var(--ap-remaining-text)!important}
}

/* === SOURCE: css/011-v325-ap-usage-heat.css === */

:root{
  --ap-track:#2A2D33;
  --ap-remaining:#D2D6DC;
  --ap-remaining-soft:#ECEEF2;
  --ap-used-current:#53B86C;
  --ap-used-current-soft:#71C987;
  --ap-used-text:#71C987;
  --ap-remaining-text:#E7EAF0;
}

.status-progress-rail,.mobile-summary-rail,.mobile-ap-rail{
  background:var(--ap-track)!important;
}
.status-progress-used,.mobile-summary-used,.mobile-ap-used-fill{
  background:linear-gradient(90deg,var(--ap-used-current),var(--ap-used-current-soft))!important;
}
.status-progress-remaining,.mobile-summary-remaining,.mobile-ap-remain-fill{
  background:linear-gradient(90deg,var(--ap-remaining),var(--ap-remaining-soft))!important;
}
#usedAP,.mobile-summary-item.used .v,#mobileUsedTop{
  color:var(--ap-used-text)!important;
}
#remainingStat:not(.negative) #remainingAP,
.mobile-summary-item.remaining:not(.negative) .v,
#mobileRemainingTopBox:not(.negative) #mobileRemainingTop{
  color:var(--ap-remaining-text)!important;
}

/* === SOURCE: css/012-v330-point-cost-feedback.css === */

/* ===== transient marginal AP feedback ===== */
.ap-point-toast{
  position:fixed;
  z-index:80;
  left:0;
  top:0;
  display:flex;
  align-items:center;
  gap:6px;
  min-height:28px;
  padding:5px 8px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:10px;
  background:rgba(10,13,17,.94);
  box-shadow:0 8px 22px rgba(0,0,0,.34);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  pointer-events:none;
  opacity:0;
  transform:translate(-50%,-100%) translateY(-5px) scale(.96);
  transition:opacity .12s ease, transform .14s ease;
  white-space:nowrap;
}
.ap-point-toast.show{
  opacity:1;
  transform:translate(-50%,-100%) translateY(-8px) scale(1);
}
.ap-point-toast.below{
  transform:translate(-50%,0) translateY(5px) scale(.96);
}
.ap-point-toast.below.show{
  transform:translate(-50%,0) translateY(8px) scale(1);
}
.ap-point-toast .transition{
  color:#8F98A4;
  font-size:10px;
  font-weight:700;
  letter-spacing:.01em;
  font-variant-numeric:tabular-nums;
}
.ap-point-toast .cost{
  color:#E7CB80;
  font-size:12px;
  font-weight:850;
  font-variant-numeric:tabular-nums;
}
.ap-point-toast.refund .cost{
  color:#C6CCD3;
}

/* PC: visual dot remains 18px. The extra grab area is implemented in JS,
   so the perfect v3.1.3/v3.2.x slider geometry does not change. */
@media(min-width:761px){
  .mini-slider .range-shell{
    touch-action:none;
  }
}

/* === SOURCE: css/013-v331-click-feedback-tune.css === */

.ap-point-toast.cost-only{
  gap:0;
  min-width:0;
  padding-left:9px;
  padding-right:9px;
}
.ap-point-toast.cost-only .transition{
  display:none;
}
.ap-point-toast.cost-only .cost{
  font-size:13px;
  letter-spacing:.01em;
}

/* === SOURCE: css/014-v334-mobile-sticky-controls.css === */

.mobile-sticky-controls{display:contents}

@media(max-width:760px){
  .mobile-summary-sentinel{
    display:block;
    width:100%;
    height:1px;
    margin:0;
    padding:0;
  }

  /* AP status + filter + tier help become one sticky control dock. */
  .mobile-sticky-controls{
    position:sticky;
    top:8px;
    z-index:36;
    display:block;
    margin-bottom:var(--m-card-gap);
    padding:0;
    isolation:isolate;
  }

  .mobile-sticky-controls::before{
    content:"";
    position:absolute;
    z-index:-1;
    left:-4px;
    right:-4px;
    top:-5px;
    bottom:-4px;
    border-radius:22px;
    background:linear-gradient(180deg,rgba(6,9,14,.97),rgba(6,9,14,.88) 82%,rgba(6,9,14,0));
    opacity:0;
    pointer-events:none;
    transition:opacity .18s ease;
  }
  .mobile-sticky-controls.is-docked::before{opacity:1}

  /* Wrapper owns sticky; summary only owns full/compact visual state. */
  .mobile-sticky-controls .mobile-compact-summary{
    position:relative!important;
    top:auto!important;
    z-index:auto!important;
    margin-bottom:7px!important;
  }

  .mobile-sticky-controls .attribute-tools{
    position:relative;
    z-index:1;
    margin-bottom:0!important;
  }

  .mobile-sticky-controls.is-docked .view-switch-row,
  .mobile-sticky-controls.is-docked .cost-help{
    background:rgba(15,21,29,.93);
    box-shadow:0 8px 20px rgba(0,0,0,.22);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
  }
}

@media(max-width:430px){
  .mobile-sticky-controls{top:6px}
  .mobile-sticky-controls .mobile-compact-summary{margin-bottom:6px!important}
}

/* === SOURCE: css/015-v335-pc-category-fold.css === */

@media(min-width:761px){
  .category-head{
    cursor:pointer;
    user-select:none;
    -webkit-user-select:none;
  }
  .category-name{
    display:flex;
    align-items:center;
  }
  .category-toggle{
    display:inline-flex!important;
    align-items:center;
    justify-content:center;
    margin-left:7px;
    color:#6f747c;
    font-size:10px;
    line-height:1;
    transform:rotate(0deg);
    transform-origin:center;
    transition:transform .16s ease,color .16s ease;
  }
  .category-head:hover .category-toggle{
    color:#b7bdc5;
  }
  .category-card.collapsed .attr-list{
    display:none;
  }
  .category-card.collapsed .category-toggle{
    transform:rotate(-90deg);
  }
  .category-card.collapsed .category-head{
    border-bottom-color:transparent;
  }
}

/* === SOURCE: css/016-v370-body-module.css === */

/* =========================================================
   v3.7.3 — Body axis labels + compact mobile body layout
   ========================================================= */
.body-panel{position:relative}
.body-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:10px}
.body-title{font-size:13px;font-weight:760;letter-spacing:.08em;color:#eef0f3}
.body-data-badge{margin-top:3px;font-size:9px;color:#81765d;letter-spacing:.04em}
.body-segment-row{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.body-segment{display:inline-flex;padding:2px;border:1px solid rgba(255,255,255,.07);border-radius:9px;background:rgba(255,255,255,.025)}
.body-segment button{appearance:none;border:0;background:transparent;color:#77818d;font:700 10px/1 system-ui,-apple-system,"Segoe UI",sans-serif;padding:6px 8px;border-radius:7px;cursor:pointer;transition:.15s ease}
.body-segment button:hover{color:#bbc2ca}
.body-segment button.active{color:#f2dfaa;background:rgba(205,169,82,.13);box-shadow:inset 0 0 0 1px rgba(216,179,88,.18)}
.body-segment button:disabled{opacity:.34;cursor:not-allowed;color:#5f6872;background:transparent;box-shadow:none}
.body-plot{position:relative;height:176px;margin:4px 4px 10px;border:1px solid rgba(255,255,255,.075);border-radius:16px;background:linear-gradient(180deg,rgba(20,31,40,.62),rgba(10,15,21,.72));overflow:hidden;cursor:crosshair;touch-action:none;user-select:none}
.body-grid-lines{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:25% 25%;mask-image:linear-gradient(to bottom,rgba(0,0,0,.78),rgba(0,0,0,.42))}
.body-plot::before,.body-plot::after{content:"";position:absolute;pointer-events:none;background:rgba(213,181,100,.17)}
.body-plot::before{left:50%;top:10px;bottom:10px;width:1px}
.body-plot::after{top:50%;left:10px;right:10px;height:1px}
.body-axis{display:none}
.body-range-label{position:absolute;z-index:2;font-size:8px;font-weight:650;color:#737d88;pointer-events:none;font-variant-numeric:tabular-nums;line-height:1;padding:2px 3px;border-radius:4px;background:rgba(10,15,21,.34);white-space:nowrap}
.body-range-top{top:8px;left:50%;transform:translateX(-50%)}
.body-range-bottom{bottom:8px;left:50%;transform:translateX(-50%)}
.body-range-left{left:7px;top:50%;transform:translateY(-50%) rotate(-90deg);transform-origin:center}
.body-range-right{right:7px;top:50%;transform:translateY(-50%) rotate(-90deg);transform-origin:center}
.body-content{display:block}
.body-side{min-width:0}
.body-dot{position:absolute;z-index:4;width:26px;height:26px;padding:0;border:0;border-radius:50%;transform:translate(-50%,-50%);background:rgba(224,191,105,.15);box-shadow:0 0 0 1px rgba(228,195,107,.55),0 0 0 6px rgba(217,178,81,.07),0 7px 18px rgba(0,0,0,.40);cursor:grab;transition:box-shadow .15s ease}
.body-dot:active{cursor:grabbing}.body-dot:focus-visible{outline:2px solid rgba(240,207,122,.75);outline-offset:4px}
.body-dot span{position:absolute;inset:7px;border-radius:50%;background:#e3c16d;box-shadow:0 0 12px rgba(224,184,83,.34)}
.body-values{display:grid;grid-template-columns:1fr 1fr auto;gap:6px;align-items:stretch;margin-bottom:9px}
.body-value-card{min-width:0;padding:8px 9px;border:1px solid rgba(255,255,255,.055);border-radius:11px;background:rgba(255,255,255,.018)}
.body-value-card span{display:block;font-size:9px;color:#69737e;margin-bottom:3px}.body-value-card strong{display:block;font-size:13px;color:#e8ebef;font-variant-numeric:tabular-nums;white-space:nowrap}
.body-reset{min-width:46px;border:1px solid rgba(255,255,255,.065);border-radius:11px;background:rgba(255,255,255,.025);color:#89939e;font-size:10px;font-weight:700;cursor:pointer}.body-reset:hover{color:#d8dde3;border-color:rgba(255,255,255,.12)}
.body-accelerate{display:flex;align-items:center;justify-content:space-between;gap:9px;padding:9px 10px;margin-bottom:8px;border:1px solid rgba(255,255,255,.055);border-radius:12px;background:rgba(255,255,255,.018)}
.body-accelerate-label{font-size:9px;color:#78838e;font-weight:700;letter-spacing:.06em}.body-accelerate-types{display:flex;align-items:center;gap:6px;font-size:11px}.body-accelerate-types span{color:#818c97}.body-accelerate-types strong{color:#dbe0e5}.body-accelerate-types strong.changed{color:#e2c170}.body-accelerate-arrow{color:#665b42!important}
.body-modifier-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}
.body-mod{display:flex;align-items:center;justify-content:space-between;gap:5px;padding:6px 7px;border:1px solid rgba(255,255,255,.045);border-radius:9px;background:rgba(255,255,255,.015);font-size:9px;color:#737e89}.body-mod strong{font-size:11px;font-variant-numeric:tabular-nums;color:#7f8994}.body-mod.positive strong{color:#b8d493}.body-mod.negative strong{color:#e18f86}.body-mod.neutral{opacity:.58}
.body-footnote{margin-top:8px;font-size:8px;line-height:1.45;color:#5e6872}
@media(min-width:761px){
}

/* v3.7.1 — Body is a standalone module below the complete archetype/control slab. */
.left-stack{min-width:0;align-self:start;display:grid;gap:12px}
@media(min-width:761px){
  .left-stack{position:sticky;top:18px;max-height:calc(100vh - 36px);overflow-y:auto;overflow-x:hidden;padding-right:2px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.12) transparent}
  .left-stack > .sidebar{position:static!important;top:auto!important}
  .standalone-body-panel{padding:13px!important;border:1px solid var(--glass-border)!important;border-radius:20px!important;background:linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.012) 42%,transparent 76%),var(--glass-bg)!important;box-shadow:var(--glass-shadow)!important;backdrop-filter:blur(var(--glass-blur)) saturate(118%);-webkit-backdrop-filter:blur(var(--glass-blur)) saturate(118%)}
}
@media(max-width:760px){
  .left-stack{display:grid;gap:var(--m-card-gap);margin-bottom:var(--m-card-gap)}
  .standalone-body-panel{padding:14px var(--m-card-pad)!important;background:linear-gradient(145deg,rgba(255,255,255,.035),transparent 46%),rgba(15,21,29,.64);border:1px solid rgba(255,255,255,.075);border-radius:18px;box-shadow:0 12px 30px rgba(0,0,0,.18);backdrop-filter:blur(14px) saturate(110%);-webkit-backdrop-filter:blur(14px) saturate(110%)}

  .body-panel{padding:14px var(--m-card-pad)!important}
  .body-head{align-items:center;margin-bottom:10px}
  .body-title{font-size:15px}.body-data-badge{font-size:9px}
  .body-content{display:grid;grid-template-columns:minmax(142px,.94fr) minmax(164px,1.06fr);gap:9px;align-items:start}
  .body-plot{width:100%;height:auto;aspect-ratio:1/1;margin:0;border-radius:14px}
  .body-side{display:flex;flex-direction:column;gap:6px}
  .body-values{grid-template-columns:1fr 1fr;gap:5px;margin:0}
  .body-value-card{padding:7px 8px;border-radius:10px}
  .body-value-card span{font-size:8px;margin-bottom:2px}
  .body-value-card strong{font-size:13px}
  .body-reset{grid-column:1/-1;min-width:0;min-height:32px;border-radius:10px}
  .body-accelerate{padding:7px 8px;margin:0;border-radius:10px}
  .body-accelerate-label{font-size:8px}.body-accelerate-types{font-size:11px}
  .body-modifier-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}
  .body-mod{font-size:8px;padding:6px 7px;border-radius:8px}.body-mod strong{font-size:11px}
  .body-footnote{margin-top:8px}
  .body-range-label{font-size:7px}
  .body-range-left{left:4px}.body-range-right{right:4px}
}
@media(max-width:430px){
  .body-head{align-items:flex-start;gap:8px}
  .body-segment-row{gap:4px}
  .body-segment button{font-size:9px;padding:5px 7px}
  .body-content{grid-template-columns:minmax(132px,.9fr) minmax(154px,1.1fr);gap:8px}
  .body-value-card{padding:6px 7px}
  .body-value-card strong{font-size:12px}
  .body-mod{padding:5px 6px}
}

/* === SOURCE: css/017-v375-tablet-layout.css === */

/* =========================================================
   v3.7.5 — Dedicated iPad / tablet layout
   761–1279px no longer inherits the narrow PC hybrid layout.
   ========================================================= */
@media (min-width:761px) and (max-width:1279px){
  .shell{padding:18px 16px 64px}
  .topbar{margin-bottom:14px}

  /* Tablet becomes its own one-column workspace. */
  .workspace{display:block!important}
  .left-stack{
    position:static!important;
    top:auto!important;
    max-height:none!important;
    overflow:visible!important;
    padding-right:0!important;
    margin-bottom:14px!important;
    gap:14px!important
  }

  /* Controls use a clean 2-column tablet grid instead of a squeezed PC sidebar. */
  .sidebar{
    position:static!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:12px!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important
  }
  .build-control-heading{display:none!important}
  .sidebar > .panel,
  .sidebar > .reset-panel{
    background:linear-gradient(145deg,rgba(255,255,255,.035),transparent 46%),rgba(15,21,29,.64)!important;
    border:1px solid rgba(255,255,255,.075)!important;
    border-radius:18px!important;
    box-shadow:0 12px 30px rgba(0,0,0,.18)!important;
    backdrop-filter:blur(14px) saturate(110%)!important;
    -webkit-backdrop-filter:blur(14px) saturate(110%)!important
  }
  .sidebar > .model-panel,
  .sidebar > .status-panel{border-bottom:1px solid rgba(255,255,255,.075)!important}
  .sidebar > .special-panel{grid-column:1/-1}
  .sidebar > .reset-panel{display:none!important}
  .model-panel{padding:14px 16px!important}
  .status-panel{padding:0!important;overflow:hidden}
  .special-panel{padding:12px 16px!important}

  /* Keep body as a separate full-width module; square plot left, details right. */
  .standalone-body-panel{padding:16px!important}
  .body-content{
    display:grid!important;
    grid-template-columns:minmax(260px,.9fr) minmax(300px,1.1fr)!important;
    gap:16px!important;
    align-items:start!important
  }
  .body-plot{
    width:min(100%,340px)!important;
    height:auto!important;
    aspect-ratio:1/1!important;
    margin:0 auto!important;
    border-radius:16px!important
  }
  .body-side{display:flex!important;flex-direction:column!important;gap:8px!important}
  .body-values{grid-template-columns:1fr 1fr auto!important;gap:7px!important;margin:0!important}
  .body-accelerate{margin:0!important}
  .body-modifier-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}

  /* Attribute area: 2 columns is much more readable on iPad widths. */
  .main{min-width:0!important}
  .attr-columns{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:12px!important
  }
  .attr-column{gap:12px!important}

  /* Tablet keeps desktop summary behavior; mobile-only sticky UI remains hidden. */
  .mobile-compact-summary,
  .mobile-filter-toggle,
  .mobile-apbar,
  .mobile-sticky-controls{display:none!important}
}

/* Narrow iPad portrait / small tablets: retain 2-column attributes but slightly tighten the body split. */
@media (min-width:761px) and (max-width:860px){
  .body-content{grid-template-columns:minmax(235px,.88fr) minmax(280px,1.12fr)!important;gap:12px!important}
  .body-plot{width:min(100%,300px)!important}
  .status-level{grid-template-columns:72px 60px minmax(70px,1fr) 70px!important;gap:7px!important}
  .attr-main{grid-template-columns:112px minmax(86px,1fr) 82px!important;gap:7px!important}
  .attr-name-wrap{width:112px!important}
}

/* === SOURCE: css/018-v380-advanced-mastery.css === */

.editor-view-tabs{display:flex;align-items:center;gap:8px;padding:7px;margin:0 0 16px;border:1px solid rgba(255,255,255,.08);border-radius:18px;background:rgba(9,14,19,.62);box-shadow:inset 0 1px rgba(255,255,255,.03);overflow-x:auto;scrollbar-width:none}.editor-view-tabs::-webkit-scrollbar{display:none}
.editor-view-tab{overflow:visible;appearance:none;border:0;flex:0 0 auto;min-height:44px;padding:0 24px;border-radius:13px;background:transparent;color:#8d97a5;font:800 15px/1 inherit;cursor:pointer;transition:.18s ease;white-space:nowrap}
.editor-view-tab.active{background:linear-gradient(180deg,rgba(215,181,90,.18),rgba(215,181,90,.08));color:#f2df9e;box-shadow:inset 0 0 0 1px rgba(215,181,90,.32)}

.advanced-effects-master{display:inline-flex;align-items:center;gap:6px;padding:0 8px 0 2px;color:#9a8757;font-size:10px;font-weight:800;white-space:nowrap;flex:0 0 auto}
.effect-switch{display:inline-flex;align-items:center;gap:7px;cursor:pointer;user-select:none;white-space:nowrap}.effect-switch input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}.effect-switch-track{position:relative;width:38px;height:22px;border-radius:999px;background:#17202a;border:1px solid rgba(255,255,255,.11);box-shadow:inset 0 2px 5px rgba(0,0,0,.25);transition:.18s ease}.effect-switch-track::after{content:"";position:absolute;left:3px;top:3px;width:14px;height:14px;border-radius:50%;background:#77818e;box-shadow:0 2px 5px rgba(0,0,0,.35);transition:.18s ease}.effect-switch input:checked + .effect-switch-track{background:rgba(215,181,90,.17);border-color:rgba(215,181,90,.38)}.effect-switch input:checked + .effect-switch-track::after{transform:translateX(16px);background:#d8b85f}.effect-switch-text{font-size:10px;color:#7d8795;font-weight:800}.effect-switch input:checked ~ .effect-switch-text{color:#dbc77f}
.advanced-card.effects-paused{opacity:.70}.advanced-card.effects-paused>header{background:linear-gradient(90deg,rgba(215,181,90,.025),transparent)}.advanced-card.effects-paused .mastery-node.active{filter:saturate(.55);opacity:.68}.advanced-card.effects-paused .advanced-badge{color:#b67d72;border-color:rgba(201,116,96,.18)}
.advanced-card-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}.module-switch{padding:5px 8px;border:1px solid rgba(255,255,255,.075);border-radius:999px;background:rgba(255,255,255,.025)}
.advanced-panel{margin-top:2px}.advanced-panel[hidden]{display:none!important}
.feature-panel{margin-top:2px}.feature-panel[hidden]{display:none!important}.feature-page-card{border:1px solid rgba(255,255,255,.085);border-radius:20px;background:linear-gradient(180deg,rgba(17,24,32,.95),rgba(10,16,22,.94));overflow:hidden}.feature-page-card>header{padding:20px;border-bottom:1px solid rgba(255,255,255,.07)}.feature-page-card h2{margin:3px 0 0;font-size:22px;color:#edf1f6}.feature-page-body{min-height:360px;padding:26px 20px;display:flex;flex-direction:column;justify-content:center;gap:9px;background:radial-gradient(circle at 20% 20%,rgba(211,177,79,.05),transparent 42%)}.feature-page-body strong{font-size:17px;color:#d4dae2}.feature-page-body p{max-width:720px;margin:0;color:#778291;font-size:12px;line-height:1.75}
.advanced-status-strip{display:grid;grid-template-columns:1fr .7fr .8fr minmax(220px,1.45fr);gap:10px;align-items:stretch;margin-bottom:14px}
.advanced-status-strip>div{min-height:58px;border:1px solid rgba(255,255,255,.08);border-radius:15px;background:rgba(13,19,26,.78);padding:10px 14px;display:flex;flex-direction:column;justify-content:center}
.advanced-status-strip span{font-size:11px;color:#737e8d}.advanced-status-strip strong{font-size:16px;color:#e9edf4;margin-top:3px}.advanced-status-strip .advanced-global-note{font-size:12px;color:#9aa4b2;line-height:1.5}
.advanced-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;align-items:start}
.advanced-card{min-width:0;border:1px solid rgba(255,255,255,.085);border-radius:20px;background:linear-gradient(180deg,rgba(17,24,32,.95),rgba(10,16,22,.94));box-shadow:0 12px 40px rgba(0,0,0,.18);overflow:hidden}
.advanced-card>header{min-height:84px;padding:18px 20px 15px;display:flex;align-items:flex-start;justify-content:space-between;gap:14px;border-bottom:1px solid rgba(255,255,255,.07)}
.advanced-kicker{font-size:10px;letter-spacing:.15em;color:#81704c;font-weight:800}.advanced-card h2{font-size:20px;margin:3px 0 0;color:#edf1f6}.advanced-card header p{font-size:11px;color:#737f8d;margin:5px 0 0;line-height:1.45}
.advanced-badge{font-size:10px;color:#7c8795;border:1px solid rgba(255,255,255,.08);border-radius:999px;padding:5px 8px;white-space:nowrap}
.advanced-placeholder-body{min-height:230px;padding:22px 20px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:8px;background:radial-gradient(circle at 20% 20%,rgba(211,177,79,.05),transparent 40%)}
.advanced-placeholder-body strong{color:#cfd5de;font-size:15px}.advanced-placeholder-body p{max-width:430px;margin:0;color:#707b89;font-size:12px;line-height:1.7}
.mastery-card{grid-column:1 / 2}.mastery-head{align-items:center!important}.mastery-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 18px;border-bottom:1px solid rgba(255,255,255,.065)}
.mastery-toolbar-stats{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0;flex:1 1 auto}.mastery-metric{display:flex;align-items:center;gap:8px;min-width:0;height:42px;padding:0 12px;border:1px solid rgba(255,255,255,.06);border-radius:12px;background:rgba(255,255,255,.022);white-space:nowrap}.mastery-metric span{display:inline;color:#75818f;font-size:11px;line-height:1}.mastery-metric strong{display:inline;margin:0;color:#e3e8ef;font-size:16px;line-height:1}
.mastery-toolbar-tools{display:flex;align-items:center;gap:8px;flex-wrap:nowrap;justify-content:flex-end;flex:0 0 auto}.mastery-bulk-btn{height:36px;min-width:72px;padding:0 12px;border:1px solid rgba(255,255,255,.078);border-radius:12px;background:linear-gradient(180deg,rgba(255,255,255,.032),rgba(255,255,255,.016));box-shadow:inset 0 1px 0 rgba(255,255,255,.025);color:#d7deea;font:700 12px/1 inherit;letter-spacing:.02em;cursor:pointer;transition:border-color .16s ease,background .16s ease,color .16s ease,transform .16s ease,opacity .16s ease}.mastery-bulk-btn:hover:not(:disabled){color:#efe6c4;border-color:rgba(215,181,90,.22);background:linear-gradient(180deg,rgba(215,181,90,.075),rgba(255,255,255,.02));transform:translateY(-1px)}.mastery-bulk-btn:active:not(:disabled){transform:translateY(0)}.mastery-bulk-btn:disabled{opacity:.30;cursor:not-allowed;transform:none}.mastery-toolbar-toggle{height:36px;padding:0 10px;border:1px solid rgba(255,255,255,.078);border-radius:12px;background:linear-gradient(180deg,rgba(255,255,255,.030),rgba(255,255,255,.015));box-shadow:inset 0 1px 0 rgba(255,255,255,.025);display:flex;align-items:center;justify-content:center;cursor:pointer}.mastery-toolbar-toggle .effect-switch-track{width:32px;height:18px}.mastery-toolbar-toggle .effect-switch-track::after{width:10px;height:10px;left:3px;top:3px}.mastery-toolbar-toggle input:checked + .effect-switch-track::after{transform:translateX(14px)}
.mastery-list{padding:14px 18px 18px;max-height:620px;overflow:auto;scrollbar-width:thin;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:"def att" "mid gk";gap:12px}.mastery-group{min-width:0;border:1px solid rgba(255,255,255,.07);border-radius:16px;background:linear-gradient(180deg,rgba(255,255,255,.024),rgba(255,255,255,.012));overflow:hidden}.mastery-group-gk{grid-area:gk}.mastery-group-def{grid-area:def}.mastery-group-mid{grid-area:mid}.mastery-group-att{grid-area:att}
.mastery-group-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:11px 14px 10px;border-bottom:1px solid rgba(255,255,255,.06);background:linear-gradient(90deg,rgba(255,255,255,.018),transparent)}.mastery-group-head strong{font-size:14px;color:#e4e9ef;letter-spacing:.01em}.mastery-group-head span{font-size:10px;color:#778291;letter-spacing:.08em;text-transform:uppercase}
.mastery-group-list{padding:6px 8px 8px}.mastery-row{position:relative;display:grid;grid-template-columns:minmax(150px,.88fr) minmax(0,1fr) minmax(0,.86fr);gap:10px;align-items:center;min-height:58px;margin:6px 0;padding:8px 10px 8px 14px;border:1px solid transparent;border-radius:14px;background:rgba(255,255,255,.014);transition:border-color .16s ease,background .16s ease,box-shadow .16s ease}.mastery-row::before{content:"";position:absolute;left:0;top:11px;bottom:11px;width:3px;border-radius:999px;background:rgba(215,181,90,.95);opacity:0;transition:opacity .16s ease}.mastery-row.selected::before{opacity:1}.mastery-row.selected{background:linear-gradient(90deg,rgba(215,181,90,.10),rgba(255,255,255,.02) 38%,rgba(255,255,255,.012));border-color:rgba(215,181,90,.14)}.mastery-row.current-model:not(.selected){background:linear-gradient(90deg,rgba(98,130,176,.08),rgba(255,255,255,.016));border-color:rgba(121,160,216,.12)}
.mastery-model{display:flex;align-items:center;min-width:0;gap:10px}.mastery-logo-shell{width:34px;height:34px;display:grid;place-items:center;flex:0 0 34px;border-radius:999px;border:1px solid rgba(255,255,255,.06);background:rgba(255,255,255,.022);transition:border-color .16s ease,background .16s ease,box-shadow .16s ease}.mastery-logo-shell img{width:31px;height:31px;object-fit:contain;display:block}.mastery-logo-shell.disruptor-logo img{width:31px;height:31px;transform:none}.mastery-row.selected .mastery-logo-shell{border-color:rgba(215,181,90,.18);background:rgba(215,181,90,.07);box-shadow:inset 0 0 0 1px rgba(215,181,90,.03)}.mastery-model-copy{min-width:0}.mastery-model-copy strong,.mastery-model-copy small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mastery-model-copy strong{font-size:12px;color:#dce2ea}.mastery-model-copy small{font-size:9px;color:#667381;margin-top:2px}
.mastery-node{appearance:none;border:0;background:transparent;color:#909aa7;text-align:left;padding:0;min-height:auto;cursor:pointer;transition:color .16s ease,transform .16s ease;display:flex;align-items:flex-start;gap:8px;line-height:1.35;justify-content:flex-start}.mastery-node:hover{color:#ddd0a1;transform:translateY(-1px)}.mastery-node.active{color:#ece3c9}.mastery-node-level{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;min-width:38px;height:22px;padding:0 7px;border:1px solid rgba(255,255,255,.07);border-radius:999px;background:rgba(255,255,255,.03);font-size:10px;font-weight:900;letter-spacing:.06em;text-transform:uppercase;color:#8a95a2}.mastery-node.active .mastery-node-level{color:#d8b85f;border-color:rgba(215,181,90,.20);background:rgba(215,181,90,.10)}.mastery-node-stats{font-size:10.5px;line-height:1.4;color:#a9b1bc}.mastery-node.active .mastery-node-stats{color:#d8cfb7}.mastery-node-stats em{font-style:normal;font-weight:700;color:#f2e5b6}.mastery-node-stats .mastery-divider{padding:0 5px;color:#738091}

/* Both Lv10 + Lv30 complete: subtle archetype completion treatment. */
.mastery-row.fully-mastered{box-shadow:inset 0 0 0 1px rgba(215,181,90,.04)}
.mastery-row.fully-mastered .mastery-model-copy strong{color:#e4ca76;text-shadow:0 0 10px rgba(215,181,90,.11)}
.mastery-row.fully-mastered .mastery-logo-shell img{filter:drop-shadow(0 0 5px rgba(215,181,90,.28))}
.mastery-row.fully-mastered .mastery-model{position:relative;overflow:hidden}
.mastery-row.mastery-complete-pulse .mastery-model::after{content:"";position:absolute;top:0;bottom:0;width:34%;left:-44%;pointer-events:none;background:linear-gradient(100deg,transparent,rgba(243,217,133,.16),transparent);transform:skewX(-16deg);animation:masteryCompleteSweep .72s ease-out 1}
@keyframes masteryCompleteSweep{from{left:-44%;opacity:0}18%{opacity:1}to{left:112%;opacity:0}}
body.non-attribute-editor-active #attributes,body.non-attribute-editor-active #emptyState{display:none!important}
@media (min-width:1280px){.mastery-card{grid-column:1 / 2}.advanced-placeholder-body{min-height:250px}}
@media (max-width:1180px){.advanced-status-strip{grid-template-columns:repeat(3,1fr)}.advanced-global-note{grid-column:1/-1}.mastery-row{grid-template-columns:minmax(132px,.88fr) minmax(0,1fr) minmax(0,.9fr)}.mastery-list{gap:12px}}
@media (max-width:860px){.mastery-toolbar{flex-direction:column;align-items:stretch}.mastery-toolbar-tools{justify-content:flex-end;flex-wrap:wrap}.mastery-list{grid-template-columns:1fr;grid-template-areas:none}.mastery-group{grid-area:auto!important}}
@media (max-width:760px){
  .editor-view-tabs{margin:0 0 10px;padding:5px;border-radius:15px;position:relative;z-index:3;gap:5px}.editor-view-tab{flex:0 0 auto;min-height:39px;padding:0 12px;font-size:13px}
  .advanced-effects-master{padding:0 3px 0 0;gap:4px}.advanced-effects-master>span:first-child{display:none}.advanced-effects-master .effect-switch-track{width:34px;height:20px}.advanced-effects-master .effect-switch-track::after{width:12px;height:12px}.advanced-effects-master .effect-switch input:checked + .effect-switch-track::after{transform:translateX(14px)}.advanced-effects-master .effect-switch-text{display:none}
  .advanced-card-actions{gap:5px}.module-switch{padding:4px 6px}.module-switch .effect-switch-text{display:none}
  .advanced-status-strip{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-bottom:9px}.advanced-status-strip>div{min-height:48px;padding:7px 8px;border-radius:11px}.advanced-status-strip strong{font-size:13px}.advanced-status-strip .advanced-global-note{display:none}
  .advanced-grid{grid-template-columns:1fr;gap:9px}.advanced-card{border-radius:16px}.advanced-card>header{min-height:70px;padding:14px 14px 12px}.advanced-card h2{font-size:17px}.advanced-placeholder-body{min-height:118px;padding:15px 14px}.advanced-placeholder-body p{font-size:11px}
  .mastery-card{grid-column:auto}.mastery-toolbar{padding:9px 12px}.mastery-toolbar-stats{gap:6px}.mastery-metric{flex:1 1 120px;min-width:0;height:38px;padding:0 9px}.mastery-toolbar-tools{width:100%;justify-content:space-between;flex-wrap:nowrap}.mastery-bulk-btn{flex:1 1 auto;min-width:0}.mastery-toolbar-toggle{height:36px;padding:0 10px}.mastery-list{padding:8px 10px 12px;max-height:none;gap:10px}.mastery-group-head{padding:10px 12px 9px}.mastery-group-list{padding:5px 6px 6px}.mastery-row{grid-template-columns:1fr;gap:6px;min-height:0;padding:10px 10px 10px 14px}.mastery-model{gap:8px}.mastery-logo-shell{width:30px;height:30px;flex-basis:30px}.mastery-logo-shell img{width:27px;height:27px}.mastery-model-copy strong{font-size:11px}.mastery-model-copy small{font-size:8px}.mastery-node{gap:7px}.mastery-node-level{min-width:36px;height:21px;font-size:9px}.mastery-node-stats{font-size:9px}
}

/* === SOURCE: css/019-v383-nav-refresh.css === */

/* v3.8.3 · text-first navigation */
.editor-view-tabs{
  gap:0!important;
  padding:0 14px!important;
  min-height:64px;
  border-radius:16px!important;
  overflow-x:auto;
}
.editor-view-tab{
  min-height:64px!important;
  padding:0 16px!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#8f99a7!important;
  font-size:15px!important;
  position:relative;
}
.editor-view-tab:hover{color:#c7ced8!important}
.editor-view-tab.active{
  color:#ead58d!important;
  background:transparent!important;
  box-shadow:none!important;
}
.editor-view-tab.active::after{
  content:"";
  position:absolute;
  left:16px;right:16px;bottom:0;
  height:2px;border-radius:2px;
  background:linear-gradient(90deg,transparent,#d7b55a 20%,#d7b55a 80%,transparent);
}
.editor-view-sep{
  flex:0 0 auto;
  color:rgba(255,255,255,.14);
  font-size:16px;
  line-height:64px;
  user-select:none;
}
.editor-advanced-group{display:flex;align-items:center;flex:0 0 auto;white-space:nowrap}
.editor-advanced-group .editor-view-tab{padding-right:8px!important}
.advanced-effects-master{
  padding:0 10px 0 0!important;
  margin:0!important;
  gap:0!important;
}
.advanced-effects-master .effect-switch-track{width:32px;height:18px}
.advanced-effects-master .effect-switch-track::after{width:10px;height:10px;left:3px;top:3px}
.advanced-effects-master input:checked + .effect-switch-track::after{transform:translateX(14px)}
.editor-view-action{display:flex;align-items:center;gap:6px}
.editor-beta{font-size:8px;letter-spacing:.08em;color:#b7a15e;border:1px solid rgba(215,181,90,.25);border-radius:999px;padding:2px 5px;line-height:1}

/* Hover breakdown for aggregate Mastery bonus */
.mastery-summary-hover{position:relative;cursor:help}
.mastery-summary-hover::after{
  content:attr(data-tooltip);
  position:absolute;
  left:50%;bottom:calc(100% + 10px);
  transform:translate(-50%,6px);
  width:max-content;max-width:360px;
  padding:9px 11px;
  border:1px solid rgba(215,181,90,.20);
  border-radius:10px;
  background:rgba(8,13,18,.97);
  color:#cfd6df;
  font-size:10px;line-height:1.55;
  white-space:pre-line;
  box-shadow:0 12px 30px rgba(0,0,0,.35);
  opacity:0;pointer-events:none;
  transition:.15s ease;
  z-index:50;
}
.mastery-summary-hover::before{
  content:"";position:absolute;left:50%;bottom:calc(100% + 5px);
  width:8px;height:8px;background:rgba(8,13,18,.97);
  border-right:1px solid rgba(215,181,90,.20);border-bottom:1px solid rgba(215,181,90,.20);
  transform:translateX(-50%) rotate(45deg);opacity:0;pointer-events:none;transition:.15s ease;z-index:51
}
.mastery-summary-hover:hover::after{opacity:1;transform:translate(-50%,0)}
.mastery-summary-hover:hover::before{opacity:1}

@media (max-width:760px){
  .editor-view-tabs{min-height:50px;padding:0 8px!important}
  .editor-view-tab{min-height:50px!important;padding:0 10px!important;font-size:12px!important}
  .editor-view-tab.active::after{left:10px;right:10px}
  .editor-view-sep{line-height:50px;font-size:12px}
  .advanced-effects-master{padding-right:6px!important}
  .advanced-effects-master .effect-switch-track{width:28px;height:17px}
  .advanced-effects-master .effect-switch-track::after{width:9px;height:9px}
  .advanced-effects-master input:checked + .effect-switch-track::after{transform:translateX(11px)}
  .editor-beta{font-size:7px;padding:2px 4px}
  .mastery-summary-hover::after{max-width:260px;left:0;transform:translate(0,6px)}
  .mastery-summary-hover:hover::after{transform:translate(0,0)}
  .mastery-summary-hover::before{left:20px}
}

/* === SOURCE: css/020-v384-advanced-viewport-linked-switches.css === */

/* v3.8.4 · Advanced workspace: no status strip, linked switches, internal scroll */
.advanced-panel{margin-top:0}
.advanced-grid{margin-top:0}
.module-switch{padding:0!important;border:0!important;background:transparent!important;border-radius:0!important}
.module-switch .effect-switch-text{display:none!important}
.advanced-card-actions .module-switch{flex:0 0 auto}

@media (min-width:761px){
  .advanced-panel{height:var(--advanced-viewport-height,auto);min-height:0;overflow:hidden}
  .advanced-grid{height:100%;min-height:0;align-items:stretch}
  .advanced-card{height:100%;min-height:0;display:flex;flex-direction:column}
  .advanced-card>header{flex:0 0 auto}
  .mastery-summary,.mastery-list-head{flex:0 0 auto}
  .mastery-list{flex:1 1 auto;min-height:0;max-height:none!important;overflow-y:auto;overscroll-behavior:contain}
  .advanced-placeholder-body{flex:1 1 auto;min-height:0!important;overflow-y:auto;overscroll-behavior:contain}
}

@media (max-width:760px){
  .advanced-panel{height:auto!important;overflow:visible!important}
  .advanced-grid{height:auto!important}
  .advanced-card{height:auto!important}
}

/* === SOURCE: css/021-v387-overflow-warning-ux.css === */

/* Cap overflow belongs to the combined Mastery + Body layer. Keep warnings compact. */
.mastery-summary{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.attr-tab-overflow-warning{display:inline-flex;align-items:center;margin-left:7px;color:#e7a356;font-size:10px;font-weight:800;letter-spacing:.01em;vertical-align:middle;white-space:nowrap}
.attr-tab-overflow-warning[hidden]{display:none!important}
.attr-overflow-badge{
  position:absolute!important;
  top:-3px!important;
  right:auto!important;
  left:calc(50% + 14px)!important;
  transform:translateX(-50%);
  z-index:3;
  width:10px!important;
  height:10px!important;
  min-width:10px!important;
  min-height:10px!important;
  flex:0 0 10px!important;
  display:block!important;
  margin:0!important;
  padding:0!important;
  border:none!important;
  border-radius:999px!important;
  background:#ff4d4f!important;
  color:transparent!important;
  font-size:0!important;
  line-height:0!important;
  box-shadow:0 1px 6px rgba(255,77,79,.20);
  cursor:help;
}

/* === SOURCE: css/022-v394-stepper-clip-fix.css === */

/* v3.8.22 · gold mastery states and completion sweep */
.editor-view-tab[data-editor-view="attributes"]{overflow:visible!important}
.attribute-tab-label{
  position:relative;
  display:inline-block;
  line-height:1;
}
.attr-tab-overflow-warning{
  position:absolute!important;
  top:-11px!important;
  right:-12px!important;
  z-index:3;
  min-width:16px;
  height:16px;
  display:grid!important;
  place-items:center;
  margin:0!important;
  padding:0 3px!important;
  border:none!important;
  border-radius:999px!important;
  background:#c85a60!important;
  color:#fff!important;
  font-size:10px!important;
  font-weight:650!important;
  line-height:1!important;
  letter-spacing:0!important;
  white-space:nowrap!important;
  box-shadow:0 1px 6px rgba(200,90,96,.18);
  cursor:help;
  pointer-events:auto;
}
.attr-tab-overflow-warning[hidden]{display:none!important}

.stepper-wrap{
  position:relative;
  justify-self:end;
  width:max-content;
  overflow:visible;
}
.stepper{
  position:relative;
  overflow:hidden!important;
}
.attr-overflow-badge{
  position:absolute!important;
  top:4px!important;
  right:auto!important;
  left:calc(50% + 14px)!important;
  transform:translateX(-50%);
  z-index:3;
  width:8px!important;
  height:8px!important;
  min-width:8px!important;
  min-height:8px!important;
  flex:0 0 8px!important;
  display:block!important;
  margin:0!important;
  padding:0!important;
  border:none!important;
  border-radius:999px!important;
  background:#c85a60!important;
  color:transparent!important;
  font-size:0!important;
  line-height:0!important;
  box-shadow:0 1px 5px rgba(200,90,96,.16);
  cursor:help;
}
@media (max-width:760px){
  .stepper-wrap{
    grid-area:stepper;
    width:86px;
  }
  .stepper{
    grid-area:auto!important;
    width:86px!important;
    justify-self:stretch!important;
  }
  .attr-tab-overflow-warning{
    top:-10px!important;
    right:-11px!important;
    min-width:15px;
    height:15px;
    padding:0 3px!important;
    font-size:9px!important
  }
  .attr-overflow-badge{
    top:4px!important;
    left:calc(50% + 12px)!important;
    transform:translateX(-50%);
    width:8px!important;
    height:8px!important;
    min-width:8px!important;
    min-height:8px!important;
    flex-basis:8px!important;
    padding:0!important;
    font-size:0!important
  }
}

/* === SOURCE: css/023-v4110k12-floating-inspector-stable.css === */

/* k12: keep the 30+6 selector full-width; reuse the existing k8 inspector as a floating card. */
@media(min-width:1001px){
  #playstylesPanel .ps-page-k6{position:relative!important}
  #playstylesPanel .ps-page-k6 .ps-page-head{padding-right:270px!important;min-height:62px!important}
  #playstylesPanel .ps-page-k6 .ps-library-stats{
    position:absolute!important;
    top:7px!important;
    right:4px!important;
    z-index:4!important;
    display:flex!important;
    gap:10px!important;
    margin:0!important;
  }
  #playstylesPanel .ps-page-k6 .ps-library-stat{
    min-width:112px!important;
    padding:9px 13px!important;
    border:1px solid rgba(255,255,255,.09)!important;
    border-radius:12px!important;
    background:rgba(255,255,255,.025)!important;
  }
  #playstylesPanel .ps-page-k6 .ps-library-stat small{font-size:9px!important}
  #playstylesPanel .ps-page-k6 .ps-library-stat strong{font-size:18px!important}

  #playstylesPanel .ps-page-k6 .ps-library-toolbar-main{display:block!important}
  #playstylesPanel .ps-page-k6 .ps-library-main{
    display:block!important;
    grid-template-columns:none!important;
    overflow:visible!important;
  }
  #playstylesPanel .ps-page-k6 .ps-category-list{width:100%!important;min-width:0!important}

  #playstylesPanel .ps-page-k6 #psHoverDetail{
    position:fixed!important;
    z-index:2147483000!important;
    width:372px!important;
    min-height:0!important;
    max-height:calc(100vh - 24px)!important;
    top:0!important;
    left:0!important;
    margin:0!important;
    overflow:auto!important;
    display:none!important;
    visibility:hidden!important;
    pointer-events:auto!important;
    border:1px solid rgba(151,174,191,.24)!important;
    border-radius:15px!important;
    background:linear-gradient(145deg,rgba(34,53,73,.99),rgba(18,31,43,.995))!important;
    box-shadow:0 22px 58px rgba(0,0,0,.56),0 0 0 1px rgba(255,255,255,.025) inset!important;
    backdrop-filter:blur(16px)!important;
    -webkit-backdrop-filter:blur(16px)!important;
  }
  #playstylesPanel .ps-page-k6 #psHoverDetail.active{
    display:block!important;
    visibility:visible!important;
  }
  #playstylesPanel .ps-page-k6 #psHoverDetail .ps-hover-detail-inner{padding:17px 18px 16px!important}
}
@media(max-width:1000px){
  #playstylesPanel .ps-page-k6 .ps-library-stats{position:static!important}
}

/* === SOURCE: css/024-facility-header-v4612.css === */

body.facility-drawer-open .facility-selector-head{align-items:center!important;justify-content:space-between!important;padding:14px 18px 4px!important;gap:10px!important;}
body.facility-drawer-open .facility-selector-head h3{margin:0!important;color:#eef2f5!important;font-size:26px!important;line-height:1.1!important;font-weight:800!important;letter-spacing:-.02em!important;}
body.facility-drawer-open .facility-selector-head p{margin:6px 0 0!important;color:rgba(232,238,244,.60)!important;font-size:14px!important;line-height:1.35!important;font-weight:500!important;}
body.facility-drawer-open .facility-drawer-close{width:34px!important;height:34px!important;border:0!important;background:transparent!important;color:rgba(205,214,224,.72)!important;font-size:22px!important;line-height:1!important;cursor:pointer!important;border-radius:10px!important;}
body.facility-drawer-open .facility-drawer-close:hover{background:rgba(255,255,255,.04)!important;color:#f1f5f8!important;}
body.facility-drawer-open .facility-selector-tools{display:grid!important;grid-template-columns:minmax(340px,1fr) minmax(320px,.82fr)!important;gap:16px!important;padding:4px 18px 12px!important;border-bottom:1px solid rgba(255,255,255,.065)!important;align-items:center!important;}
body.facility-drawer-open .facility-selector-meter{display:grid!important;grid-template-columns:1fr auto!important;align-items:center!important;gap:14px!important;}
body.facility-drawer-open .facility-selector-meter .facility-budget-rail{margin:0!important;height:8px!important;}
body.facility-drawer-open .facility-selector-meter strong{display:flex!important;align-items:baseline!important;justify-content:flex-end!important;gap:7px!important;min-width:122px!important;text-align:right!important;color:#dbe2e9!important;}
body.facility-drawer-open .facility-selector-meter strong span{font-size:13px!important;line-height:1!important;font-weight:600!important;color:rgba(224,231,238,.66)!important;}
body.facility-drawer-open .facility-selector-meter strong em{font-style:normal!important;font-size:20px!important;line-height:1!important;font-weight:700!important;color:inherit!important;letter-spacing:-.01em!important;}
body.facility-drawer-open .facility-selector-tools .facility-search{margin:0!important;height:42px!important;border:1px solid rgba(255,255,255,.08)!important;border-radius:14px!important;background:rgba(8,14,20,.92)!important;color:#dce3ea!important;padding:0 16px!important;font:500 16px/1 inherit!important;outline:none!important;}
body.facility-drawer-open .facility-selector-tools .facility-search::placeholder{color:rgba(219,226,234,.45)!important;}
body.facility-drawer-open .facility-selector-tools .facility-search:focus{border-color:rgba(215,181,90,.28)!important;box-shadow:0 0 0 1px rgba(215,181,90,.10) inset!important;}
@media(max-width:900px){
  body.facility-drawer-open .facility-selector-head{padding:14px 16px 4px!important;}
  body.facility-drawer-open .facility-selector-head h3{font-size:24px!important;}
  body.facility-drawer-open .facility-selector-head p{font-size:13px!important;line-height:1.38!important;margin-top:9px!important;}
  body.facility-drawer-open .facility-selector-tools{grid-template-columns:1fr!important;gap:12px!important;padding:4px 16px 12px!important;}
  body.facility-drawer-open .facility-selector-meter strong{justify-content:flex-start!important;min-width:0!important;}
}

/* === SOURCE: css/025-facility-header-v4613.css === */

body.facility-drawer-open .facility-selector-head{align-items:center!important;justify-content:space-between!important;padding:18px 18px 6px!important;gap:10px!important;}
body.facility-drawer-open .facility-selector-head h3{margin:0!important;color:#eef2f5!important;font-size:24px!important;line-height:1.12!important;font-weight:750!important;letter-spacing:-.018em!important;}
body.facility-drawer-open .facility-selector-head p{margin:10px 0 0!important;color:rgba(228,235,241,.62)!important;font-size:14px!important;line-height:1.4!important;font-weight:520!important;}
body.facility-drawer-open .facility-drawer-close{width:32px!important;height:32px!important;background:transparent!important;color:rgba(202,211,220,.68)!important;font-size:21px!important;border-radius:10px!important;}
body.facility-drawer-open .facility-drawer-close:hover{background:rgba(255,255,255,.035)!important;color:#eef3f7!important;}
body.facility-drawer-open .facility-selector-tools{display:grid!important;grid-template-columns:minmax(420px,1.08fr) minmax(300px,.86fr)!important;gap:14px!important;padding:2px 18px 10px!important;border-bottom:1px solid rgba(255,255,255,.06)!important;align-items:center!important;}
body.facility-drawer-open .facility-selector-meter{display:grid!important;grid-template-columns:1fr auto!important;align-items:center!important;gap:12px!important;}
body.facility-drawer-open .facility-selector-meter .facility-budget-rail{margin:0!important;height:9px!important;filter:saturate(.96)!important;}
body.facility-drawer-open .facility-selector-meter strong{display:flex!important;align-items:baseline!important;justify-content:flex-end!important;gap:8px!important;min-width:118px!important;text-align:right!important;color:#dbe2e9!important;margin-right:2px!important;}
body.facility-drawer-open .facility-selector-meter strong span{font-size:12px!important;line-height:1!important;font-weight:600!important;color:rgba(224,231,238,.58)!important;letter-spacing:.01em!important;}
body.facility-drawer-open .facility-selector-meter strong em{font-style:normal!important;font-size:19px!important;line-height:1!important;font-weight:700!important;color:inherit!important;letter-spacing:-.01em!important;}
body.facility-drawer-open .facility-selector-tools .facility-search{margin:0!important;height:38px!important;border:1px solid rgba(255,255,255,.075)!important;border-radius:14px!important;background:rgba(8,14,20,.9)!important;color:#dce3ea!important;padding:0 16px!important;font-size:15px!important;line-height:1!important;font-weight:500!important;outline:none!important;}
body.facility-drawer-open .facility-selector-tools .facility-search::placeholder{color:rgba(219,226,234,.40)!important;font-size:15px!important;}
body.facility-drawer-open .facility-selector-tools .facility-search:focus{border-color:rgba(215,181,90,.24)!important;box-shadow:0 0 0 1px rgba(215,181,90,.08) inset!important;}
body.facility-drawer-open #facilityToast{bottom:20px!important;}
@media(max-width:900px){
  body.facility-drawer-open .facility-selector-head{padding:16px 16px 6px!important;}
  body.facility-drawer-open .facility-selector-head h3{font-size:22px!important;}
  body.facility-drawer-open .facility-selector-head p{font-size:13px!important;line-height:1.38!important;margin-top:9px!important;}
  body.facility-drawer-open .facility-selector-tools{grid-template-columns:1fr!important;gap:10px!important;padding:2px 16px 10px!important;}
  body.facility-drawer-open .facility-selector-meter strong{justify-content:flex-start!important;min-width:0!important;}
}

/* === SOURCE: css/026-v553-attributes-workspace-uplift-preview.css === */

/* v5.5.3 · Attribute-page-only workspace uplift preview.
   Compress the non-interactive chrome so the first editable controls start higher.
   Scoped to attributes-workspace-compact so reverting is one file/version away. */
@media (min-width:761px){
  body.attributes-workspace-compact .shell{
    padding-top:12px!important;
  }
  body.attributes-workspace-compact .topbar{
    min-height:36px!important;
    margin-bottom:10px!important;
    align-items:center!important;
  }
  body.attributes-workspace-compact .topbar>div:first-child{
    display:flex!important;
    align-items:center!important;
    gap:12px!important;
    min-width:0!important;
  }
  body.attributes-workspace-compact .topbar .eyebrow,
  body.attributes-workspace-compact .topbar .subtitle{
    display:none!important;
  }
  body.attributes-workspace-compact .topbar h1{
    font-size:24px!important;
    line-height:1!important;
    letter-spacing:-.025em!important;
    white-space:nowrap!important;
  }
  body.attributes-workspace-compact .topbar .version{
    padding:5px 9px!important;
    font-size:9px!important;
    opacity:.72!important;
  }

  body.attributes-workspace-compact .editor-view-tabs{
    min-height:48px!important;
    margin:0 0 9px!important;
    padding:0 10px!important;
    border-radius:14px!important;
  }
  body.attributes-workspace-compact .editor-view-tab{
    min-height:48px!important;
    padding:0 13px!important;
    font-size:13px!important;
  }
  body.attributes-workspace-compact .editor-view-tab.active::after{
    left:13px!important;
    right:13px!important;
  }
  body.attributes-workspace-compact .editor-view-sep{
    line-height:48px!important;
    font-size:13px!important;
  }

  body.attributes-workspace-compact .attribute-tools{
    margin-bottom:8px!important;
    gap:8px!important;
  }
  body.attributes-workspace-compact .view-switch-row{
    min-height:46px!important;
    padding:0 13px!important;
    border-radius:13px!important;
  }
  body.attributes-workspace-compact .tool-title{
    font-size:12px!important;
  }
  body.attributes-workspace-compact .cost-help{
    border-radius:13px!important;
  }
  body.attributes-workspace-compact .cost-help>summary{
    min-height:46px!important;
    padding:0 13px!important;
  }
  body.attributes-workspace-compact .ios-switch{
    width:40px!important;
    height:24px!important;
  }

  /* Keep the global Archetype Overview aligned with the higher workspace start. */
  body.attributes-workspace-compact .global-archetype-overview-card{
    top:12px!important;
  }
}

/* === SOURCE: css/027-v555-balanced-branded-header.css === */

/* v5.5.5 · restore a useful branded masthead without returning to the oversized intro header. */
@media (min-width:761px){
  .shell{padding-top:12px!important;}
  .topbar{
    min-height:60px!important;
    height:60px!important;
    margin-bottom:8px!important;
    padding:5px 4px 7px!important;
    align-items:center!important;
    border-bottom:1px solid rgba(255,255,255,.055)!important;
  }
  .topbar>.site-brand{
    display:flex!important;
    align-items:center!important;
    gap:13px!important;
    min-width:0!important;
  }
  .site-logo{
    display:block!important;
    width:112px!important;
    height:38px!important;
    object-fit:contain!important;
    flex:0 0 auto!important;
    opacity:.96!important;
  }
  .site-brand-copy{
    min-width:0!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    gap:3px!important;
  }
  .topbar .eyebrow{
    display:block!important;
    margin:0!important;
    color:#74684d!important;
    font-size:7px!important;
    font-weight:820!important;
    letter-spacing:.16em!important;
    line-height:1!important;
    white-space:nowrap!important;
  }
  .topbar h1{
    margin:0!important;
    font-size:20px!important;
    line-height:1.05!important;
    letter-spacing:-.02em!important;
  }
  .topbar .subtitle{display:none!important;}
  .topbar .version{
    padding:5px 8px!important;
    font-size:8px!important;
    line-height:1!important;
  }
  .editor-view-tabs{
    min-height:43px!important;
    height:43px!important;
    margin-bottom:6px!important;
  }
}
@media (min-width:761px) and (max-height:800px){
  .topbar{min-height:54px!important;height:54px!important;padding-top:3px!important;padding-bottom:5px!important;margin-bottom:6px!important;}
  .site-logo{width:100px!important;height:34px!important;}
  .topbar h1{font-size:18px!important;}
}

/* === SOURCE: css/028-v5570-critical-first-paint.css === */

/* Critical first-paint guard.
   This file has many late override styles/scripts; do not expose intermediate
   legacy DOM while the parser is still working through the single-file bundle. */
html.fc27-booting,
html.fc27-booting body{
  background:#070b10!important;
}
html.fc27-booting .shell{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
html.fc27-boot-ready .shell{
  animation:fc27BootReveal .14s ease-out both;
}
@keyframes fc27BootReveal{
  from{opacity:0}
  to{opacity:1}
}