/* NOUWA STUDIO — Stage 7: Specialized Teams · Quality Score · Extended Smart Actions
   All premium card formats. No boring reports. Distinct per mission.        */

/* ============== SPECIALIZED TEAM BOARD ============== */
.team-board{margin-top:14px;animation:ghostin calc(.55s*var(--mt)) both;}
.team-board .tb-head{display:flex;align-items:flex-start;gap:12px;margin-bottom:14px;}
.team-board .tb-head .ico-hex{width:30px;height:30px;flex:none;display:grid;place-items:center;
  background:var(--ink);color:#fff;border-radius:8px;}
.team-board .tb-head .ico-hex svg{width:18px;height:18px;}
.team-board .tb-head .lbl{font-size:10.5px;font-weight:700;letter-spacing:.18em;color:var(--ink3);
  text-transform:uppercase;margin-bottom:3px;display:flex;align-items:center;gap:8px;}
.team-board .tb-head .lbl .count{background:var(--ink);color:#fff;font-size:9.5px;
  padding:2px 7px;border-radius:5px;letter-spacing:.06em;font-feature-settings:"tnum";}
.team-board .tb-head .ttl{font-size:14.5px;font-weight:600;line-height:1.35;color:var(--ink);max-width:480px;}
.team-board .tb-head .spc{flex:1;}
.team-board .tb-head .meta{font-size:11px;color:var(--ink3);text-align:end;padding-top:3px;}
.team-board .tb-head .meta b{color:var(--ink);font-weight:600;}

.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;}
@media (max-width:1080px){ .team-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:680px){  .team-grid{grid-template-columns:1fr;} }

.specialist{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:12px;
  padding:13px 14px;display:flex;gap:11px;align-items:flex-start;transition:all .18s;
  animation:taskin calc(.45s*var(--mt)) both;overflow:hidden;}
.specialist:hover{border-color:var(--border2);box-shadow:var(--shadow-s);transform:translateY(-2px);}
.specialist::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--ink3);
  opacity:.7;transition:opacity .18s;}
