.method{
  --header-height:0px;
  --method-nav-gap:12px;
  --method-nav-height:46px;
  --method-accent-border:color-mix(in srgb, var(--accent) 42%, transparent);
  --method-accent-strong:color-mix(in srgb, var(--accent) 16%, transparent);
  max-width:1160px;
  margin:0 auto;
  padding:8px 0 80px;
  color:var(--text);
}
.method a:focus-visible,
.method summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.method .eyebrow,
.method .section-label{color:var(--accent);font-size:12px;font-weight:700;letter-spacing:0.09em;text-transform:uppercase}
.method h1{max-width:900px;margin:12px 0 20px;font-size:clamp(44px,6vw,70px);line-height:1.02;letter-spacing:-0.046em;font-weight:650}
.method .hero-copy{max-width:820px;margin:0;color:var(--text-muted);font-size:19px;line-height:1.67}
.method .hero-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:27px}
.method .meta-pill{padding:6px 9px;border:1px solid var(--border-md);border-radius:7px;background:var(--surface);color:var(--text-muted);font-size:11px}
.method .meta-pill.accent{border-color:var(--method-accent-border);background:var(--accent-glow);color:var(--accent)}
.method .method-nav{
  position:sticky;
  top:calc(var(--header-height) + var(--method-nav-gap));
  z-index:80;
  margin-top:42px;
  padding:10px 11px;
  display:flex;
  gap:4px;
  overflow-x:auto;
  border:1px solid var(--border-md);
  border-radius:11px;
  background:color-mix(in srgb, var(--surface) 97%, transparent);
  backdrop-filter:blur(12px);
  scrollbar-width:thin;
}
.method .method-nav::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:calc(var(--header-height) + var(--method-nav-gap));background:var(--bg)}
.method .method-nav a{flex:0 0 auto;padding:6px 9px;border-radius:6px;color:var(--text-muted);font-size:12px;font-weight:600;text-decoration:none;white-space:nowrap}
.method .method-nav a:hover,
.method .method-nav a.active{background:var(--surface2);color:var(--text)}
.method section{padding-top:104px;scroll-margin-top:calc(var(--header-height) + var(--method-nav-height) + 32px)}
.method h2{max-width:850px;margin:10px 0 16px;font-size:35px;line-height:1.12;letter-spacing:-0.026em;font-weight:650}
.method .section-intro{max-width:810px;margin:0 0 34px;color:var(--text-muted);font-size:17px;line-height:1.67}
.method .callout{max-width:880px;margin-top:22px;padding:20px 22px;border-left:3px solid var(--accent);border-radius:0 10px 10px 0;background:var(--accent-glow);color:var(--text-muted);font-size:14px}
.method .callout strong{color:var(--text)}
.method .principles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:30px}
.method .principle{padding:23px;border:1px solid var(--border-md);border-radius:12px;background:var(--surface)}
.method .principle-number{width:32px;height:32px;display:flex;align-items:center;justify-content:center;margin-bottom:16px;border-radius:8px;background:var(--accent-glow);color:var(--accent);font-weight:750}
.method .principle h3{margin:0 0 8px;font-size:16px}
.method .principle p{margin:0;color:var(--text-muted);font-size:14px}
.method .architecture{margin-top:36px;padding:30px;border:1px solid var(--border-md);border-radius:14px;background:var(--surface)}
.method .architecture-flow{display:flex;flex-direction:column;align-items:center}
.method .arch-node{width:min(100%,390px);padding:15px 17px;border:1px solid var(--border-md);border-radius:9px;background:var(--surface2);text-align:center}
.method .arch-node strong{display:block;margin-bottom:4px}
.method .arch-node span{color:var(--text-muted);font-size:12px}
.method .arch-node.accent{border-color:var(--method-accent-border);background:var(--accent-glow)}
.method .arch-node.human{border-color:var(--method-accent-border);background:var(--method-accent-strong)}
.method .arch-arrow{padding:6px 0;color:var(--accent);font-size:19px}
.method .parallel-group{width:100%;padding:19px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;border:1px dashed var(--border-md);border-radius:12px;background:color-mix(in srgb, var(--surface2) 65%, transparent)}
.method .parallel-node,.method .critic-node{padding:15px 11px;border:1px solid var(--border-md);border-radius:8px;background:var(--surface);text-align:center}
.method .parallel-node strong,.method .critic-node strong{display:block;margin-bottom:4px;font-size:13px}
.method .parallel-node span,.method .critic-node span{color:var(--text-muted);font-size:11px}
.method .parallel-label{width:100%;margin-bottom:8px;color:var(--text-muted);text-align:center;font-size:11px;letter-spacing:0.07em;text-transform:uppercase}
.method .critic-group{width:100%;padding:19px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;border:1px dashed var(--method-accent-border);border-radius:12px;background:var(--accent-glow)}
.method .roles{display:flex;flex-direction:column;gap:10px;margin-top:30px}
.method .role-detail{overflow:hidden;border:1px solid var(--border-md);border-radius:11px;background:var(--surface)}
.method .role-detail summary{list-style:none;padding:17px 19px;display:flex;align-items:center;justify-content:space-between;gap:20px;cursor:pointer}
.method .role-detail summary::-webkit-details-marker{display:none}
.method .role-summary-left{display:flex;align-items:center;gap:10px}
.method .role-summary-left strong{font-size:15px}
.method .internal-pill{padding:4px 7px;border:1px solid var(--border-md);border-radius:5px;background:var(--surface2);color:var(--text-muted);font-family:var(--font-mono);font-size:10px}
.method .expand-mark{display:inline-block;color:var(--accent);font-size:17px;line-height:1}
.method .role-detail[open] .expand-mark{transform:rotate(45deg)}
.method .role-body{padding:0 19px 19px;border-top:1px solid var(--border)}
.method .boundary-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;padding-top:18px}
.method .boundary{padding:16px;border:1px solid var(--border);border-radius:8px;background:var(--surface2)}
.method .boundary h4{margin:0 0 8px;color:var(--text-muted);font-size:11px;letter-spacing:0.07em;text-transform:uppercase}
.method .boundary p{margin:0;font-size:13px;line-height:1.55}
.method .model-layout{display:grid;grid-template-columns:0.9fr 1.1fr;gap:18px;margin-top:30px}
.method .model-copy,.method .model-map{padding:25px;border:1px solid var(--border-md);border-radius:13px;background:var(--surface)}
.method .model-copy h3{margin-top:0}
.method .model-copy p{color:var(--text-muted);font-size:14px}
.method .model-row{padding:12px 0;display:grid;grid-template-columns:150px minmax(0,1fr) auto;gap:14px;align-items:center;border-bottom:1px solid var(--border)}
.method .model-row:last-child{border-bottom:0}
.method .model-role{font-size:13px;font-weight:650}
.method .model-purpose{color:var(--text-muted);font-size:12px}
.method .model-pill{padding:5px 8px;border:1px solid var(--method-accent-border);border-radius:6px;background:var(--accent-glow);color:var(--accent);font-size:10px;white-space:nowrap}
.method .auto-box{margin-top:30px;padding:27px;display:grid;grid-template-columns:0.8fr 1.2fr;gap:25px;border:1px solid var(--method-accent-border);border-radius:14px;background:var(--accent-glow)}
.method .auto-badge{display:inline-block;margin-bottom:12px;padding:6px 9px;border-radius:6px;background:var(--surface);color:var(--accent);font-size:11px;font-weight:700}
.method .auto-box h3{margin-top:0}
.method .auto-box p{color:var(--text-muted);font-size:14px}
.method .auto-rules{display:flex;flex-direction:column}
.method .auto-rule{padding:10px 0;display:flex;justify-content:space-between;gap:20px;border-bottom:1px solid var(--method-accent-border);font-size:13px}
.method .auto-rule:last-child{border-bottom:0}
.method .auto-rule span:last-child{color:var(--text-muted);text-align:right}
.method .provenance{margin-top:32px;padding:29px;border:1px solid var(--border-md);border-radius:14px;background:var(--surface)}
.method .provenance-flow{display:grid;grid-template-columns:repeat(7,auto);gap:10px;align-items:center;justify-content:center}
.method .prov-node{padding:13px 14px;border:1px solid var(--border-md);border-radius:8px;background:var(--surface2);text-align:center;font-size:12px}
.method .prov-arrow,.method .authority-arrow{color:var(--accent);font-size:18px}
.method .authority-arrow{text-align:center;font-size:20px}
.method .provenance-note{margin:21px 0 0;color:var(--text-muted);font-size:13px}
.method .critic-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:30px}
.method .critic-card{padding:23px;border:1px solid var(--border-md);border-radius:12px;background:var(--surface)}
.method .critic-card .status{display:inline-block;margin-bottom:14px;padding:4px 7px;border:1px solid var(--border-md);border-radius:5px;color:var(--text-muted);font-size:10px}
.method .critic-card h3{margin:0 0 8px;font-size:16px}
.method .critic-card p{margin:0;color:var(--text-muted);font-size:13px}
.method .principal-layout{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:30px}
.method .principal-card{padding:25px;border:1px solid var(--border-md);border-radius:13px;background:var(--surface)}
.method .principal-card.accent{border-color:var(--method-accent-border)}
.method .principal-card h3{margin-top:0}
.method .principal-list{margin:0;padding-left:19px;color:var(--text-muted);font-size:14px}
.method .principal-list li{margin:7px 0}
.method .authority{margin-top:32px;padding:30px;display:grid;grid-template-columns:minmax(0,1fr) 60px minmax(0,1fr) 60px minmax(0,1fr);align-items:center;border:1px solid var(--method-accent-border);border-radius:14px;background:var(--accent-glow)}
.method .authority-node{text-align:center}
.method .authority-node strong{display:block;margin-bottom:5px}
.method .authority-node span{color:var(--text-muted);font-size:12px}
.method .authority-human{padding:18px;border:1px solid var(--method-accent-border);border-radius:9px;background:var(--surface)}
.method .audit-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:30px}
.method .audit-card{padding:22px;border:1px solid var(--border-md);border-radius:11px;background:var(--surface)}
.method .audit-card h3{margin:0 0 7px;font-size:15px}
.method .audit-card p{margin:0;color:var(--text-muted);font-size:13px}
.method .context-line{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:30px}
.method .context-card{padding:20px;border:1px solid var(--border-md);border-radius:11px;background:var(--surface)}
.method .context-card strong{display:block;margin-bottom:7px}
.method .context-card p{margin:0;color:var(--text-muted);font-size:13px}
.method .limit-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;margin-top:30px}
.method .limit{padding:21px;border:1px solid var(--border-md);border-radius:11px;background:var(--surface)}
.method .limit strong{display:block;margin-bottom:7px}
.method .limit p{margin:0;color:var(--text-muted);font-size:13px}
.method .limit.warning{border-color:color-mix(in srgb, var(--major) 45%, var(--border-md))}
.method .not-do{margin-top:30px;overflow:hidden;border:1px solid var(--border-md);border-radius:12px;background:var(--surface)}
.method .not-do-row{padding:16px 19px;display:grid;grid-template-columns:26px minmax(0,1fr);gap:10px;border-bottom:1px solid var(--border)}
.method .not-do-row:last-child{border-bottom:0}
.method .not-mark{color:var(--accent);font-weight:750}
.method .not-do-row strong{display:block;margin-bottom:3px;font-size:14px}
.method .not-do-row span{color:var(--text-muted);font-size:13px}
.method .transparency{margin-top:30px;padding:27px;display:grid;grid-template-columns:1fr 1fr;gap:22px;border:1px solid var(--border-md);border-radius:13px;background:var(--surface)}
.method .transparency h3{margin-top:0}
.method .transparency p{color:var(--text-muted);font-size:14px}
.method .version-panel{margin-top:30px;padding:27px;display:flex;align-items:center;justify-content:space-between;gap:28px;border:1px solid var(--method-accent-border);border-radius:13px;background:var(--accent-glow)}
.method .version-panel h3{margin:0 0 6px}
.method .version-panel p{margin:0;color:var(--text-muted);font-size:13px}
.method .version-number{flex:0 0 auto;padding:9px 12px;border:1px solid var(--method-accent-border);border-radius:8px;background:var(--surface);color:var(--accent);font-family:var(--font-mono);font-size:12px}
.method .final-panel{margin-top:34px;padding:31px;display:flex;align-items:center;justify-content:space-between;gap:30px;border:1px solid var(--border-md);border-radius:13px;background:var(--surface)}
.method .final-panel h3{margin:0 0 6px;font-size:21px}
.method .final-panel p{margin:0;color:var(--text-muted)}
.method .final-actions{display:flex;gap:8px;white-space:nowrap}
.method .button-primary,.method .button-secondary{display:inline-flex;align-items:center;padding:9px 13px;border-radius:7px;font-size:13px;font-weight:650;text-decoration:none}
.method .button-primary{background:var(--accent);color:#fff}
.method .button-primary:hover{background:var(--accent-dim)}
.method .button-secondary{border:1px solid var(--border-md);background:transparent;color:var(--text)}
.method .button-secondary:hover{background:var(--surface2)}
.method footer{margin-top:90px;padding-top:24px;display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--border);color:var(--text-dim);font-size:12px}
[data-theme="dark"] .method .meta-pill.accent,
[data-theme="dark"] .method .principle-number,
[data-theme="dark"] .method .model-pill,
[data-theme="dark"] .method .auto-badge,
[data-theme="dark"] .method .version-number,
[data-theme="dark"] .method .expand-mark,
[data-theme="dark"] .method .not-mark{color:#f3b499}
@media (max-width:1024px){
  .method{padding-bottom:48px}
  .method section{padding-top:56px}
  .method .method-nav{max-width:100%;min-width:0;margin-top:28px}
  .method .method-nav a{min-height:36px;display:inline-flex;align-items:center}
  .method .button-primary,.method .button-secondary{min-height:44px}
  .method .principles,
  .method .critic-cards,
  .method .critic-group,
  .method .boundary-grid,
  .method .principal-layout,
  .method .model-layout,
  .method .auto-box,
  .method .transparency,
  .method .provenance-flow,
  .method .authority{grid-template-columns:1fr}
  .method .parallel-group,.method .context-line{grid-template-columns:repeat(2,minmax(0,1fr))}
  .method .authority{gap:12px}
  .method .authority-arrow,.method .prov-arrow{transform:rotate(90deg)}
}
@media (min-width:768px) and (max-width:1024px){
  .method .principles,.method .critic-cards,.method .audit-grid,.method .limit-grid,.method .boundary-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:767px){
  .method h1{font-size:34px}
  .method h2{font-size:26px}
  .method .hero-copy,.method .section-intro{font-size:16px}
  .method section{padding-top:40px}
  .method .architecture,.method .provenance,.method .auto-box,.method .final-panel,.method .version-panel{padding:18px}
  .method .auto-rule{flex-wrap:wrap;align-items:flex-start}
  .method .auto-rule span:last-child{text-align:left}
  .method .role-detail summary{min-height:44px;align-items:flex-start}
  .method .parallel-node span,.method .critic-node span,.method .principle p,.method .critic-card p{font-size:14px}
}
@media (max-width:720px){
  .method h1{font-size:34px}
  .method h2{font-size:26px}
  .method .parallel-group,
  .method .context-line,
  .method .audit-grid,
  .method .limit-grid,
  .method .model-row{grid-template-columns:1fr}
  .method .model-pill{justify-self:start}
  .method .version-panel,
  .method .final-panel{align-items:flex-start;flex-direction:column}
  .method .final-actions{flex-wrap:wrap;white-space:normal}
  .method footer{flex-direction:column;gap:7px}
}
@media (prefers-reduced-motion:reduce){
  .method .method-nav{scroll-behavior:auto}
}
