/* Armancio Dulce brand: "Contour Field" — github.com/joyabundancegrowth-spec/Armancio-Dulce/branding/type-and-color.md
   Leads: hot pink #FF1F8F, turquoise #14E0D0. Ground: night #0A0C0F. Text: bone #F4F0E8 (65% = #A6A4A0 on panel).
   One support per frame: chartreuse #C6F53A (eyebrows/labels). Hard edges, no gradients between brand colors.
   Contrast (text): bone/night 17.2, bone65/panel 7.2, pink/night 5.45, pink/panel 4.99, night/pink 5.45,
   night/turquoise 11.75, night/chartreuse 15.4, chartreuse/panel 14.1, turquoise/panel 10.8. */
:root{--night:#0A0C0F;--bone:#F4F0E8;--bone65:#A6A4A0;--bone55:#908E8B;--line:#7A7977;--hair:#3A3B3C;--panel:#16171A;--panel2:#1D1E20;
--pink:#FF1F8F;--turq:#14E0D0;--chart:#C6F53A;
--display:'Archivo','Arial Black',sans-serif;--mono:'Space Mono',ui-monospace,Menlo,Consolas,monospace}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;color-scheme:dark}
body{margin:0;background:var(--night);color:var(--bone);font-family:var(--mono);font-size:15px;line-height:1.6}
.page{max-width:1320px;margin:0 auto;padding:24px 18px 56px}
.masthead{padding:6px 0 0;margin-bottom:22px}
.wordmark{display:block;width:min(600px,100%);height:auto}
.eyebrow{margin:18px 0 8px;font-weight:700;font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--chart);display:flex;align-items:center;gap:10px}
.eyebrow::before{content:"";width:28px;height:3px;background:var(--chart);flex:none}
h1,h2{font-family:var(--display);font-variation-settings:'wdth' 98,'wght' 900;font-weight:900;letter-spacing:-.035em;text-transform:uppercase;color:var(--bone)}
h1{font-size:clamp(40px,7vw,76px);line-height:.84;margin:0 0 14px}
h1 .key{color:var(--pink)}
.summary{margin:0;color:var(--bone65);max-width:72ch}
.rules{margin-top:20px;display:flex;flex-direction:column;gap:6px}
.rules span{display:block;height:3px}.rules .r1{background:var(--pink)}.rules .r2{background:var(--turq);width:62%}
main{display:flex;flex-direction:column;gap:16px}
.card{background:var(--panel);border:1px solid var(--hair);border-radius:4px;padding:18px}
.card .card{background:transparent;padding:12px}
h2{font-size:26px;line-height:.9;margin:0 0 14px}
.card .card h2{font-size:19px}
details>summary{cursor:pointer;list-style:none}
details>summary::-webkit-details-marker{display:none}
details>summary h2{display:inline}
details>summary::after{content:" +";font-family:var(--mono);font-weight:700;color:var(--turq)}
details[open]>summary::after{content:" –"}
details[open]>summary{margin-bottom:14px}
.stack{display:flex;flex-direction:column;gap:12px;min-width:0}
.grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:start}
.grid>.section:last-child{position:sticky;top:12px;max-height:calc(100vh - 24px);overflow:auto;border-top:3px solid var(--turq)}
.grid>.section:first-child{border-top:3px solid var(--pink)}
@media (max-width:920px){.grid{grid-template-columns:minmax(0,1fr)}.grid>.section:last-child{position:static;max-height:none}}
.text{margin:0}
.callout{background:var(--panel2);border-left:4px solid var(--pink);padding:12px 14px}
.callout strong{color:var(--bone)}
.bullets{margin:0;padding-left:20px}.bullets li{margin:4px 0}.bullets li::marker{color:var(--turq)}
.props{display:grid;grid-template-columns:minmax(120px,38%) 1fr;gap:6px 12px;margin:0}
.prop{display:contents}.prop dt{color:var(--bone65);font-weight:700;text-transform:uppercase;letter-spacing:.12em;font-size:12px}.prop dd{margin:0}
.fieldwrap{display:flex;flex-direction:column;gap:6px}
.lbl{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--bone65)}
.inp,textarea,select{font:inherit;color:var(--bone);background:var(--night);border:1px solid var(--line);border-radius:2px;padding:10px 12px;width:100%}
textarea{background:var(--night) !important;color:var(--bone) !important}
select.inp{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--turq) 50%),linear-gradient(135deg,var(--turq) 50%,transparent 50%);background-position:calc(100% - 18px) 55%,calc(100% - 13px) 55%;background-size:5px 5px;background-repeat:no-repeat;padding-right:34px}
select option{background:var(--night);color:var(--bone)}
.inp:focus,textarea:focus,select:focus,button:focus-visible,.toggle input:focus-visible+.track,summary:focus-visible{outline:3px solid var(--turq);outline-offset:2px}
::placeholder{color:var(--bone55);opacity:1}
.btn{font-family:var(--mono);font-weight:700;font-size:13px;letter-spacing:.12em;text-transform:uppercase;min-height:44px;padding:10px 16px;border-radius:2px;border:1.5px solid var(--bone);background:transparent;color:var(--bone);cursor:pointer}
.btn:hover{border-color:var(--turq);color:var(--turq)}
.btn.primary{background:var(--pink);border-color:var(--pink);color:var(--night)}
.btn.primary:hover{background:var(--bone);border-color:var(--bone);color:var(--night)}
button{min-height:40px}
.toggle{display:flex;align-items:flex-start;gap:10px;cursor:pointer;line-height:1.5}
.toggle input{position:absolute;opacity:0;width:1px;height:1px}
.track{flex:none;width:40px;height:22px;background:var(--hair);border:1px solid var(--line);position:relative;transition:background .15s}
.knob{position:absolute;top:3px;left:3px;width:14px;height:14px;background:var(--bone);transition:transform .15s}
.toggle input:checked+.track{background:var(--turq);border-color:var(--turq)}
.toggle input:checked+.track .knob{transform:translateX(18px);background:var(--night)}
.tlabel{font-size:14px}
.table-wrap{overflow-x:auto}
table{width:100%;border-collapse:collapse;font-size:13px}
th{text-align:left;background:var(--night);color:var(--chart);font-weight:700;font-size:11px;letter-spacing:.16em;text-transform:uppercase;padding:9px 10px;border-bottom:2px solid var(--turq)}
td{padding:8px 10px;border-bottom:1px solid var(--hair);vertical-align:top}
.pill{display:inline-block;padding:2px 8px;font-weight:700;font-size:12px;white-space:nowrap;color:var(--night)}
.pill.success{background:var(--turq)}
.pill.warning{background:var(--chart)}
.pill.danger{background:var(--pink)}
@media (max-width:600px){
  .page{padding:16px 12px 40px}.card{padding:14px}
  table,thead,tbody,tr,td{display:block}thead{display:none}
  tr{border:1px solid var(--hair);margin-bottom:8px}
  td{border:0;padding:4px 10px}td::before{content:attr(data-label);display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--bone65);font-weight:700}
  .pill{white-space:normal}
}
@media (prefers-reduced-motion:reduce){*{transition:none !important;scroll-behavior:auto !important}}