:root{--network-tone-0:#f9905a;}
.network-shell {
  max-width: 1320px;
  margin: 0 auto;
  padding: 30px 44px 60px;
}
.network-next {
  margin: 24px 0;
  padding: 18px 20px;
  background: linear-gradient(120deg, color-mix(in srgb, var(--accent) 8.24%, transparent), color-mix(in srgb, var(--accent) 1.57%, transparent));
  border: 1px solid color-mix(in srgb, var(--accent) 13.33%, transparent);
  border-radius: 16px;
}
.network-next small {
  color: var(--accent-light);
  font-size: 10px;
  letter-spacing: 0.14em;
}
.network-next p {
  margin: 7px 0 0;
  color: var(--text);
}
.network-attention {
  margin-bottom: 36px;
  padding: 24px;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: var(--surface);
}
[data-upload-progress] {
  color: var(--accent-light);
  min-height: 1.5em;
}
.network-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding-bottom: 28px;
  border-bottom: 1px solid var(--line);
}
.network-logo {
  width: 144px;
  display: block;
}
.network-header nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.network-header button.active {
  color: var(--accent-light);
  background: color-mix(in srgb, var(--accent) 9.41%, transparent);
  border-color: color-mix(in srgb, var(--accent) 18.82%, transparent);
}
.network-intro {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 32px;
  margin: 60px 0 36px;
}
.network-intro h1 {
  font-size: clamp(36px, 4.5vw, 62px);
  line-height: 1.05;
  letter-spacing: -0.055em;
  margin: 16px 0 20px;
  max-width: 780px;
}
.network-intro p {
  color: var(--muted);
  line-height: 1.7;
  max-width: 640px;
}
.network-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 36px;
}
.network-metrics article {
  border: 1px solid var(--line);
  border-radius: 20px;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--accent) 5.49%, transparent), transparent 70%), var(--surface);
  padding: 24px;
}
.network-metrics b {
  display: block;
  font-size: 40px;
  font-weight: 600;
  letter-spacing: -1.5px;
  margin-bottom: 12px;
}
.network-metrics span {
  color: var(--muted);
  font-size: 13px;
}
.network-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}
.network-card {
  padding: 30px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: var(--surface);
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.network-card h2 {
  margin: 0;
  font-size: 24px;
  letter-spacing: -0.8px;
  line-height: 1.25;
}
.network-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.65;
}
.network-card .actions {
  margin-top: auto;
  flex-wrap: wrap;
}
.network-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.network-facts small {
  display: block;
  color: var(--muted);
  margin-bottom: 6px;
  font-size: 11px;
}
.network-payout {
  font-size: 26px;
  color: var(--accent-light);
  font-weight: 600;
  letter-spacing: -0.8px;
}
.network-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.network-dialog {
  width: min(760px, calc(100vw - 32px));
  max-width: 760px;
  padding: 34px;
}
.network-dialog h2 {
  font-size: 30px;
  letter-spacing: -1px;
  margin: 0 40px 22px 0;
}
.network-dialog h3 {
  margin: 28px 0 14px;
}
.network-dialog .close {
  position: absolute;
  right: 18px;
  top: 18px;
}
.network-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px 18px;
}
.network-match {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 18px 0;
  border-bottom: 1px solid var(--line);
}
.network-match p {
  color: var(--muted);
  font-size: 13px;
  line-height: 1.6;
}
.network-event {
  border-left: 2px solid color-mix(in srgb, var(--accent) 25.10%, transparent);
  padding: 2px 0 2px 18px;
  margin: 18px 0;
}
.network-event small {
  color: var(--muted);
}
.network-event p {
  white-space: pre-wrap;
  line-height: 1.6;
}
.network-banner {
  padding: 20px 24px;
  margin: 26px 0;
  border: 1px solid color-mix(in srgb, var(--accent) 12.55%, transparent);
  border-radius: 16px;
  color: var(--muted);
  line-height: 1.7;
  background: color-mix(in srgb, var(--accent) 2.35%, transparent);
}
.network-profile {
  max-width: 850px;
}
.network-footer {
  color: var(--muted);
  font-size: 11px;
  margin-top: 42px;
  padding-top: 24px;
  border-top: 1px solid var(--line);
  line-height: 1.8;
}
.network-text {
  white-space: pre-wrap;
  line-height: 1.75;
}
@media (max-width: 800px) {
  .network-shell {
    padding: 24px 20px 40px;
  }
  .network-header,
  .network-intro {
    flex-direction: column;
    align-items: flex-start;
  }
  .network-intro {
    margin: 38px 0 28px;
    gap: 14px;
  }
  .network-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .network-grid {
    grid-template-columns: 1fr;
  }
  .network-card {
    padding: 24px;
  }
  .network-dialog {
    padding: 26px 22px;
  }
}
@media (max-width: 500px) {
  .network-form-grid {
    grid-template-columns: 1fr;
  }
  .network-header nav {
    gap: 6px;
  }
  .network-header button {
    padding: 10px 13px;
  }
  .network-match {
    flex-direction: column;
    align-items: flex-start;
  }
}