.specialist:hover::before{opacity:1;}
.specialist.c-red::before    {background:var(--red);}
.specialist.c-violet::before {background:var(--violet);}
.specialist.c-indigo::before {background:var(--indigo);}
.specialist.c-teal::before   {background:var(--teal);}
.specialist.c-amber::before  {background:#D97706;}
.specialist.c-ink::before    {background:var(--ink);}

.specialist .gl{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;font-size:15px;
  font-weight:700;flex:none;background:var(--canvas);color:var(--ink2);border:1px solid var(--border);}
.specialist.c-red    .gl{background:rgba(244,80,76,.10);color:var(--red);border-color:transparent;}
.specialist.c-violet .gl{background:rgba(124,58,237,.10);color:var(--violet);border-color:transparent;}
.specialist.c-indigo .gl{background:rgba(67,56,202,.10);color:var(--indigo);border-color:transparent;}
.specialist.c-teal   .gl{background:rgba(14,148,132,.10);color:var(--teal);border-color:transparent;}
.specialist.c-amber  .gl{background:rgba(217,119,6,.10);color:#B45309;border-color:transparent;}
.specialist.c-ink    .gl{background:#0F0E26;color:#fff;border-color:transparent;}

.specialist .body{flex:1;min-width:0;}
.specialist .role{font-size:12.5px;font-weight:600;line-height:1.25;letter-spacing:-.003em;color:var(--ink);}
.specialist .sp{font-size:11px;color:var(--ink2);line-height:1.5;margin-top:5px;}

/* "Assembled for you" subtitle in team-board */
.team-board-foot{margin-top:10px;display:flex;align-items:center;gap:10px;padding:9px 13px;border-radius:9px;
  background:linear-gradient(180deg,#FFFFFF 0%,#F5F3FD 100%);border:1px solid var(--border);}
.team-board-foot .rd{flex:none;}
.team-board-foot .sub{font-size:12px;color:var(--ink2);line-height:1.5;flex:1;}
.team-board-foot .sub em{font-style:normal;font-weight:600;color:var(--ink);}

/* ============== SPECIALIST TRACK · compact right-side column ============== */
.specialist-track{position:fixed;top:108px;right:24px;width:236px;
  background:var(--surface);border:1px solid var(--border);border-radius:14px;
  padding:12px 11px 11px;box-shadow:var(--shadow-s);z-index:4;
  animation:ghostin .55s ease both;max-height:calc(100vh - 140px);overflow-y:auto;}
.specialist-track .st-head{display:flex;align-items:center;gap:9px;padding:2px 4px 9px;
  border-bottom:1px solid var(--border);margin-bottom:8px;}
.specialist-track .st-head .ico-hex{width:22px;height:22px;flex:none;display:grid;place-items:center;
  background:var(--ink);border-radius:6px;}
.specialist-track .st-head .ico-hex svg{width:14px;height:14px;}
.specialist-track .st-head .meta{flex:1;min-width:0;}
.specialist-track .st-head .lbl{font-size:9.5px;font-weight:700;letter-spacing:.18em;
  color:var(--ink3);text-transform:uppercase;line-height:1;}
.specialist-track .st-head .count{font-size:11px;font-weight:600;color:var(--ink);
  margin-top:2px;font-feature-settings:"tnum";}
.specialist-track .st-list{display:flex;flex-direction:column;gap:1px;}
.specialist-track .st-mem{display:flex;align-items:center;gap:9px;padding:7px 7px;
  border-radius:8px;transition:all .35s cubic-bezier(.4,0,.2,1);}
.specialist-track .st-mem .gl{width:24px;height:24px;border-radius:6px;display:grid;
  place-items:center;font-size:11px;font-weight:700;background:var(--canvas);
  color:var(--ink3);border:1px solid var(--border);flex:none;
  transition:all .3s ease;}
.specialist-track .st-mem .body{flex:1;min-width:0;}
.specialist-track .st-mem .role{font-size:11.5px;font-weight:500;color:var(--ink2);
  line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.specialist-track .st-mem .status{font-size:9.5px;font-weight:500;color:var(--ink3);
  margin-top:1px;letter-spacing:.04em;}
.specialist-track .st-mem .dot{width:14px;height:14px;border-radius:50%;
  display:grid;place-items:center;flex:none;}
.specialist-track .st-mem .dot.idle{width:5px;height:5px;background:var(--border2);}
.specialist-track .st-mem .dot.ok{background:var(--teal);color:#fff;}
.specialist-track .st-mem .dot.pulse{background:rgba(244,80,76,.14);}
.specialist-track .st-mem .dot.pulse .rednode{box-shadow:0 0 0 3px rgba(244,80,76,.20);}

/* idle: very subtle */
.specialist-track .st-mem.idle{opacity:.36;}
.specialist-track .st-mem.idle .status{color:var(--ink3);}

/* active: highlighted */
.specialist-track .st-mem.active{background:var(--canvas);}
.specialist-track .st-mem.active .role{color:var(--ink);font-weight:600;}
.specialist-track .st-mem.active .status{color:var(--red);font-weight:600;}
.specialist-track .st-mem.active .gl{background:rgba(244,80,76,.10);color:var(--red);border-color:transparent;}

/* done: muted but visible */
.specialist-track .st-mem.done{opacity:.82;}
.specialist-track .st-mem.done .status{color:var(--teal);font-weight:600;}
.specialist-track .st-mem.done .gl{background:var(--teal-tint);color:var(--teal);border-color:transparent;}

/* color accents preserved on glyph background */
.specialist-track .st-mem.active.c-violet .gl{background:rgba(124,58,237,.10);color:var(--violet);}
.specialist-track .st-mem.active.c-indigo .gl{background:rgba(67,56,202,.10);color:var(--indigo);}
.specialist-track .st-mem.active.c-amber  .gl{background:rgba(217,119,6,.10);color:#B45309;}
.specialist-track .st-mem.active.c-teal   .gl{background:rgba(14,148,132,.10);color:var(--teal);}
.specialist-track .st-mem.active.c-ink    .gl{background:#0F0E26;color:#fff;}

/* Hide on smaller screens — content needs the room */
@media (max-width:1180px){
  .specialist-track{display:none;}
}

.theme-dark .specialist-track{background:var(--surface);border-color:var(--border);}
.theme-dark .specialist-track .st-mem.active{background:#1B1846;}
.theme-dark .specialist-track .st-mem .gl{background:#1B1846;border-color:var(--border);}

/* ============== QUALITY SCORE CARDS ============== */
.quality-card{margin-top:20px;background:var(--surface);border:1px solid var(--border);border-radius:18px;
  padding:24px 26px;box-shadow:var(--shadow-s);max-width:880px;margin-inline:auto;
  animation:ghostin calc(.6s*var(--mt)) both;}
.quality-head{display:flex;align-items:center;gap:13px;margin-bottom:18px;}
.quality-head .ico{width:34px;height:34px;border-radius:10px;background:var(--grad);color:#fff;
  display:grid;place-items:center;flex:none;}
.quality-head .ttl{font-size:14.5px;font-weight:600;line-height:1.2;}
.quality-head .sd{font-size:11.5px;color:var(--ink3);margin-top:3px;display:inline-flex;align-items:center;gap:7px;}
.quality-head .spc{flex:1;}
.quality-head .total{display:flex;align-items:baseline;gap:5px;}
.quality-head .total .num{font-size:32px;font-weight:600;letter-spacing:-.018em;line-height:1;font-feature-settings:"tnum";}
.quality-head .total .max{font-size:14px;color:var(--ink3);font-weight:500;}
.quality-head .grade{display:inline-flex;align-items:center;gap:6px;background:var(--tint);color:var(--indigo);
  padding:4px 11px;border-radius:999px;font-size:10.5px;font-weight:600;letter-spacing:.12em;
  text-transform:uppercase;margin-inline-start:10px;}

.quality-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;}
@media (max-width:980px){ .quality-grid{grid-template-columns:repeat(3,1fr);} }
@media (max-width:600px){ .quality-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:400px){ .quality-grid{grid-template-columns:1fr;} }

.qscore{padding:14px 14px 13px;background:var(--canvas);border:1px solid var(--border);border-radius:12px;
  position:relative;overflow:hidden;}
.qscore .ax{font-size:9.5px;font-weight:700;letter-spacing:.14em;color:var(--ink3);text-transform:uppercase;}
.qscore .v{font-size:24px;font-weight:600;letter-spacing:-.018em;margin-top:5px;line-height:1;font-feature-settings:"tnum";}
.qscore .v small{font-size:10.5px;color:var(--ink3);font-weight:500;letter-spacing:0;}
.qscore .bar{height:4px;background:var(--border2);border-radius:99px;margin-top:9px;overflow:hidden;}
.qscore .bar i{display:block;height:100%;background:var(--grad);border-radius:99px;transition:width .55s ease;}
.qscore .why{font-size:10.5px;color:var(--ink2);line-height:1.5;margin-top:9px;}
.qscore.tier-high  .v{color:var(--teal);}
.qscore.tier-mid   .v{color:#B45309;}
.qscore.tier-low   .v{color:var(--red);}
.qscore.tier-high  .bar i{background:linear-gradient(90deg,#0E9484,#14B8A6);}
.qscore.tier-mid   .bar i{background:linear-gradient(90deg,#D97706,#F59E0B);}
.qscore.tier-low   .bar i{background:linear-gradient(90deg,#F4504C,#DC2626);}

.quality-actions{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px;padding-top:14px;border-top:1px dashed var(--border);}
.quality-actions .q-act{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:500;
  color:var(--ink2);background:var(--canvas);border:1px solid var(--border);padding:6px 11px;border-radius:999px;cursor:pointer;}
.quality-actions .q-act:hover{border-color:var(--violet);color:var(--indigo);}
.quality-actions .q-act .rednode{margin-inline-end:2px;}

/* ============== EXTENDED SMART ACTIONS (more options) ============== */
.smart-toolbar.extended{padding:6px 7px;flex-wrap:wrap;max-width:520px;}
.smart-toolbar .smart-group{display:inline-flex;align-items:center;gap:2px;}
.smart-toolbar .smart-act.premium{position:relative;}
.smart-toolbar .smart-act.premium::after{content:"";position:absolute;top:3px;inset-inline-end:3px;
  width:5px;height:5px;border-radius:50%;background:#FDE68A;}

/* ============== MISSION TEAMS section — expressive background ============== */
#teams{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(900px 540px at 12% 18%, rgba(124,58,237,.14), transparent 60%),
    radial-gradient(820px 520px at 88% 78%, rgba(67,56,202,.12), transparent 60%),
    radial-gradient(640px 400px at 50% 95%, rgba(244,80,76,.08), transparent 60%),
    linear-gradient(180deg, #F5F3FD 0%, #FAF8FE 50%, #EFEBFA 100%);
}
/* decorative hex grid (drawn via CSS, no image needed) */
#teams::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:0;
  background-image:
    radial-gradient(circle at 1px 1px, rgba(67,56,202,.10) 1px, transparent 0);
  background-size:32px 32px;
  mask-image:radial-gradient(ellipse at center, #000 0%, transparent 75%);
  -webkit-mask-image:radial-gradient(ellipse at center, #000 0%, transparent 75%);
  opacity:.55;
}
/* large hexagons floating in the background corners */
#teams::after{
  content:"";
  position:absolute;
  pointer-events:none;
  z-index:0;
  inset-block-start:8%;
  inset-inline-end:-6%;
  width:380px;
  height:380px;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><defs><linearGradient id='g' x1='0' y1='0' x2='1' y2='1'><stop offset='0' stop-color='%237C3AED' stop-opacity='.35'/><stop offset='1' stop-color='%234338CA' stop-opacity='.35'/></linearGradient></defs><polygon points='50,5 89,27.5 89,72.5 50,95 11,72.5 11,27.5' fill='none' stroke='url(%23g)' stroke-width='1.4' stroke-linejoin='round'/><circle cx='50' cy='50' r='3.5' fill='%23F4504C' opacity='.45'/></svg>") no-repeat center/contain;
  transform:rotate(15deg);
  opacity:.55;
  filter:blur(.3px);
}
#teams .wrap{position:relative;z-index:1;}
#teams .sect-head h2{color:var(--ink);}
#teams .sect-head p{color:var(--ink2);}

/* ============== TEAMS-TEASER on landing page ============== */
.teams-teaser{background:var(--surface);border:1px solid var(--border);border-radius:18px;padding:30px 32px;
  margin-top:30px;
  box-shadow:0 30px 80px rgba(67,56,202,.10), 0 6px 18px rgba(15,14,38,.04);}
.teams-teaser .tt-head{display:flex;align-items:flex-start;gap:18px;margin-bottom:24px;flex-wrap:wrap;}
.teams-teaser .tt-head h3{font-size:22px;font-weight:600;letter-spacing:-.014em;margin:0;line-height:1.25;}
.teams-teaser .tt-head p{font-size:14px;color:var(--ink2);line-height:1.55;margin:8px 0 0;max-width:520px;}
.teams-teaser .tt-pill-row{display:flex;flex-wrap:wrap;gap:7px;}
.teams-teaser .tt-pill{font-size:11px;font-weight:600;letter-spacing:.04em;padding:5px 11px;border-radius:999px;
  background:var(--canvas);border:1px solid var(--border);color:var(--ink2);cursor:pointer;transition:all .15s;}
.teams-teaser .tt-pill:hover{border-color:var(--border2);color:var(--ink);}
.teams-teaser .tt-pill.active{background:var(--ink);color:#fff;border-color:transparent;}

.teams-stage{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;}
@media (max-width:980px){ .teams-stage{grid-template-columns:repeat(2,1fr);} }
@media (max-width:560px){ .teams-stage{grid-template-columns:1fr;} }

.teams-teaser .tt-foot{display:flex;align-items:center;justify-content:space-between;margin-top:22px;
  padding-top:22px;border-top:1px solid var(--border);}
.teams-teaser .tt-foot .lbl{font-size:12px;color:var(--ink3);}
.teams-teaser .tt-foot .lbl b{color:var(--ink);font-weight:600;}

/* ============== DARK MODE OVERRIDES ============== */
.theme-dark .specialist,.theme-dark .qscore{background:#1B1846;border-color:var(--border);}
.theme-dark .quality-card,.theme-dark .team-board-foot,
.theme-dark .teams-teaser{background:var(--surface);border-color:var(--border);}
.theme-dark .teams-teaser .tt-pill{background:#1B1846;border-color:var(--border);color:var(--ink2);}
.theme-dark .teams-teaser .tt-pill.active{background:var(--violet);}
.theme-dark .team-board-foot{background:linear-gradient(180deg,#17153A 0%,#1B1846 100%);border-color:var(--border);}
.theme-dark .specialist.c-ink .gl{background:#FAFAFA;color:#17153A;}