:root{
  --paper:#f4f3ee;
  --panel:#ffffff;
  --ink:#202020;
  --muted:#656565;
  --line:#b8b8b2;
  --dark:#293038;
  --soft:#e8e8e2;
  --warning:#f1ede0;
  --max:920px;
}

*{box-sizing:border-box}

html{
  scroll-behavior:smooth;
}

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:Arial,Helvetica,sans-serif;
  line-height:1.55;
}

button,input,textarea,select{
  font:inherit;
}

button{
  cursor:pointer;
}

.topbar{
  position:sticky;
  top:0;
  z-index:20;
  background:var(--dark);
  color:#fff;
  border-bottom:1px solid #111;
}

.topbar-inner{
  max-width:1200px;
  margin:auto;
  padding:9px 16px;
  display:flex;
  gap:18px;
  align-items:center;
  justify-content:space-between;
  font-size:12px;
  letter-spacing:.04em;
}

.agency{
  font-weight:700;
}

.progress-wrap{
  flex:1;
  max-width:280px;
  height:6px;
  background:#59616a;
}

.progress-bar{
  height:100%;
  width:0;
  background:#fff;
}

.shell{
  max-width:1200px;
  margin:auto;
  padding:28px 18px 80px;
  display:grid;
  grid-template-columns:minmax(0,var(--max)) 260px;
  gap:28px;
  align-items:start;
}

main{
  min-width:0;
}

.status{
  position:sticky;
  top:58px;
  background:var(--panel);
  border:1px solid var(--line);
  padding:14px;
  font-size:12px;
}

.status h2{
  margin:0 0 10px;
  font-size:12px;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.status-row{
  display:flex;
  justify-content:space-between;
  gap:10px;
  padding:6px 0;
  border-top:1px solid var(--soft);
}

.status-row strong{
  text-align:right;
}

.document{
  background:var(--panel);
  border:1px solid var(--line);
  box-shadow:0 2px 8px rgba(0,0,0,.06);
}

.masthead{
  padding:36px 38px 30px;
  border-bottom:4px solid var(--dark);
}

.kicker,
.form-number,
.label{
  font-size:11px;
  font-weight:700;
  letter-spacing:.11em;
  text-transform:uppercase;
  color:var(--muted);
}

h1{
  margin:8px 0 0;
  font-size:clamp(34px,6vw,64px);
  line-height:.98;
  letter-spacing:-.035em;
}

.subtitle{
  margin:9px 0 0;
  font-size:20px;
}

.section{
  padding:34px 38px;
  border-bottom:1px solid var(--line);
}

.section h2{
  margin:0 0 22px;
  font-size:23px;
  text-transform:uppercase;
  letter-spacing:.02em;
}

.section h3{
  margin-top:28px;
  font-size:16px;
}

.big{
  font-size:26px;
  font-weight:700;
  line-height:1.2;
}

.account-box,
.result,
.notice,
.form-box{
  margin:22px 0;
  padding:18px;
  border:1px solid var(--line);
  background:#fafafa;
}

.notice{
  background:var(--warning);
}

.result{
  display:none;
}

.result.open{
  display:block;
}

.account-table{
  width:100%;
  border-collapse:collapse;
}

.account-table td{
  border-top:1px solid var(--soft);
  padding:8px 4px;
}

.account-table td:last-child{
  text-align:right;
  font-weight:700;
}

.actions{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  margin:18px 0;
}

.btn{
  border:1px solid #555;
  background:#fff;
  color:#111;
  padding:10px 14px;
  min-height:42px;
}

.btn.primary{
  background:var(--dark);
  color:#fff;
  border-color:var(--dark);
}

.btn:hover{
  filter:brightness(.96);
}

.choice-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
  margin:18px 0;
}

.choice-grid button{
  text-align:left;
}

.fields{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}

.field{
  display:flex;
  flex-direction:column;
  gap:5px;
}

.field.full{
  grid-column:1/-1;
}

input,textarea,select{
  width:100%;
  border:1px solid #8d8d88;
  background:#fff;
  padding:10px;
}

textarea{
  min-height:110px;
  resize:vertical;
}

.calc-output{
  margin-top:20px;
  padding:20px;
  background:#ecece7;
  border-left:5px solid var(--dark);
}