.network-header a.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #ffffff02;
  color: var(--text);
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  transition:
    border-color 0.2s,
    background 0.2s;
}
.network-header a.button:hover {
  background: color-mix(in srgb, var(--accent) 7.06%, transparent);
  border-color: color-mix(in srgb, var(--accent) 18.82%, transparent);
}

.job-journey {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  list-style: none;
  padding: 0;
  margin: 24px 0 32px;
}
.job-journey li {
  display: flex;
  flex-direction: column;
  gap: 10px;
  color: var(--muted);
  font-size: 11px;
  border-top: 2px solid var(--line);
  padding-top: 12px;
}
.job-journey li span {
  font-weight: 700;
  font-size: 17px;
}
.job-journey .done,
.job-journey .current {
  border-color: var(--accent);
  color: var(--text);
}
.job-journey .current span {
  color: var(--network-tone-0);
}
.job-history {
  margin: 28px 0;
  border-top: 1px solid var(--line);
  padding-top: 18px;
}
.job-history summary {
  cursor: pointer;
  color: var(--muted);
  font-size: 13px;
}
@media (max-width: 500px) {
  .job-journey {
    gap: 5px;
  }
  .job-journey li {
    font-size: 10px;
  }
}
.creator-guide {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 28px;
  padding: 30px;
  margin: 24px 0 32px;
  border: 1px solid color-mix(in srgb, var(--accent) 20.00%, transparent);
  border-radius: 22px;
  background:
    radial-gradient(ellipse at 0 0, color-mix(in srgb, var(--accent) 7.84%, transparent), transparent 70%), #ffffff03;
}
.creator-guide small {
  font-size: 10px;
  letter-spacing: 0.14em;
  color: var(--network-tone-0);
}
.creator-guide h2 {
  margin: 10px 0;
  font-size: clamp(22px, 2.6vw, 32px);
  letter-spacing: -0.04em;
}
.creator-guide p {
  max-width: 620px;
  color: var(--muted);
  line-height: 1.6;
  margin: 0;
}
.creator-guide button {
  flex-shrink: 0;
}
@media (max-width: 650px) {
  .creator-guide {
    flex-direction: column;
    align-items: flex-start;
    padding: 24px;
    gap: 20px;
  }
}

.creator-tabs{display:flex;gap:8px;margin:32px 0 24px;flex-wrap:wrap}.creator-tabs button{display:flex;align-items:center;gap:16px;padding:14px 22px;border:1px solid var(--line);border-radius:14px}.creator-tabs button.active{background:linear-gradient(135deg,color-mix(in srgb, var(--accent) 18%, transparent),color-mix(in srgb, var(--accent) 4%, transparent));border-color:color-mix(in srgb, var(--accent) 35%, transparent)}.creator-tabs span{font-size:11px;color:var(--muted)}.creator-profile-summary{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:30px;margin-bottom:24px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(135deg,color-mix(in srgb, var(--accent) 10%, transparent),transparent)}.creator-profile-summary h2{margin:12px 0;font-size:28px;letter-spacing:-.035em}.profile-step{display:flex;gap:14px;align-items:center;margin:36px 0 22px;font-size:20px}.profile-step span{font-size:11px;color:var(--accent)}.rubric-note,.review-rubric{padding:22px;border:1px solid var(--line);border-radius:16px;color:var(--muted);line-height:1.8;margin:20px 0}.review-rubric summary{color:var(--text);cursor:pointer}.network-profile textarea{min-height:110px}.network-dialog .actions{gap:12px}.network-dialog .network-text{line-height:1.8}
@media(max-width:600px){.creator-tabs{display:grid;grid-template-columns:1fr;width:100%}.creator-tabs button{justify-content:space-between}.creator-profile-summary{align-items:flex-start;flex-direction:column;padding:22px}.profile-step{font-size:18px}.review-rubric{padding:18px}}

