.guide-page { background: radial-gradient(circle at 75% 10%, rgba(107,220,244,.09), transparent 28%), var(--ink); }
.guide-hero { min-height: 78svh; padding: 9rem clamp(1.2rem,8vw,9rem) 5rem; display: grid; grid-template-columns: minmax(0,1fr) minmax(20rem,.6fr); gap: clamp(3rem,9vw,10rem); align-items: center; border-bottom: 1px solid var(--line); }
.guide-hero h1, .about-hero h1, .error-page h1 { max-width: 13ch; margin: 0; font: 500 clamp(3.1rem,6.7vw,6.8rem)/.93 var(--serif); letter-spacing: -.055em; }
.guide-hero > div > p:not(.eyebrow) { max-width: 42rem; color: var(--muted); font-size: 1.08rem; }
.protocol-dial { width: min(100%,27rem); aspect-ratio: 1; margin: auto; display: grid; place-content: center; text-align: center; position: relative; border: 1px solid rgba(107,220,244,.2); border-radius: 50%; box-shadow: inset 0 0 6rem rgba(107,220,244,.05), 0 0 7rem rgba(107,220,244,.04); }
.dial-rings { position: absolute; inset: 12%; border: 1px solid var(--line-gold); border-radius: 50%; }
.protocol-dial strong { color: var(--gold-bright); font: 500 5.5rem/.8 var(--serif); }
.protocol-dial > span { color: var(--muted); font-size: .72rem; letter-spacing: .2em; text-transform: uppercase; }
.dial-mark { position: absolute; left: 50%; top: 50%; width: .55rem; height: .55rem; margin: -.27rem; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 .8rem rgba(107,220,244,.8); transform: rotate(var(--a)) translateY(-13.45rem); }
.m1{--a:0deg}.m2{--a:32.72deg}.m3{--a:65.44deg}.m4{--a:98.16deg}.m5{--a:130.88deg}.m6{--a:163.6deg}.m7{--a:196.32deg}.m8{--a:229.04deg}.m9{--a:261.76deg}.m10{--a:294.48deg}.m11{--a:327.2deg}
.protocol-workspace { max-width: 96rem; margin: 0 auto; padding: 7rem clamp(1rem,5vw,4rem); display: grid; grid-template-columns: 13rem minmax(0,1fr); gap: clamp(2rem,6vw,6rem); }
.protocol-index { position: sticky; top: 6.5rem; align-self: start; padding: 1rem 0; border-top: 1px solid var(--line-gold); }
.protocol-index > p { color: var(--gold); font-size: .64rem; font-weight: 850; letter-spacing: .13em; text-transform: uppercase; }
.protocol-index ol { list-style: decimal-leading-zero; padding-left: 1.75rem; color: var(--faint); }
.protocol-index li { margin: .35rem 0; padding-left: .35rem; font-size: .72rem; }
.protocol-index a { color: var(--muted); text-decoration: none; }
.protocol-index a:hover { color: var(--cyan); }
.section-heading.compact { display: block; margin-bottom: 2rem; }
.section-heading.compact h2 { max-width: 15ch; font-size: clamp(2.35rem,4.5vw,4.4rem); }
.move-list { counter-reset: move; }
.move-card { scroll-margin-top: 6rem; min-height: 14rem; padding: 2rem 0; display: grid; grid-template-columns: 5rem minmax(0,1fr); gap: 1.5rem; border-top: 1px solid var(--line); }
.move-number { color: var(--faint); font: 500 1rem/1 var(--serif); }
.move-command { margin: 0 0 .25rem; color: var(--cyan); font-size: .62rem; font-weight: 850; letter-spacing: .14em; text-transform: uppercase; }
.move-card h3 { margin: 0; font: 500 clamp(1.6rem,3vw,2.5rem)/1 var(--serif); }
.move-card > div > p:not(.move-command) { max-width: 50rem; color: var(--muted); }
.move-card details { max-width: 50rem; padding: .7rem .8rem; border: 1px solid var(--line); background: rgba(255,255,255,.02); }
.move-card summary { color: var(--gold); font-size: .67rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; cursor: pointer; }
.move-card details p { margin: .55rem 0 0; color: #becbd6; font-size: .84rem; }
.issue-builder { padding: 6rem clamp(1.2rem,8vw,9rem); display: grid; grid-template-columns: minmax(16rem,.62fr) minmax(0,1fr); gap: clamp(3rem,8vw,8rem); background: linear-gradient(135deg, rgba(12,31,50,.8), rgba(6,14,24,.95)); border-block: 1px solid var(--line); }
.builder-intro h2, .doctrine-top h2, .about-grid h2, .control-reference h2, .course-map h2 { margin: 0; font: 500 clamp(2rem,4vw,3.8rem)/1 var(--serif); letter-spacing: -.035em; }
.builder-intro > p:not(.eyebrow) { color: var(--muted); }
.builder-panel { display: grid; gap: .75rem; }
.builder-panel label, .doctrine-search { display: grid; gap: .3rem; color: var(--faint); font-size: .61rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.builder-panel select, .doctrine-search input { width: 100%; min-height: 3.25rem; padding: .65rem .8rem; border: 1px solid var(--line); border-radius: 0; background: #09182a; color: var(--paper); font: 700 .82rem/1.3 var(--sans); }
.builder-output { min-height: 8rem; padding: 1rem; border: 1px solid var(--line-gold); background: rgba(232,184,94,.035); color: #cad5df; font-size: .88rem; }
.builder-output strong { color: var(--gold-bright); }
.builder-output ol { margin: .55rem 0 0; padding-left: 1.2rem; }
.doctrine-index { padding: 7rem clamp(1.2rem,6vw,7rem); }
.doctrine-top { max-width: 90rem; margin: 0 auto 2.5rem; display: flex; justify-content: space-between; gap: 2rem; align-items: end; }
.doctrine-search { width: min(100%,24rem); }
.doctrine-grid { max-width: 90rem; margin: 0 auto; display: grid; grid-template-columns: repeat(3,1fr); gap: .75rem; }
.doctrine-grid article { min-height: 13rem; padding: 1.1rem; display: flex; flex-direction: column; border: 1px solid var(--line); background: rgba(10,25,43,.55); }
.doctrine-grid article[hidden] { display: none; }
.doctrine-grid article > span { color: var(--cyan); font-size: .58rem; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.doctrine-grid h3 { margin: auto 0 .35rem; font: 500 1.4rem/1 var(--serif); }
.doctrine-grid p { margin: .2rem 0 .75rem; color: var(--muted); font-size: .78rem; }
.doctrine-grid a { color: var(--gold); font-size: .62rem; font-weight: 850; letter-spacing: .08em; text-decoration: none; text-transform: uppercase; }
.empty-doctrines { max-width: 90rem; margin: 1rem auto; padding: 1rem; border: 1px solid var(--line); color: var(--muted); }
.about-shell { padding: 9rem clamp(1.2rem,8vw,9rem) 7rem; }
.about-hero { max-width: 80rem; padding-bottom: 5rem; }
.about-hero h1 { max-width: 15ch; }
.about-hero > p:not(.eyebrow) { max-width: 50rem; color: var(--muted); font-size: 1.08rem; }
.about-grid { display: grid; grid-template-columns: repeat(2,1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.about-grid section { min-height: 18rem; padding: 1.5rem; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.about-grid section > span { color: var(--gold); font-size: .65rem; letter-spacing: .12em; }
.about-grid h2 { margin-top: 4rem; font-size: 2rem; }
.about-grid p { color: var(--muted); }
.control-reference { margin-top: 6rem; display: grid; grid-template-columns: .7fr 1fr; gap: 4rem; }
.control-reference dl { margin: 0; border-top: 1px solid var(--line); }
.control-reference dl div { padding: .75rem 0; display: grid; grid-template-columns: 8rem 1fr; border-bottom: 1px solid var(--line); }
.control-reference dt { color: var(--gold); font-weight: 800; }
.control-reference dd { margin: 0; color: var(--muted); }
.course-map { margin-top: 7rem; }
.course-map ol { list-style: none; margin: 2rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(2,1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.course-map a { padding: 1.1rem; display: flex; gap: 1rem; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); text-decoration: none; font-family: var(--serif); }
.course-map a:hover { background: rgba(107,220,244,.04); color: var(--cyan); }
.course-map a span { color: var(--faint); font: 700 .65rem/1.6 var(--sans); }
.error-page { min-height: 100svh; padding: 2rem; display: grid; place-content: center; justify-items: start; background: radial-gradient(circle at 60% 40%, rgba(107,220,244,.1), transparent 25%); }
.error-page .brand-seal { margin-bottom: 2rem; }
.error-page p:not(.eyebrow) { color: var(--muted); }
@media (max-width: 900px) { .guide-hero, .issue-builder { grid-template-columns: 1fr; }.guide-hero { padding-top: 8rem; }.protocol-dial { max-width: 20rem; }.dial-mark { transform: rotate(var(--a)) translateY(-10rem); }.protocol-workspace { grid-template-columns: 1fr; }.protocol-index { display: none; }.doctrine-grid { grid-template-columns: repeat(2,1fr); }.control-reference { grid-template-columns: 1fr; } }
@media (max-width: 620px) { .guide-hero { min-height: auto; }.guide-hero h1, .about-hero h1, .error-page h1 { font-size: 3.2rem; }.move-card { grid-template-columns: 2.5rem 1fr; }.doctrine-top { align-items: stretch; flex-direction: column; }.doctrine-search { width: 100%; }.doctrine-grid, .about-grid, .course-map ol { grid-template-columns: 1fr; }.control-reference dl div { grid-template-columns: 6rem 1fr; } }
