.assistant-page { --assistant-space: clamp(4.5rem, 8vw, 8rem); --assistant-canvas:#e8ecef; }
html[data-theme="dark"] .assistant-page { --assistant-canvas:var(--soft); }
.assistant-subnav { display:flex; align-items:center; justify-content:space-between; gap:var(--s3); min-height:76px; border-bottom:1px solid var(--line); font:var(--small)/1.5 var(--mono); }
.assistant-subnav > div { display:flex; gap:var(--s4); }
.assistant-subnav a { padding-block:var(--s2); color:var(--muted); }
.assistant-subnav a[aria-current] { color:var(--blue-text); }
.assistant-hero { display:grid; grid-template-columns:minmax(0,1.12fr) minmax(0,1fr); align-items:center; gap:clamp(2rem,5vw,5rem); padding-block:clamp(2.5rem,5vw,5rem); }
.assistant-kicker,.assistant-project-note,.assistant-art-index,.assistant-index,.assistant-flow-number,.assistant-flow-note { font:var(--small)/1.6 var(--mono); }
.assistant-kicker { letter-spacing:.07em; text-transform:uppercase; color:var(--muted); }
.assistant-name { display:block; font-size:clamp(6rem,10vw,10rem); line-height:.95; letter-spacing:-.075em; margin-block:var(--s3) var(--s4); }
.assistant-period { color:var(--blue-text); }
.assistant-headline { display:block; font-size:clamp(2.2rem,3.5vw,3.7rem); line-height:1.08; letter-spacing:-.055em; }
.assistant-headline > span { display:block; }
.assistant-lead { max-width:57ch; margin-top:var(--s4); color:var(--muted); font-size:1.05rem; line-height:1.7; }
.assistant-button { display:inline-flex; align-items:center; justify-content:space-between; gap:var(--s4); min-height:52px; margin-top:var(--s4); padding:1rem 1.25rem; background:var(--blue); color:var(--on-blue); font-size:.9rem; font-weight:700; }
.assistant-button svg,.assistant-link svg { width:20px; height:20px; }
.assistant-button:hover { background:var(--blue-text); color:var(--paper); }
.assistant-project-note { margin-top:var(--s2); font-size:.67rem; color:var(--muted); }
.assistant-portrait,.assistant-team-art { position:relative; margin:0; align-self:stretch; display:flex; flex-direction:column; justify-content:center; min-width:0; background:var(--assistant-canvas); }
.assistant-art-index { position:absolute; top:var(--s3); left:var(--s3); color:var(--muted); z-index:1; font-size:.65rem; letter-spacing:.08em; }
.assistant-character { display:block; width:100%; height:auto; object-fit:contain; }
.assistant-portrait .assistant-character { aspect-ratio:1; max-height:520px; }
.assistant-portrait figcaption { display:flex; flex-direction:column; gap:.35rem; padding:0 var(--s4) var(--s4); font:var(--small)/1.6 var(--mono); color:var(--muted); }
.assistant-role { color:var(--ink); }
.assistant-section { padding-block:var(--assistant-space); }
.assistant-section-heading { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:end; gap:var(--s4); margin-bottom:var(--s5); }
.assistant-section-heading > .assistant-kicker { grid-column:1/-1; }
.assistant-section-heading h2 { font-size:clamp(2rem,4vw,3.8rem); max-width:16ch; }
.assistant-section-heading > p:not(.assistant-kicker) { color:var(--muted); max-width:52ch; }
.assistant-cases { border-top:1px solid var(--line); }
.assistant-case { border-bottom:1px solid var(--line); }
.assistant-case summary { display:grid; grid-template-columns:65px minmax(0,1fr) 24px; align-items:center; gap:var(--s3); padding-block:var(--s4); cursor:pointer; list-style:none; font-size:clamp(1.3rem,2.1vw,2rem); font-weight:600; letter-spacing:-.035em; }
.assistant-case summary::-webkit-details-marker,.assistant-faq summary::-webkit-details-marker { display:none; }
.assistant-index { color:var(--muted); font-weight:400; }
.assistant-expand { font:300 1.75rem/1 var(--font); }
.assistant-case[open] .assistant-expand { transform:rotate(45deg); }
.assistant-case-body { display:grid; grid-template-columns:1fr 1fr; gap:var(--s5); padding:0 0 var(--s4) calc(65px + var(--s3)); color:var(--muted); }
.assistant-example { padding-left:var(--s3); border-left:2px solid var(--blue-text); font-size:.92rem; }
.assistant-flow-section { padding-block:var(--assistant-space); background:var(--soft); }
.assistant-flow { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--s5); }
.assistant-flow > li { border-top:1px solid var(--line); padding-top:var(--s3); }
.assistant-flow-number { display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; border:1px solid var(--line); margin-bottom:var(--s4); }
.assistant-flow h3 { font-size:1.45rem; line-height:1.3; margin-bottom:var(--s2); }
.assistant-flow p { color:var(--muted); }
.assistant-flow-note { max-width:90ch; color:var(--muted); margin-top:var(--s5); font-size:.72rem; }
.assistant-boundary { display:grid; grid-template-columns:1fr 1fr; gap:var(--s6); }
.assistant-boundary h2 { margin-top:var(--s3); max-width:17ch; }
.assistant-boundary p:not(.assistant-kicker) { max-width:55ch; margin-top:var(--s4); color:var(--muted); }
.assistant-boundary ul { padding-top:var(--s6); }
.assistant-boundary li { position:relative; border-top:1px solid var(--line); padding:var(--s3) 0 var(--s3) var(--s4); }
.assistant-boundary li::before { content:'+'; position:absolute; left:0; color:var(--blue-text); font:1.2rem var(--mono); }
.assistant-paired { display:grid; grid-template-columns:1fr 1.35fr; gap:var(--s6); align-items:center; background:var(--assistant-canvas); padding-block:var(--s4); }
.assistant-paired-art img { width:100%; max-height:350px; }
.assistant-paired h2 { margin-block:var(--s3); max-width:20ch; }
.assistant-paired p:not(.assistant-kicker) { max-width:55ch; color:var(--muted); }
.assistant-link { display:flex; align-items:center; justify-content:space-between; gap:var(--s3); max-width:fit-content; min-height:44px; padding-block:.6rem; border-bottom:1px solid var(--line); font-size:.87rem; font-weight:600; }
.assistant-link:hover { color:var(--blue-text); border-color:currentColor; }
.assistant-paired .assistant-link { margin-top:var(--s3); }
.assistant-faq { display:grid; grid-template-columns:1fr 1fr; gap:var(--s6); }
.assistant-faq h2 { max-width:15ch; margin-top:var(--s3); }
.assistant-faq details { border-top:1px solid var(--line); }
.assistant-faq details:last-child { border-bottom:1px solid var(--line); }
.assistant-faq summary { display:flex; justify-content:space-between; align-items:baseline; gap:var(--s4); cursor:pointer; padding-block:var(--s3); list-style:none; font-size:1.05rem; font-weight:600; }
.assistant-faq summary > span { font-weight:400; }
.assistant-faq details[open] summary > span { transform:rotate(45deg); }
.assistant-faq details p { padding-bottom:var(--s4); color:var(--muted); }
.assistant-team-name { display:block; font-size:clamp(4rem,6.8vw,7rem); line-height:1.02; letter-spacing:-.07em; margin-block:var(--s3) var(--s4); }
.assistant-team-name > span:first-child { color:var(--muted); font-weight:400; }
.assistant-team-hero .assistant-headline { font-size:clamp(2rem,3.1vw,3.2rem); }
.assistant-team-art { min-height:560px; overflow:hidden; }
.assistant-team-art .assistant-character { position:absolute; width:65%; }
.assistant-team-kibu { left:-4%; bottom:6%; }
.assistant-team-nobu { right:0; top:6%; }
.assistant-team-art figcaption { position:absolute; bottom:var(--s3); inset-inline:var(--s3); font:var(--label)/1.5 var(--mono); color:var(--muted); }
.assistant-role-list { border-top:1px solid var(--line); }
.assistant-role-list article { display:grid; grid-template-columns:40px minmax(0,1fr) minmax(0,1.35fr) auto; align-items:start; gap:var(--s4); padding-block:var(--s5); border-bottom:1px solid var(--line); }
.assistant-role-list h3 { font-size:3rem; margin-block:var(--s1) var(--s2); }
.assistant-role-list article > p { color:var(--muted); }
.assistant-role-list article > div > p:last-child { max-width:23ch; font-size:.85rem; color:var(--muted); }
.assistant-handover { display:grid; grid-template-columns:1fr auto 1fr auto 1fr auto 1fr; gap:var(--s3); align-items:center; }
.assistant-handover > div { border-top:1px solid var(--line); padding-top:var(--s3); min-width:0; align-self:stretch; }
.assistant-handover strong,.assistant-handover > div > span { display:block; }
.assistant-handover strong { margin-block:var(--s3) var(--s2); font-size:1.25rem; letter-spacing:-.03em; }
.assistant-handover > div > span:last-child { color:var(--muted); font-size:.9rem; }
.assistant-handover > span { color:var(--blue-text); }
.assistant-comparison table { width:100%; border-collapse:collapse; text-align:left; table-layout:fixed; }
.assistant-comparison th,.assistant-comparison td { border-bottom:1px solid var(--line); padding:var(--s3) var(--s4) var(--s3) 0; vertical-align:top; }
.assistant-comparison thead th { font-size:1.6rem; letter-spacing:-.04em; }
.assistant-comparison thead th:first-child { font:var(--small)/1.7 var(--mono); color:var(--muted); width:25%; }
.assistant-comparison tbody th { font-size:.9rem; font-weight:500; }
.assistant-comparison td { color:var(--muted); }
.assistant-film { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.75fr); gap:var(--s7); align-items:center; padding-block:var(--s5) var(--assistant-space); }
.assistant-film h2 { margin-block:var(--s3); }
.assistant-film > div > p:not(.assistant-kicker) { color:var(--muted); max-width:45ch; }
.assistant-film video { display:block; width:100%; max-width:350px; height:auto; justify-self:center; background:var(--solid-ink); }
.assistant-transcript { border-block:1px solid var(--line); margin-top:var(--s4); max-width:56ch; }
.assistant-transcript summary { cursor:pointer; padding-block:var(--s3); font-size:.9rem; }
.assistant-transcript p { padding-block:0 var(--s3); font-size:.92rem; color:var(--muted); }
.assistant-film-links { display:flex; flex-direction:column; align-items:start; gap:var(--s2); margin-top:var(--s4); }
.assistant-page .contact-intro h2 { max-width:17ch; }
.assistant-page .contact-intro > p { color:var(--muted); }
@media (max-width:1050px) {
  .assistant-hero { gap:var(--s4); }
  .assistant-hero .assistant-headline { font-size:clamp(2rem,3.6vw,3rem); }
  .assistant-team-art { min-height:500px; }
  .assistant-role-list article { grid-template-columns:30px 1fr 1.3fr; }
  .assistant-role-list article > .assistant-link { grid-column:2/-1; }
  .assistant-handover { gap:var(--s2); }
  .assistant-boundary,.assistant-faq,.assistant-paired { gap:var(--s4); }
}
@media (max-width:720px) {
  .assistant-page { --assistant-space:4.5rem; }
  .assistant-subnav { min-height:64px; gap:var(--s2); font-size:.7rem; }
  .assistant-subnav > div { gap:var(--s3); }
  .assistant-hero { grid-template-columns:1fr; gap:var(--s5); padding-top:var(--s4); }
  .assistant-name { font-size:clamp(4.6rem,22vw,7rem); margin-block:var(--s3); }
  .assistant-hero .assistant-headline { font-size:clamp(2rem,8vw,2.8rem); }
  .assistant-lead { font-size:1rem; margin-top:var(--s3); }
  .assistant-portrait .assistant-character { max-height:360px; }
  .assistant-portrait figcaption { padding-inline:var(--s3); }
  .assistant-hero:not(.assistant-team-hero) { position:relative; }
  .assistant-hero:not(.assistant-team-hero) .assistant-portrait { position:absolute; top:1.8rem; right:var(--gutter); width:clamp(100px,34vw,150px); background:transparent; }
  .assistant-hero:not(.assistant-team-hero) .assistant-portrait .assistant-character { max-height:none; }
  .assistant-hero:not(.assistant-team-hero) .assistant-portrait figcaption,
  .assistant-hero:not(.assistant-team-hero) .assistant-portrait .assistant-art-index { display:none; }
  .assistant-section-heading,.assistant-case-body,.assistant-boundary,.assistant-faq { grid-template-columns:1fr; gap:var(--s3); }
  .assistant-section-heading h2 { max-width:19ch; }
  .assistant-case summary { grid-template-columns:30px minmax(0,1fr) 20px; gap:var(--s2); font-size:1.25rem; }
  .assistant-case-body { padding-left:0; padding-bottom:var(--s4); }
  .assistant-flow { grid-template-columns:1fr; gap:var(--s4); }
  .assistant-flow-number { margin-bottom:var(--s3); }
  .assistant-boundary ul { padding-top:var(--s2); }
  .assistant-paired { grid-template-columns:1fr; gap:0; padding-bottom:var(--s5); }
  .assistant-paired-art img { max-height:250px; }
  .assistant-faq > div:last-child { margin-top:var(--s3); }
  .assistant-team-name { font-size:clamp(3.6rem,13vw,5.5rem); }
  .assistant-team-art { min-height:370px; }
  .assistant-team-art .assistant-character { width:68%; max-height:350px; }
  .assistant-team-kibu { left:0; bottom:4%; }
  .assistant-team-nobu { right:0; top:0; }
  .assistant-role-list article { grid-template-columns:25px 1fr; gap:var(--s3); }
  .assistant-role-list article > p,.assistant-role-list article > .assistant-link { grid-column:2; }
  .assistant-role-list h3 { font-size:2.5rem; }
  .assistant-handover { grid-template-columns:1fr; gap:var(--s3); }
  .assistant-handover > span { transform:rotate(90deg); width:20px; justify-self:center; }
  .assistant-handover > div { display:grid; grid-template-columns:30px 1fr; column-gap:var(--s3); }
  .assistant-handover strong { margin-top:0; }
  .assistant-handover > div > span:last-child { grid-column:2; }
  .assistant-comparison th,.assistant-comparison td { padding-right:var(--s2); font-size:.8rem; overflow-wrap:anywhere; }
  .assistant-comparison thead th { font-size:1.3rem; }
  .assistant-comparison thead th:first-child { width:25%; font-size:.65rem; }
  .assistant-comparison tbody th { font-size:.75rem; }
  .assistant-film { grid-template-columns:1fr; gap:var(--s5); }
  .assistant-film video { max-width:300px; }
}