:root[data-workspace="team"]{--network-tone-0:rgba(106,149,233,1.000);}

.creator-current{padding:22px!important;border:1px solid rgba(255,255,255,.1);border-radius:18px;background:linear-gradient(135deg,rgba(255,255,255,.04),rgba(255,255,255,.01));margin:22px 0}.creator-current h3{font-size:clamp(22px,3vw,30px);letter-spacing:-.04em;margin:10px 0}.creator-current p{line-height:1.65;font-size:14px}.creator-current small{font-size:10px;letter-spacing:.14em}

/* One assignment, one calm surface. */
.creator-job-dialog{width:min(820px,calc(100vw - 32px));max-width:820px}
.creator-job-summary{padding:24px;border-radius:20px;background:radial-gradient(ellipse at 100% 0,rgba(185,72,20,.13),transparent 65%),rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.09);margin:20px 0}
.creator-job-summary .network-payout{font-size:28px;letter-spacing:-.04em;color:#e6b38e}
.creator-scope{border-top:1px solid rgba(255,255,255,.08);padding-top:18px;margin-top:18px}
.creator-current{padding:24px!important;border-radius:20px;background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.08)}
.creator-current h3{font-size:26px;letter-spacing:-.035em;line-height:1.15;margin:10px 0}
.creator-job-section{padding:20px;border:1px solid rgba(255,255,255,.08);border-radius:16px;margin:16px 0;background:rgba(255,255,255,.015)}
.creator-job-section>summary{font-weight:600;font-size:15px;cursor:pointer;min-height:28px}
.creator-job-section[open]>summary{margin-bottom:18px}
.creator-job-dialog form{padding:22px;border:1px solid rgba(255,255,255,.1);border-radius:18px;margin:20px 0}
.creator-job-dialog .network-text{line-height:1.65}
.creator-job-dialog .job-journey{gap:8px;overflow-x:auto}
@media(max-width:600px){.creator-job-summary,.creator-current,.creator-job-section{padding:18px!important}.creator-job-dialog form{padding:16px}.creator-job-dialog .network-match{flex-wrap:wrap}.creator-job-dialog .button{white-space:normal;max-width:100%}.creator-current h3{font-size:24px}}

/* Keep account controls together and mobile navigation on one intentional row. */
.network-header{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center}
.network-header nav{justify-content:flex-end;min-width:0}
.network-account{display:flex;align-items:center;gap:8px;white-space:nowrap}
.network-account button,.network-account a.button{min-height:44px}
@media(max-width:800px){
 .network-header{grid-template-columns:minmax(0,1fr) auto;gap:20px 12px;padding-bottom:22px;align-items:center}
 .network-header>a{grid-column:1;grid-row:1}
 .network-account{grid-column:2;grid-row:1;gap:6px}
 .network-header nav{grid-column:1/-1;grid-row:2;justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto;padding:4px 2px;scrollbar-width:thin}
 .network-header nav>*{flex:1 0 auto;white-space:nowrap;min-height:44px}
 .network-logo{width:120px;max-width:100%}
 .network-account button,.network-account a.button{padding:10px 12px;font-size:12px}
}

@media(max-width:800px){
 .network-header nav .network-studio-return{display:none}
 .network-header nav>button{flex:1 1 0;min-width:0;padding:10px 7px;font-size:11px}
}

