:root{
  color-scheme:light;
  --paper:#f4efe5;
  --card:#fffdf8;
  --ink:#171512;
  --muted:#655e55;
  --line:#d9d1c5;
  --accent:#a74610;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  color:var(--ink);
  background:var(--paper);
  font-synthesis:none
}
*{
  box-sizing:border-box
}
body{
  margin:0;
  min-width:320px;
  background:radial-gradient(ellipse at 80% 0%,#e7edce80,transparent 600px)
}
a{
  color:inherit;
  text-underline-offset:4px
}
button{
  font:inherit
}
button,a,input{
  touch-action:manipulation
}
button{
  cursor:pointer
}
button:disabled{
  cursor:not-allowed;
  opacity:.55
}
[hidden]{
  display:none!important
}
:focus-visible{
  outline:3px solid var(--accent);
  outline-offset:5px
}
h1,h2,p{
  overflow-wrap:anywhere
}
h1{
  font:500 clamp(36px,5.4vw,64px)/1.08 Georgia,serif;
  letter-spacing:-.04em;
  margin:20px 0
}
h1 em{
  color:var(--accent);
  font-weight:400
}
h2{
  font-size:24px;
  line-height:1.3;
  letter-spacing:-.03em
}
p{
  line-height:1.65
}
.link-label {
  display: block;
  margin-top: 24px;
  font-size: 14px;
}
.link-label input {
  display: block;
  width: 100%;
  min-width: 0;
  padding: 12px;
  margin-top: 8px;
  border: 1px solid var(--line);
  border-radius: 10px;
  font: inherit;
}
details summary { cursor: pointer; min-height: 44px; padding: 10px 0; }
input[type=file] { max-width: 100%; }
.criteria-list { list-style: none; padding: 0; }
.criteria-list > li { padding: 18px 0; border-bottom: 1px solid var(--line); overflow-wrap: anywhere; }
.criteria-list .actions { margin-top: 8px; }
.criterion-form { margin-top: 24px; }
.criterion-form fieldset { border: 0; padding: 0; margin: 0; min-width: 0; }
.criterion-form legend { font-size: 14px; margin-bottom: 16px; color: var(--muted); }
.criterion-form label { display: block; font-weight: 600; }
.criterion-form input, .criterion-form select, .criterion-form textarea {
  display: block; width: 100%; min-width: 0; max-width: 100%; margin: 8px 0 16px; padding: 13px;
  font: inherit; color: var(--ink); background: var(--card); border: 1px solid var(--line); border-radius: 10px;
}
.criterion-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)); gap: 0 16px; }
#criterion-error { color: #922c10; }
.skip-link{
  position:absolute;
  top:-100px;
  left:20px;
  background:var(--ink);
  color:white;
  padding:12px;
  z-index:2
}
.skip-link:focus{
  top:8px
}
.site-header{
  border-bottom:1px solid var(--line)
}
nav{
  max-width:1120px;
  margin:auto;
  padding:24px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px
}
.brand{
  font-weight:750;
  text-decoration:none;
  letter-spacing:-.04em
}
.brand span{
  color:var(--accent);
  padding:0 6px
}
.nav-links{
  display:flex;
  gap:24px;
  font-size:14px
}
.nav-links a{
  text-decoration:none
}
main{
  max-width:1120px;
  margin:auto;
  padding:0 24px
}
.intro{
  padding:72px 0 40px
}
.eyebrow{
  font-size:12px;
  letter-spacing:.12em;
  font-weight:750;
  color:var(--accent)
}
.lead{
  font-size:19px;
  color:var(--muted);
  max-width:650px
}
.privacy-note{
  font-size:14px;
  color:var(--muted)
}
.collection-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:24px
}
.personal-entry {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 20px 32px; padding: 32px; margin-bottom: 40px;
  background: var(--card); border: 2px solid var(--accent); border-radius: 24px;
}
.personal-entry > div { flex: 1 1 320px; min-width: 0; }
.personal-entry h2 { margin: 12px 0; }
.personal-entry p { color: var(--muted); margin-bottom: 0; max-width: 650px; }
.personal-entry .button { gap: 12px; }
.collection-card{
  display:flex;
  flex-direction:column;
  align-items:start;
  background:var(--card);
  border:1px solid var(--line);
  border-radius:24px;
  padding:32px
}
.collection-card:nth-child(2){
  background:#ebeedc
}
.card-top{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between
}
.collection-number{
  font:italic 46px Georgia,serif;
  color:var(--accent)
}
.tag{
  font-size:12px;
  border:1px solid var(--line);
  border-radius:30px;
  padding:6px 12px
}
.collection-card h2{
  margin:28px 0 0
}
.collection-card p{
  color:var(--muted);
  flex:1;
  margin-bottom:28px
}
.button{
  min-height:48px;
  border:1px solid var(--line);
  border-radius:999px;
  padding:13px 21px;
  background:var(--card);
  color:var(--ink);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:16px;
  font-weight:650;
  font-size:15px;
  text-decoration:none;
  text-align:center
}
.button:hover{
  border-color:var(--ink)
}
.primary{
  background:var(--ink);
  color:var(--card);
  border-color:var(--ink)
}
.text-button{
  background:transparent;
  border:0;
  text-decoration:underline;
  text-underline-offset:4px;
  min-height:44px;
  color:var(--muted);
  padding:8px;
  font-size:14px
}
.info{
  margin:36px 0 0;
  border-top:1px solid var(--line);
  padding:16px 0;
  max-width:740px
}
.info h2{
  font-size:18px
}
.info p{
  color:var(--muted);
  font-size:15px
}
footer{
  max-width:1120px;
  margin:40px auto 0;
  padding:32px 24px;
  color:var(--muted);
  font-size:13px;
  line-height:2
}
.breadcrumbs{
  display:flex;
  gap:24px;
  font-size:14px;
  padding:28px 0;
  color:var(--muted);
  flex-wrap:wrap
}
.workspace{
  max-width:800px;
  margin:0 auto
}
.workspace section{
  border:1px solid var(--line);
  border-radius:24px;
  padding:40px;
  background:var(--card);
  min-height:420px
}
.workspace h1{
  font-size:clamp(32px,4.7vw,48px)
}
.actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:28px;
  align-items:center
}
.options{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;
  margin:32px 0 20px
}
.option{
  padding:24px 20px;
  border:1px solid var(--line);
  border-radius:18px;
  background:var(--paper);
  min-height:116px;
  text-align:left;
  font-size:20px;
  font-weight:650;
  overflow-wrap:anywhere;
  color:var(--ink);
  display:flex;
  align-items:center;
  gap:12px
}
.option[aria-pressed=true]{
  background:#e4edb8;
  border:2px solid #52652a;
  padding:23px 19px
}
.choice-mark{
  flex:0 0 24px;
  display:inline-flex;
  justify-content:center
}
.progress-label{
  display:flex;
  justify-content:space-between;
  gap:20px;
  font-size:13px;
  color:var(--muted);
  margin-bottom:12px
}
progress{
  width:100%;
  height:8px;
  accent-color:#617632;
  margin-bottom:22px
}
.question-help{
  color:var(--muted);
  font-size:14px
}
.notice{
  padding:18px;
  border:1px solid #ba864e;
  border-radius:16px;
  background:#fff0d9;
  line-height:1.6;
  margin-bottom:20px;
  overflow-wrap:anywhere
}
.notice .actions{
  margin-top:12px
}
.summary-stats{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin:24px 0
}
.summary-list{
  list-style:none;
  padding:0;
  margin:24px 0
}
.summary-list li{
  border-top:1px solid var(--line);
  padding:18px 0;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px
}
.summary-list h2{
  font-size:16px;
  margin:0 0 8px;
  font-weight:550
}
.answer{
  font-size:17px;
  font-weight:700;
  margin:0
}
.answer-muted{
  color:var(--muted);
  font-weight:400
}
.small{
  font-size:13px;
  color:var(--muted)
}
@media(max-width:640px){
  nav{
    align-items:flex-start;
    flex-direction:column;
    padding:18px 20px;
    gap:16px
  }
  .nav-links{
    gap:24px
  }
  main{
    padding:0 20px
  }
  .intro{
    padding:42px 0 28px
  }
  .collection-grid{
    grid-template-columns:1fr
  }
  .collection-card{
    padding:24px
  }
  .workspace section{
    padding:24px 20px;
    min-height:0
  }
  .options{
    grid-template-columns:1fr;
    margin-top:24px;
    gap:12px
  }
  .option{
    min-height:80px;
    font-size:18px
  }
  .summary-list li{
    gap:12px
  }
  .summary-list .text-button{
    font-size:12px
  }
  .progress-label{
    gap:10px
  }
  .breadcrumbs{
    gap:12px
  }
  .actions .button{
    flex-grow:1
  }
  footer{
    margin-top:24px
  }
  .lead{
    font-size:17px
  }
}