.calc-number{
  display:block;
  font-size:28px;
  font-weight:700;
}

details{
  border-top:1px solid var(--line);
  padding:13px 0;
}

summary{
  cursor:pointer;
  font-weight:700;
}

.survey-question{
  margin:26px 0;
}

.survey-question label{
  display:block;
  padding:5px 0;
}

.small{
  font-size:12px;
  color:var(--muted);
}

.footer{
  padding:30px 38px;
  text-align:center;
  font-size:12px;
  color:var(--muted);
}

.system-message{
  position:fixed;
  left:50%;
  bottom:20px;
  transform:translateX(-50%);
  width:min(560px,calc(100vw - 30px));
  background:#fff;
  border:1px solid #555;
  box-shadow:0 5px 30px rgba(0,0,0,.22);
  padding:16px 18px;
  z-index:50;
  display:none;
}

.system-message.open{
  display:block;
}

.system-message strong{
  display:block;
  margin-bottom:5px;
}

@media(max-width:850px){
  .shell{
    display:block;
  }

  .status{
    position:relative;
    top:auto;
    margin-bottom:18px;
  }

  .masthead,
  .section{
    padding-left:22px;
    padding-right:22px;
  }
}

@media(max-width:560px){
  .choice-grid,
  .fields{
    grid-template-columns:1fr;
  }

  .topbar-inner{
    flex-wrap:wrap;
  }

  .progress-wrap{
    order:3;
    max-width:none;
    width:100%;
  }
}

@media print{
  .topbar,
  .status,
  .actions,
  .system-message{
    display:none!important;
  }

  body{
    background:#fff;
  }

  .shell{
    display:block;
    padding:0;
  }

  .document{
    border:0;
    box-shadow:none;
  }
}


/* ===== PLANETARY INTAKE SERVICES OFFICIAL SEAL ===== */

.masthead-top{
  display:flex;
  align-items:center;
  gap:26px;
}

.masthead-copy{
  min-width:0;
}

.planetary-seal{
  position:relative;
  width:132px;
  height:132px;
  flex:0 0 132px;
  border:4px double var(--dark);
  border-radius:50%;
  background:#f8f8f3;
  color:var(--dark);
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:
    inset 0 0 0 5px #f8f8f3,
    inset 0 0 0 7px var(--dark);
  text-align:center;
}

.seal-core{
  width:72px;
  height:72px;
  border:2px solid var(--dark);
  border-radius:50%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  line-height:1.05;
  background:#f8f8f3;
}

.seal-earth{
  margin:4px 0;
  font-size:20px;
  font-weight:800;
  letter-spacing:.08em;
}

.seal-tiny{
  font-size:7px;
  line-height:1.15;
  font-weight:700;
  letter-spacing:.08em;
}

.seal-band{
  position:absolute;
  left:14px;
  right:14px;
  font-size:7px;
  font-weight:800;
  letter-spacing:.08em;
  line-height:1.1;
}

.seal-top{
  top:15px;
}

.seal-bottom{
  bottom:14px;
}

@media(max-width:560px){
  .masthead-top{
    gap:14px;
    align-items:flex-start;
  }

  .planetary-seal{
    width:88px;
    height:88px;
    flex-basis:88px;
    border-width:3px;
    box-shadow:
      inset 0 0 0 3px #f8f8f3,
      inset 0 0 0 5px var(--dark);
  }

  .seal-core{
    width:48px;
    height:48px;
  }

  .seal-earth{
    font-size:13px;
    margin:2px 0;
  }

  .seal-tiny{
    font-size:5px;
  }

  .seal-band{
    left:9px;
    right:9px;
    font-size:5px;
  }

  .seal-top{
    top:9px;
  }

  .seal-bottom{
    bottom:8px;
  }
}


/* ===== BUREAUCRATIC PORTAL POLISH ===== */

body{
  background:
    linear-gradient(rgba(0,0,0,.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,0,0,.012) 1px, transparent 1px),
    #d9d9d3;
  background-size:24px 24px;
}

.document{
  position:relative;
  background:#f7f7f2;
  border:1px solid #6f7478;
  box-shadow:
    0 1px 0 rgba(255,255,255,.7) inset,
    0 6px 22px rgba(0,0,0,.10);
}