.network-dialog .actions>a.button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:12px 18px;border:1px solid var(--line);border-radius:12px;font-size:12px;font-weight:600;line-height:1.4;text-decoration:none;color:var(--text)}
.network-dialog .actions>a.button.primary{color:#fff;border-color:color-mix(in srgb,var(--accent) 35%,transparent);background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 24%,var(--surface)),color-mix(in srgb,var(--accent) 10%,var(--surface)))}
.network-dialog .actions>a.button:focus-visible{outline:2px solid var(--accent-light);outline-offset:3px}
.crew-plan{display:grid;gap:22px}.crew-plan-back{margin:0}.crew-plan-back .button{font-size:12px;padding:9px 13px}.crew-plan-summary{padding:24px;border:1px solid rgba(255,255,255,.1);border-radius:18px;background:linear-gradient(135deg,rgba(255,255,255,.045),rgba(255,255,255,.01))}.crew-plan-summary>h3{margin:8px 0 22px;font-size:24px;line-height:1.2}.crew-plan-summary dl{display:grid;grid-template-columns:1fr 1fr;gap:18px 24px;margin:0 0 20px}.crew-plan-summary dt{font-size:11px;color:#aaa;letter-spacing:.04em;margin-bottom:5px}.crew-plan-summary dd{margin:0;font-size:14px;line-height:1.5;overflow-wrap:anywhere}.crew-plan-summary>p{line-height:1.6}.crew-plan-summary>small{display:block;line-height:1.6}.crew-plan-instructions{padding:0 4px}.crew-plan-instructions h3{font-size:15px;margin:24px 0 8px}.crew-plan-instructions h3:first-child{margin-top:0}.crew-plan-instructions p{margin:0;line-height:1.7}.crew-plan .creator-job-section{margin:0}.crew-plan form{margin:0}.crew-plan>.network-banner{margin:0}@media(max-width:600px){.crew-plan{gap:20px}.crew-plan-summary{padding:18px}.crew-plan-summary>h3{font-size:21px}.crew-plan-summary dl{gap:16px}.crew-plan form .check{align-items:flex-start;line-height:1.5}.crew-plan form .check input{margin-top:4px;flex-shrink:0}}
.network-form-feedback{padding:14px 16px;margin:16px 0;border:1px solid rgba(255,160,135,.3);border-radius:12px;background:rgba(255,160,135,.06);color:#ffd4c9;font-size:13px;line-height:1.6;overflow-wrap:anywhere}.network-form-feedback:focus{outline:2px solid rgba(255,160,135,.5);outline-offset:3px}
.network-dialog form[data-form="upload"]{padding:24px;border:1px solid rgba(255,255,255,.1);border-radius:18px;background:rgba(255,255,255,.025)}.network-dialog form[data-form="upload"] h3{margin:0 0 20px;font-size:21px}.network-dialog #n-file{display:block;width:100%;min-width:0;box-sizing:border-box;padding:14px;border:1px dashed rgba(255,255,255,.22);border-radius:12px;background:rgba(0,0,0,.18);font:inherit;font-size:12px;color:var(--muted)}.network-dialog #n-file::file-selector-button{padding:10px 14px;margin-right:12px;border:1px solid rgba(255,255,255,.18);border-radius:8px;background:rgba(255,255,255,.07);color:var(--text);font:inherit;cursor:pointer}.network-dialog #n-file:hover{border-color:rgba(255,255,255,.4)}.network-dialog #n-file:focus-visible{outline:2px solid var(--accent-light);outline-offset:3px}.crew-upload-note{font-size:13px;line-height:1.6;color:var(--muted);margin:16px 0}.crew-upload-help{font-size:12px;color:var(--muted);margin:12px 0}.crew-upload-help summary{cursor:pointer;padding:6px 0}.crew-upload-help p{line-height:1.6;margin:8px 0}.network-dialog form[data-form="upload"] [data-upload-progress]:empty{display:none}@media(max-width:600px){.network-dialog #n-file{padding:10px}.network-dialog #n-file::file-selector-button{margin-right:8px;padding:10px}}