.document::before{
  content:"OFFICIAL USE / PARTICIPANT COPY / ACTIVE RECORD";
  display:block;
  padding:7px 12px;
  background:#d8dad8;
  border-bottom:1px solid #6f7478;
  color:#34383b;
  font-size:10px;
  font-weight:700;
  letter-spacing:.13em;
  text-align:center;
}

.masthead{
  position:relative;
  background:
    linear-gradient(180deg,#fafaf6 0%,#efefe9 100%);
  border-bottom:5px double #343a3f;
}

.masthead::after{
  content:"FILE STATUS: ACTIVE";
  position:absolute;
  right:20px;
  bottom:12px;
  padding:4px 7px;
  border:1px solid #666;
  background:#e5e5df;
  font-size:9px;
  font-weight:700;
  letter-spacing:.09em;
}

.form-number{
  display:inline-block;
  margin-bottom:7px;
  padding:4px 7px;
  border:1px solid #74787b;
  background:#dedfdb;
  color:#303438;
}

.section{
  position:relative;
  background:rgba(255,255,255,.36);
  border-bottom:2px solid #969996;
}

.section:nth-of-type(even){
  background:rgba(235,236,231,.55);
}

.section h2{
  padding-bottom:9px;
  border-bottom:3px double #7c807d;
  font-family:Arial,Helvetica,sans-serif;
  font-weight:800;
  letter-spacing:.055em;
}

.section h3{
  padding-bottom:5px;
  border-bottom:1px solid #aaa;
}

.label{
  display:inline-block;
  margin-bottom:8px;
  padding:3px 7px;
  border:1px solid #74787b;
  background:#dfe0dc;
  color:#34383b;
  font-size:10px;
  letter-spacing:.14em;
}

.account-box,
.form-box,
.notice,
.result{
  border:1px solid #777d80;
  background:#f3f3ee;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.65);
}

.account-box::before,
.form-box::before{
  display:block;
  margin:-18px -18px 15px;
  padding:5px 8px;
  border-bottom:1px solid #777d80;
  background:#d9dad6;
  color:#363a3d;
  font-size:9px;
  font-weight:700;
  letter-spacing:.12em;
}

.account-box::before{
  content:"ACCOUNT RECORD";
}

.form-box::before{
  content:"ADMINISTRATIVE CALCULATION";
}

.account-table{
  border:1px solid #929592;
}

.account-table td{
  border-top:1px solid #b5b7b4;
  padding:8px 9px;
}

.account-table tr:nth-child(even){
  background:#e9eae5;
}

.account-table td:first-child{
  width:58%;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:.025em;
}

.account-table td:last-child{
  border-left:1px solid #b5b7b4;
}

.btn{
  border:1px solid #575c60;
  border-radius:1px;
  background:
    linear-gradient(#f7f7f4,#dedfda);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.8),
    0 1px 1px rgba(0,0,0,.08);
  font-size:12px;
  font-weight:700;
  letter-spacing:.045em;
  text-transform:uppercase;
}

.btn.primary{
  background:
    linear-gradient(#3d454c,#292f34);
  border-color:#23282c;
}

.btn:active{
  transform:translateY(1px);
  box-shadow:none;
}

input,
textarea,
select{
  border:1px solid #6f7477;
  border-radius:0;
  background:#fffef8;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.06);
}

.field{
  font-size:11px;
  font-weight:700;
  letter-spacing:.025em;
  text-transform:uppercase;
}

.field input,
.field textarea,
.field select{
  margin-top:3px;
  font-size:14px;
  font-weight:400;
  text-transform:none;
  letter-spacing:normal;
}

.choice-grid{
  padding:12px;
  border:1px dashed #858a87;
  background:#ecece7;
}

details{
  background:rgba(255,255,255,.35);
}

details summary{
  padding:4px 0;
  font-size:13px;
}

.status{
  border:1px solid #656b6f;
  background:#e7e8e4;
  box-shadow:0 3px 12px rgba(0,0,0,.08);
}

.status h2{
  margin:-14px -14px 10px;
  padding:8px 10px;
  background:#343b41;
  color:white;
  border-bottom:3px double #111;
}

.status::after{
  content:"RECORD RETENTION: INDEFINITE";
  display:block;
  margin:12px -5px -5px;
  padding-top:9px;
  border-top:1px solid #9b9f9c;
  color:#555;
  font-size:9px;
  font-weight:700;
  letter-spacing:.08em;
  text-align:center;
}

.status-row{
  padding:7px 3px;
  border-top:1px solid #b1b4b1;
}

.status-row span{
  font-size:10px;
  font-weight:700;
  letter-spacing:.045em;
  text-transform:uppercase;
}

.system-message{
  border:3px double #565c60;
  background:#f4f4ef;
}

.system-message::before{
  content:"ADMINISTRATIVE NOTICE";
  display:block;
  margin:-16px -18px 14px;
  padding:6px 9px;
  background:#383f45;
  color:white;
  font-size:10px;
  font-weight:700;
  letter-spacing:.12em;
}

.survey-question{
  padding:16px;
  border:1px solid #9a9d9a;
  background:#ededE8;
}

.survey-question strong{
  display:block;
  margin-bottom:8px;
  padding-bottom:6px;
  border-bottom:1px solid #aaa;
  text-transform:uppercase;
  font-size:12px;
}

.calc-output{
  border:1px solid #7f8480;
  border-left:7px solid #3d4449;
  background:#e4e5e0;
}

.footer{
  border-top:4px double #686d70;
  background:#dedfda;
  letter-spacing:.08em;
}

@media(max-width:560px){
  .masthead::after{
    position:static;
    display:inline-block;
    margin-top:14px;
  }

  .document::before{
    font-size:8px;
    letter-spacing:.08em;
  }
}

/* ===== END BUREAUCRATIC PORTAL POLISH ===== */


/* ===== OFFICIAL IMAGE SEAL ===== */

.planetary-seal-image{
  width:145px;
  height:145px;
  flex:0 0 145px;
  border-radius:50%;
  overflow:hidden;
  box-shadow:
    0 0 0 2px #2d3338,
    0 2px 8px rgba(0,0,0,.22);
  background:#1e2730;
}

.planetary-seal-image img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:50%;
}

@media(max-width:560px){
  .planetary-seal-image{
    width:94px;
    height:94px;
    flex-basis:94px;
  }
}

/* ===== END OFFICIAL IMAGE SEAL ===== */


/* ===== COMPLETE ORIENTATION MANUAL ===== */
.manual-promo {
  margin-top: 26px;
  padding-top: 22px;
  border-top: 3px double #3d4245;
}

.manual-promo-label {
  margin-bottom: 12px;
  font-size: 0.82rem;
  line-height: 1.25;
  font-weight: 800;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.manual-promo p {
  margin: 0 0 12px;
  font-size: 0.88rem;
  line-height: 1.45;
}

.manual-promo-button {
  display: block;
  margin-top: 17px;
  padding: 12px 10px;
  border: 1px solid #383d40;
  background: #383d40;
  color: #fff;
  text-align: center;
  text-decoration: none;
  font-size: 0.78rem;
  line-height: 1.3;
  font-weight: 800;
  letter-spacing: 0.055em;
}

.manual-promo-button:hover,
.manual-promo-button:focus {
  background: #f2f1eb;
  color: #24282a;
  outline: 2px solid #383d40;
  outline-offset: 2px;
}


/* ===== PARTICIPANT SUPPORT SERVICES ===== */
.support-promo {
  margin-top: 24px;
  padding-top: 22px;
  border-top: 3px double #3d4245;
}

.support-promo-label {
  margin-bottom: 12px;
  font-size: 0.82rem;
  line-height: 1.25;
  font-weight: 800;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.support-promo p {
  margin: 0 0 12px;
  font-size: 0.88rem;
  line-height: 1.45;
}

.support-promo-button {
  display: block;
  margin-top: 17px;
  padding: 12px 10px;
  border: 1px solid #383d40;
  background: #383d40;
  color: #fff;
  text-align: center;
  text-decoration: none;
  font-size: 0.78rem;
  line-height: 1.3;
  font-weight: 800;
  letter-spacing: 0.055em;
}

.support-promo-button:hover,
.support-promo-button:focus {
  background: #f2f1eb;
  color: #24282a;
  outline: 2px solid #383d40;
  outline-offset: 2px;
}
