/* TINGHEXIN V0.1A — warm base / precise labels / restrained signal geometry */
:root {
  --paper: #f7f7f0;
  --paper-deep: #eeefe7;
  --ink: #202a25;
  --muted: #5d665f;
  --green: #355c47;
  --green-dark: #243c31;
  --sage: #dce4d7;
  --teal: #dce5e1;
  --warm: #e5e0d4;
  --line: #ced2c7;
  --inverse: #f3f5ed;
  --font-brand: "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", system-ui, sans-serif;
  --font-meta: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --space-1: 8px;
  --space-2: 16px;
  --space-3: 24px;
  --space-4: 32px;
  --space-6: 48px;
  --space-8: 64px;
  --space-12: 96px;
  --gutter: clamp(24px, 4.5vw, 88px);
  --max-width: 1600px;
  --motion-duration: 650ms;
  --motion-ease: cubic-bezier(.2,.7,.2,1);
}
* { box-sizing: border-box; }
html { scroll-behavior: auto; scroll-padding-top: 30px; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--font-brand); font-size: 16px; -webkit-font-smoothing: antialiased; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; font: inherit; cursor: pointer; }
a { color: inherit; text-decoration: none; }
button { border: 0; }
h1,h2,h3,p,figure,ul,ol,dl,dd { margin: 0; }
ul,ol { padding: 0; list-style: none; }
button:focus-visible,a:focus-visible { outline: 2px solid var(--green); outline-offset: 6px; }
::selection { background: var(--sage); color: var(--green-dark); }
.wrap { width: min(100% - var(--gutter) * 2, var(--max-width)); margin-inline: auto; }
.section { padding-block: 64px 72px; }
.meta,.eyebrow,.tag,.status,.field-en { font-family: var(--font-meta); font-size: 11px; line-height: 1.6; letter-spacing: .055em; font-weight: 400; }
.eyebrow { font-size: 12px; letter-spacing: .065em; }
.signal-dot,.status i { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--green); margin-right: 10px; flex-shrink: 0; }
.status { display: inline-flex; align-items: center; gap: 0; white-space: nowrap; color: var(--green); font-size: 12px; }
.status i { width: 5px; height: 5px; margin-right: 7px; }
.text-link { display: inline-flex; gap: 28px; align-items: center; width: fit-content; min-height: 44px; padding: 8px 0; background: none; border-bottom: 1px solid currentColor; font-size: 14px; }
.text-link span,.button span { transition: transform 200ms; }
.button { min-height: 52px; padding: 14px 23px; display: inline-flex; align-items: center; justify-content: space-between; gap: 36px; color: var(--inverse); background: var(--green-dark); font-size: 14px; }
.button:hover { background: var(--green); }
@media (hover:hover) { .text-link:hover span,.button:hover span { transform: translate(3px,-3px); } }
.section-rule { position: relative; display: flex; justify-content: space-between; align-items: baseline; gap: 20px; padding-top: 21px; border-top: 1px solid var(--line); margin-bottom: 42px; }
.section-rule:before { content: ''; position: absolute; left: 0; top: -3px; width: 5px; height: 5px; background: var(--green); border-radius: 50%; }
.section-rule > .meta { color: var(--muted); }
h2 { font-size: clamp(32px,3.3vw,52px); line-height: 1.35; font-weight: 450; letter-spacing: -.04em; }
.skip-link { position: absolute; top: -100px; left: 20px; z-index: 100; background: var(--ink); color: white; padding: 14px; }
.skip-link:focus { top: 10px; }
.site-header { height: 94px; display: flex; align-items: center; justify-content: space-between; gap: 30px; border-bottom: 1px solid var(--line); position: relative; z-index: 5; }
.wordmark { display: flex; align-items: center; gap: 12px; }
.wordmark .brand-mark { width: 35px; height: 45px; object-fit: contain; }
.wordmark .brand-type { width: 116px; height: auto; }
.wordmark > span { font-family: Arial,sans-serif; font-size: 20px; font-weight: 600; letter-spacing: .08em; }
.wordmark small { font-family: var(--font-brand); display: block; font-size: 11px; letter-spacing: .5em; margin-top: 3px; font-weight: 400; }
.site-header > nav { display: flex; align-items: center; gap: clamp(20px,3vw,44px); }
.site-header nav a,.site-header nav button { padding: 12px 0; font-size: 13px; background: none; text-align: left; }
.site-header nav a span,.site-header nav button span { display: block; margin-top: 3px; font-family: var(--font-meta); font-size: 10px; color: var(--muted); }
.header-contact { border: 0; font-size: 13px; }
.menu-toggle { display: none; }
#mobile-nav[hidden] { display: none; }
.hero { min-height: min(750px, calc(89svh - 94px)); padding-block: clamp(52px,6.7vh,82px) 54px; display: grid; grid-template-columns: .94fr 1.06fr; column-gap: 5%; align-items: start; position: relative; }
.hero-left { grid-column: 1; grid-row: 1; }
.hero-copy { grid-column: 1; grid-row: 1; }
.hero .eyebrow { font-size: 11px; display: flex; align-items: center; }
h1 { font-size: clamp(46px,5vw,80px); line-height: 1.23; letter-spacing: -.025em; font-weight: 450; margin-block: 33px 26px; }
h1 span { color: var(--green); }
.hero-first-line { color: var(--ink); font-weight: 470; -webkit-text-stroke: .15px currentColor; }
.signal-cta { position: relative; }
.signal-cta > span { position: relative; transition: transform 220ms ease; }
.signal-cta > span::before { content: ''; width: 15px; height: 1px; background: currentColor; position: absolute; right: 7px; top: 50%; transform: scaleX(0); transform-origin: right; transition: transform 220ms ease; }
.signal-cta:is(:hover,:focus-visible) > span { transform: translateX(3px); }
.signal-cta:is(:hover,:focus-visible) > span::before { transform: scaleX(1); }
@media (prefers-reduced-motion:reduce) { .signal-cta > span,.signal-cta > span::before { transition: none; transform: none!important; } .signal-cta > span::before { display: none; } }
.hero-description { max-width: 445px; font-size: 15px; line-height: 1.85; color: var(--muted); }
.hero-description p:first-child { color: var(--ink); font-size: 18px; font-weight: 600; margin-bottom: 10px; }
.hero-actions { grid-column: 1; grid-row: 2; display: flex; align-items: center; gap: 30px; margin-top: 27px; }
.hero-bottom { grid-column: 1/-1; grid-row: 3; align-self: end; display: flex; justify-content: space-between; padding-block: 32px 23px; color: var(--muted); }
.hero-bottom > a { display: flex; align-items: center; gap: 20px; }
.hero-bottom > span { font-family: var(--font-brand); font-size: 12px; letter-spacing: .1em; }
.living-evidence { grid-column: 2; grid-row: 1; min-width: 0; padding-top: 3px; align-self: start; }
.canvas-meta { display: flex; justify-content: space-between; margin-bottom: 16px; color: var(--muted); font-size: 10px; }
.evidence { position: relative; min-width: 0; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; color: var(--ink); background: var(--sage); }
.evidence--director { background: var(--green-dark); color: var(--inverse); }
.evidence--music { background: var(--warm); }
.evidence--game { background: var(--teal); }
.evidence-label { position: relative; z-index: 1; display: flex; justify-content: space-between; gap: 16px; margin: 19px 24px 0; padding-bottom: 12px; border-bottom: 1px solid currentColor; font-family: var(--font-meta); font-size: 9px; letter-spacing: .05em; }
.evidence-label .evidence-status { opacity: .8; }
.asset-required { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 22px 16px; }
.asset-required .meta { font-size: 12px; letter-spacing: .17em; }
.asset-required strong { font-size: 13px; font-weight: 400; margin-top: 8px; opacity: .85; }
.asset-spec { font-family: var(--font-meta); font-size: 9px; opacity: .75; margin-top: 17px; }
.asset-cross { width: 27px; height: 27px; position: relative; margin-bottom: 17px; opacity: .6; }
.asset-cross:before,.asset-cross:after { content: ''; position: absolute; background: currentColor; }
.asset-cross:before { width: 1px; height: 100%; left: 50%; top: 0; }
.asset-cross:after { height: 1px; width: 100%; top: 50%; left: 0; }
.evidence figcaption { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 0 24px 19px; font-size: 11px; }
.evidence figcaption > span:last-child { font-size: 10px; opacity: .8; }
.evidence:has(picture) { height: auto; aspect-ratio: auto; }
.evidence picture { display: block; flex: initial; margin-block: 12px; }
.evidence img { width: 100%; height: auto; object-fit: contain; display: block; }
.evidence:has(picture) .evidence-label { border-bottom: none; padding-bottom: 0; }
.evidence--game:has(picture) { background: #202626; color: #e9ece5; }
.hero-small:has(picture) picture { margin-block: 9px; }
.hero-director { height: clamp(245px,22vw,325px); }
.hero-secondary { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; width: 88%; margin: 12px 0 0 auto; }
.hero-small { height: 148px; }
.hero-small .evidence-label { font-size: 8px; margin: 12px 14px 0; padding-bottom: 8px; }
.hero-small .evidence-status,.hero-small .asset-spec,.hero-small .asset-cross { display: none; }
.hero-small .asset-required { padding: 15px 8px; }
.hero-small .asset-required .meta { font-size: 9px; }
.hero-small .asset-required strong { font-size: 10px; }
.hero-small figcaption { padding: 0 14px 12px; font-size: 9px; }
.hero-small figcaption span:last-child { display: none; }
.canvas-footer { display: flex; align-items: center; justify-content: space-between; margin-top: 12px; color: var(--muted); font-size: 8px; }
.signature { width: 140px; height: 35px; }
.canvas-footer .signature { width: 97px; height: 24px; color: var(--green); }
.selected-work { padding-top: 12px; }
.work-heading { display: flex; justify-content: space-between; gap: 32px; align-items: flex-end; margin-bottom: 35px; }
.work-number { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-bottom: 16px; }
.tag { font-size: 9px; padding: 3px 6px; border: 1px solid var(--line); }
.work-intro { display: flex; gap: 55px; align-items: flex-end; }
.work-intro > p { font-size: 18px; line-height: 1.65; }
.work-intro .text-link { white-space: nowrap; }
.featured-evidence { height: clamp(400px,48vw,590px); }
.featured-evidence .evidence-label { margin: 24px 30px 0; font-size: 10px; }
.featured-evidence figcaption { padding: 0 30px 25px; font-size: 13px; }
.featured-evidence .asset-required .meta { font-size: 18px; }
.featured-evidence .asset-required strong { font-size: 16px; margin-top: 16px; }
.featured-evidence .asset-spec { font-size: 11px; margin-top: 22px; }
.featured-evidence .asset-cross { margin-bottom: 28px; width: 45px; height: 45px; }
.work-footer { display: flex; gap: 30px; justify-content: space-between; margin-top: 25px; }
.concepts { display: flex; flex-wrap: wrap; gap: 26px; font-family: var(--font-meta); font-size: 9px; line-height: 1.6; }
.concepts li span { color: var(--muted); margin-right: 9px; }
.project-meta { display: flex; gap: 38px; font-family: var(--font-meta); font-size: 9px; line-height: 1.6; }
.project-meta dt { color: var(--muted); margin-bottom: 5px; }
.project-meta dd { font-size: 10px; white-space: nowrap; }
.more-work { padding-top: 25px; }
.work-pair { display: grid; grid-template-columns: 1.12fr 1fr; gap: 5%; align-items: start; }
.game-work { margin-top: 74px; }
.window-meta { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.music-window { height: 415px; }
.game-window { height: 335px; }
.window-title { display: flex; justify-content: space-between; gap: 15px; margin-top: 24px; }
.window-title h3 { font-size: 26px; font-weight: 450; line-height: 1.3; letter-spacing: -.03em; }
.window-title p { color: var(--muted); font-size: 14px; line-height: 1.6; margin-top: 13px; }
.work-index { font-family: var(--font-meta); font-size: 12px; color: var(--muted); }
.field-lab { display: flex; align-items: center; justify-content: space-between; gap: 32px; margin-top: 60px; padding-block: 26px; border-block: 1px solid var(--line); }
.lab-label { font-size: 13px; }
.lab-label > span { display: block; color: var(--muted); font-size: 9px; margin-top: 5px; }
.field-lab > p { flex: 1; color: var(--muted); font-size: 16px; }
.lab-mark { display: flex; color: var(--green); }
.explore-band { background: var(--paper-deep); }
.explore-band .section { padding-block: 62px 78px; }
.explore-intro { display: flex; justify-content: space-between; align-items: flex-end; gap: 32px; margin-bottom: 57px; }
.explore-intro > p { font-size: 18px; line-height: 1.8; margin-right: 8%; color: var(--muted); }
.explore-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 0; }
.explore-grid article { border-left: 1px solid #bbc3b7; padding: 6px 30px 8px; }
.explore-grid article:first-child { padding-left: 0; border-left: 0; }
.explore-grid .meta { color: var(--muted); font-size: 10px; }
.explore-grid h3 { font-size: clamp(24px,2.3vw,35px); font-weight: 450; margin-top: 35px; min-height: 83px; line-height: 1.15; letter-spacing: -.03em; }
.field-en { display: block; font-size: 9px; margin-top: 5px; }
.explore-grid p { font-size: 14px; line-height: 1.75; margin-top: 24px; color: var(--muted); }
.method { padding-block: 72px 78px; }
.method-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; }
.method-heading > p { font-size: 16px; line-height: 1.8; margin-right: 8%; color: var(--muted); }
.method-visual { margin-top: 28px; }
.method-map { width: 100%; height: auto; display: block; color: var(--green); overflow: visible; }
.map-guides { fill: none; stroke: var(--line); stroke-dasharray: 2 7; }
.map-stage { transition: opacity var(--motion-duration) var(--motion-ease); }
.map-stage path { fill: none; stroke: currentColor; stroke-width: 1.5; }
.map-stage circle { fill: currentColor; }
.map-stage .rejected-path { opacity: .3; stroke-dasharray: 4 5; }
.method-visual[data-phase="1"] .map-stage:not(.stage-1),.method-visual[data-phase="2"] .stage-3,.method-visual[data-phase="2"] .stage-4,.method-visual[data-phase="2"] .stage-5,.method-visual[data-phase="3"] .stage-4,.method-visual[data-phase="3"] .stage-5,.method-visual[data-phase="4"] .stage-5 { opacity: .08; }
.method-steps { display: grid; grid-template-columns: repeat(5,1fr); gap: 0; }
.step-button { display: flex; flex-direction: column; gap: 10px; text-align: left; background: transparent; padding: 22px 16px 22px 0; width: 100%; border-top: 1px solid var(--line); position: relative; }
.step-button:before { content: ''; position: absolute; left: 0; top: -2px; height: 3px; width: 0; background: var(--green); transition: width var(--motion-duration); }
.step-button[aria-pressed="true"]:before { width: 70%; }
.step-button .meta { color: var(--muted); }
.step-button strong { font-size: clamp(18px,1.8vw,26px); font-weight: 450; letter-spacing: -.03em; }
.step-button > span:last-child { font-size: 14px; }
.method-caption { border-top: 1px solid var(--line); display: flex; align-items: center; gap: 25px; justify-content: space-between; margin-top: 12px; padding-top: 18px; }
.method-caption > p { color: var(--muted); font-size: 14px; line-height: 1.7; }
.motion-toggle { flex-shrink: 0; font-size: 12px; }
.research-band { background: #f0f1e9; }
.research-band .section { padding-block: 62px 65px; }
.research-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 28px; margin-bottom: 36px; }
.research-heading > p { font-size: 14px; line-height: 1.85; color: var(--muted); }
.draft-notice { font-size: 12px; }
.note { display: grid; grid-template-columns: 130px 1fr 235px; align-items: center; gap: 28px; padding-block: 24px; border-top: 1px solid var(--line); }
.note:last-child { border-bottom: 1px solid var(--line); }
.note-code { display: flex; flex-direction: column; gap: 12px; }
.note-glyph { display: block; height: 29px; overflow: hidden; color: var(--green); }
.note-glyph .signature { width: 82px; height: 24px; }
.glyph-1 .signature { transform: rotate(180deg); }
.glyph-2 .signature { transform: scaleX(-1); }
.note-main > p { font-size: 9px; color: var(--muted); margin-bottom: 9px; }
.note-main h3 { font-weight: 400; font-size: 20px; line-height: 1.55; max-width: 590px; }
.note-meta { display: flex; flex-direction: column; gap: 8px; color: var(--muted); }
.note-meta .meta { font-size: 9px; }
.note-meta > span:not(.meta),.note-meta time { font-size: 11px; }
.closing { padding-block: 60px 78px; }
.closing-body { display: flex; justify-content: space-between; align-items: center; gap: 40px; }
.closing h2 { font-size: clamp(48px,5.4vw,80px); color: var(--green); line-height: 1.2; }
.closing-body p { color: var(--muted); font-size: 16px; line-height: 1.85; margin-top: 26px; }
.closing-actions { display: flex; gap: 35px; margin-top: 30px; align-items: center; }
.closing-signature { display: flex; align-items: center; flex-direction: column; gap: 36px; margin-right: 8%; color: var(--green); }
.closing-signature > svg { width: 165px; height: 165px; }
.closing-signature .meta { font-size: 9px; }
.site-footer { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding-block: 30px; border-top: 1px solid var(--line); }
.footer-brand { font-family: Arial,sans-serif; font-size: 17px; letter-spacing: .04em; }
.footer-brand span { font-family: var(--font-brand); font-size: 11px; margin-left: 10px; }
.site-footer p { font-size: 11px; color: var(--muted); }
.site-footer > .meta { font-size: 9px; color: var(--muted); }
.back-top { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--line); }
dialog { width: min(580px, calc(100% - 40px)); max-height: calc(100svh - 40px); padding: 52px 40px 35px; background: var(--paper); color: var(--ink); border: 1px solid var(--line); }
dialog::backdrop { background: rgb(24 38 29 / 45%); }
.dialog-close { position: absolute; right: 12px; top: 8px; width: 44px; height: 44px; font-size: 28px; background: none; }
dialog h2 { font-size: 30px; margin-block: 24px; }
dialog > p { font-size: 16px; line-height: 1.85; }
dialog .eyebrow { font-size: 11px; }
dialog .dialog-statement { color: var(--green); margin-top: 24px; }
dialog .dialog-foot { font-size: 13px; margin-top: 35px; color: var(--muted); border-top: 1px solid var(--line); padding-top: 20px; }
.noscript-note { padding: 20px; text-align: center; }
.error-page { min-height: 100svh; padding: 12vh 8vw; }
.error-page .signature { display: block; width: 230px; margin-top: 50px; color: var(--green); }
/* Optional real-image loading state uses the same quiet path language. */
.evidence.is-loading:after { content: ''; position: absolute; bottom: 0; left: 0; width: 35%; height: 2px; background: currentColor; animation: signal-loading 2s ease-in-out infinite alternate; }
@keyframes signal-loading { to { transform: translateX(185%); } }

@media (min-width:1800px) { .hero { min-height: calc(89svh - 94px); } }
@media (min-width:761px) and (max-height:800px) {
  .hero { padding-top: 36px; }
  .hero-director { height: 245px; }
  .hero-small { height: 114px; }
  .hero-small .asset-required { padding-block: 8px; }
  .hero-bottom { padding-top: 23px; }
  h1 { margin-block: 25px 20px; }
}
@media (max-width:1100px) {
  .site-header { gap: 20px; }
  .header-contact { display: none; }
  .hero { column-gap: 4%; }
  .hero-description { font-size: 14px; }
  .hero-actions { gap: 20px; }
  .hero-actions .button { gap: 20px; padding-inline: 18px; }
  .hero .eyebrow { font-size: 9px; }
  .hero-small .evidence-label { font-size: 7px; }
  .work-intro { gap: 25px; }
  .work-intro > p { font-size: 16px; }
  .work-footer { flex-direction: column; gap: 22px; }
  .project-meta { gap: 30px; }
  .music-window { height: 345px; }
  .game-window { height: 280px; }
  .note { grid-template-columns: 80px 1fr 190px; gap: 20px; }
  .closing-signature { margin-right: 2%; }
}
@media (max-width:760px) {
  :root { --gutter: 22px; }
  .section { padding-block: 42px 48px; }
  .section-rule { margin-bottom: 30px; padding-top: 17px; gap: 15px; }
  .section-rule > .meta { display: none; }
  .eyebrow { font-size: 11px; }
  .site-header { height: 78px; }
  .wordmark > span { font-size: 17px; }
  .wordmark small { font-size: 10px; margin-top: 3px; }
  .wordmark svg { width: 31px; height: 31px; }
  .site-header > nav { display: none; }
  .menu-toggle { display: flex; align-items: center; gap: 12px; background: none; padding: 12px 0 12px 12px; font-size: 14px; min-height: 44px; }
  .menu-toggle > span { font-size: 23px; }
  #mobile-nav:not([hidden]) { display: flex; position: absolute; top: 77px; left: calc(-1 * var(--gutter)); right: calc(-1 * var(--gutter)); padding: 18px var(--gutter) 25px; background: var(--paper); border-bottom: 1px solid var(--line); flex-direction: column; gap: 0; align-items: stretch; }
  #mobile-nav a,#mobile-nav button { font-size: 16px; min-height: 48px; display: flex; gap: 12px; align-items: center; }
  .hero { display: flex; flex-direction: column; min-height: auto; padding-top: 38px; }
  .hero-left { display: contents; }
  .hero-copy { order: 0; }
  .hero .eyebrow { font-size: 9px; letter-spacing: .03em; }
  h1 { font-size: clamp(44px,10.6vw,70px); margin-block: 25px 22px; letter-spacing: -.025em; line-height: 1.25; }
  .hero-description { font-size: 16px; line-height: 1.8; max-width: none; }
  .hero-description p:first-child { margin-bottom: 9px; }
  .hero-description p:first-child { font-size: 17px; }
  .living-evidence { order: 2; width: 100%; margin-top: 28px; align-self: auto; padding-top: 0; }
  .canvas-meta { margin-bottom: 10px; font-size: 9px; }
  .hero-director { width: 100%; height: clamp(225px,60vw,350px); min-height: 0; aspect-ratio: auto; }
  .evidence-label { margin: 15px 16px 0; font-size: 8px; gap: 8px; }
  .evidence-label .evidence-status { font-size: 7px; }
  .evidence figcaption { padding: 0 16px 16px; }
  .hero-secondary { display: grid; width: 100%; gap: 10px; margin-top: 10px; }
  .canvas-footer { display: none; }
  .hero-small .evidence-label { margin-inline: 10px; font-size: 6px; }
  .hero-small figcaption { padding-inline: 10px; font-size: 8px; line-height: 1.5; }
  .hero-actions { order: 1; margin-top: 22px; gap: 25px; }
  .hero-actions .button { padding-inline: 18px; gap: 23px; font-size: 14px; }
  .hero-actions .text-link { gap: 15px; font-size: 14px; }
  .hero-bottom { order: 3; padding-block: 30px 34px; align-self: auto; }
  .hero-bottom > span { display: none; }
  .hero-bottom > a { margin-left: auto; font-size: 9px; }
  .selected-work { padding-top: 10px; }
  .work-heading { flex-direction: column; align-items: stretch; gap: 20px; margin-bottom: 24px; }
  .work-number { gap: 10px; margin-bottom: 18px; font-size: 10px; }
  .work-number .status { font-size: 11px; }
  h2 { font-size: 33px; }
  .work-intro { justify-content: space-between; align-items: flex-end; gap: 10px; }
  .work-intro > p { font-size: 16px; }
  .work-intro .text-link { font-size: 13px; gap: 12px; }
  .featured-evidence { height: 330px; }
  .featured-evidence .evidence-label { margin: 18px 16px 0; font-size: 8px; }
  .featured-evidence .asset-required .meta { font-size: 14px; }
  .featured-evidence .asset-required strong { font-size: 14px; }
  .featured-evidence .asset-spec { font-size: 9px; }
  .featured-evidence figcaption { padding: 0 16px 18px; font-size: 11px; }
  .concepts { display: grid; gap: 11px; font-size: 10px; }
  .project-meta { gap: 23px; }
  .project-meta dd { font-size: 9px; }
  .work-pair { grid-template-columns: 1fr; gap: 38px; }
  .game-work { margin-top: 0; }
  .window-meta { font-size: 10px; }
  .window-meta .status { font-size: 11px; }
  .music-window { height: auto; aspect-ratio: 1.1; }
  .game-window { width: 100%; height: auto; aspect-ratio: 1.35; min-height: 0; }
  .window-title h3 { font-size: 26px; }
  .window-title p { font-size: 16px; }
  .field-lab { flex-wrap: wrap; gap: 17px; padding-block: 24px; margin-top: 35px; }
  .field-lab > p { flex-basis: 100%; font-size: 16px; }
  .lab-mark { display: none; }
  .explore-band .section { padding-block: 42px 44px; }
  .explore-intro { display: block; margin-bottom: 35px; }
  .explore-intro > p { margin-top: 22px; font-size: 16px; }
  .explore-intro > p br { display: none; }
  .explore-grid { grid-template-columns: 1fr; }
  .explore-grid article,.explore-grid article:first-child { padding: 25px 0; border-left: none; border-top: 1px solid var(--line); }
  .explore-grid article:last-child { padding-bottom: 0; }
  .explore-grid h3 { font-size: 29px; margin-top: 18px; min-height: 0; line-height: 1.25; }
  .desktop-break { display: none; }
  .field-en { font-size: 9px; margin-top: 10px; }
  .explore-grid p { font-size: 16px; margin-top: 14px; }
  .method { padding-block: 43px; }
  .method-heading { display: block; }
  .method-heading > p { font-size: 16px; margin-top: 22px; }
  .method-visual { margin-top: 30px; }
  .method-map { display: none; }
  .method-steps { display: flex; flex-direction: column; padding-left: 24px; border-left: 1px solid var(--line); margin-left: 6px; }
  .step-button { flex-direction: row; align-items: center; justify-content: space-between; gap: 10px; padding: 23px 0; }
  .step-button:before { top: calc(50% - 3px); left: -28px; width: 7px; height: 7px; border-radius: 50%; background: var(--paper); border: 1px solid var(--green); }
  .step-button[aria-pressed="true"]:before { width: 7px; background: var(--green); }
  .step-button strong { font-size: 22px; flex: 1; margin-left: 10px; }
  .step-button > span:last-child { font-size: 16px; }
  .method-caption { flex-direction: column; align-items: stretch; gap: 10px; }
  .method-caption > p { font-size: 16px; min-height: 58px; }
  .motion-toggle { display: none; }
  .research-band .section { padding-block: 42px 46px; }
  .research-heading { display: block; margin-bottom: 30px; }
  .research-heading > p { font-size: 16px; margin-top: 20px; }
  .draft-notice { font-size: 12px; }
  .note { grid-template-columns: 38px 1fr; gap: 12px; padding-block: 23px; align-items: start; }
  .note-code { padding-top: 1px; }
  .note-code > .meta { font-size: 10px; }
  .note-glyph { display: none; }
  .note-main h3 { font-size: 19px; }
  .note-meta { grid-column: 2; gap: 6px; }
  .note-meta .meta { font-size: 9px; }
  .note-meta time { display: none; }
  .closing { padding-block: 43px 49px; }
  .closing-body { display: block; }
  .closing h2 { font-size: 47px; }
  .closing-body p { font-size: 16px; }
  .closing-signature { display: none; }
  .closing-actions { gap: 27px; }
  .closing-actions .button { gap: 24px; }
  .site-footer { flex-wrap: wrap; justify-content: flex-start; gap: 18px; padding-block: 24px; position: relative; padding-right: 55px; }
  .site-footer p,.site-footer > .meta { flex-basis: 100%; }
  .site-footer > .meta { font-size: 8px; }
  .back-top { position: absolute; top: 24px; right: 0; }
  dialog { padding: 48px 23px 28px; }
  dialog h2 { font-size: 26px; }
}
@media (max-width:360px) {
  :root { --gutter: 18px; }
  .hero .eyebrow { font-size: 8px; }
  .hero-actions { gap: 18px; }
  .hero-actions .button { gap: 15px; padding-inline: 14px; }
  .hero-actions .text-link { gap: 10px; font-size: 13px; }
  .evidence-label { font-size: 7px; }
  .evidence-label .evidence-status { font-size: 6px; }
  .work-intro { align-items: flex-start; flex-direction: column; }
  .work-number { gap: 8px; font-size: 9px; }
  .work-number .status { font-size: 11px; flex-basis: 100%; }
  .window-title h3 { font-size: 24px; }
  .closing h2 { font-size: 42px; }
  .closing-actions { gap: 24px; }
  .closing-actions .button { padding-inline: 17px; gap: 17px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *,*::before,*::after { animation: none !important; transition: none !important; }
  .motion-toggle { display: none; }
}
/* V0.2 page foundation: the accepted home scale and colors remain the owner. */
main:focus {outline:none}
.site-header a[aria-current="page"] {color:var(--green);box-shadow:0 1px 0 var(--green)}
.breadcrumb {display:flex;flex-wrap:wrap;gap:12px;padding-top:28px;color:var(--muted);font-size:12px;line-height:1.7}
.breadcrumb a {text-decoration:underline;text-underline-offset:4px}
.page-lead {padding-block:60px 72px}
.page-lead h1 {font-size:clamp(38px,4.4vw,66px);max-width:1080px;margin-block:30px}
.page-intro {max-width:760px;font-size:clamp(17px,1.6vw,21px);line-height:1.85;color:var(--muted)}
.editorial-section {display:grid;grid-template-columns:1fr 1fr;gap:8%;padding-block:72px}
.editorial-section>.section-rule {display:block;margin-bottom:0}
.editorial-section h2 {font-size:clamp(28px,3vw,43px);margin-top:35px}
.editorial-body {padding-top:22px;font-size:17px;line-height:1.95}
.editorial-body p+p {margin-top:24px}
.editorial-body .large-copy {font-size:clamp(22px,2.3vw,32px);line-height:1.65;color:var(--ink)}
.editorial-body .text-link {margin-top:24px}
.tinted {background:var(--paper-deep)}
.method-principles {padding-block:64px 80px}
.method-principles .section-rule h2 {font-size:24px}
.method-principles ol {display:grid;grid-template-columns:repeat(5,1fr);gap:30px}
.method-principles h3 {font-size:21px;font-weight:500;margin:20px 0 15px}
.method-principles p {font-size:14px;line-height:1.8;color:var(--muted)}
.page-next {border-top:1px solid var(--line);padding-block:60px 72px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.page-next h2 {font-size:clamp(26px,3vw,40px)}
.work-definitions {display:grid;grid-template-columns:repeat(3,1fr);gap:40px;padding:30px 0 60px;border-top:1px solid var(--line)}
.work-definitions h2 {font-size:26px;margin:12px 0}
.work-definitions p:last-child {color:var(--muted);font-size:15px;line-height:1.8;max-width:320px}
.work-entry {border-top:1px solid var(--line);padding-block:36px 74px}
.work-entry-heading {display:flex;justify-content:space-between;gap:25px;align-items:baseline;margin-bottom:30px}
.work-entry-heading h2 {font-size:clamp(29px,3.4vw,48px);margin:20px 0 12px;overflow-wrap:anywhere}
.work-entry-heading .status {margin-left:20px}
.work-summary {font-size:18px;line-height:1.8}
.collection-evidence {max-width:100%;width:100%;height:auto!important}
.collection-evidence picture {display:block}
.collection-evidence img {width:100%;height:auto;max-height:660px;object-fit:contain;display:block}
.work-entry-bottom {display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:12%;padding-top:24px}
.work-entry-bottom>p {font-size:16px;line-height:1.95;max-width:760px}
.work-entry-bottom .meta {color:var(--muted);line-height:1.9}
.work-entry-bottom .text-link {margin-top:12px}
.field-visual {height:180px;display:flex;align-items:center;justify-content:space-between;gap:30px;background:var(--paper-deep);padding:40px;color:var(--green)}
.field-visual .signature {width:55%;max-width:550px}
.product-evidence {padding-bottom:35px}
.image-note {font-size:13px;line-height:1.85;color:var(--muted);margin-top:18px;max-width:840px}
.questions-grid {display:grid;grid-template-columns:1fr 1fr;gap:45px 10%}
.questions-grid h3 {font-size:25px;font-weight:500;margin:16px 0}
.questions-grid p {font-size:16px;color:var(--muted);line-height:1.9;max-width:540px}
.editorial-index {min-height:320px;padding-block:10px 80px}
.editorial-index h2 {font-size:28px}
.editorial-types {color:var(--muted);margin-top:-15px;line-height:2}
.editorial-empty {border-top:1px solid var(--line);padding-block:34px 12px;margin-top:34px;display:flex;justify-content:space-between;gap:30px;align-items:center}
.editorial-empty p {max-width:610px;font-size:16px;line-height:1.9;color:var(--muted)}
.research-band .editorial-empty {border-color:#718274}
.research-band .editorial-empty p {color:inherit}
.contact-layout {display:grid;grid-template-columns:1.1fr .9fr;gap:10%;padding-bottom:95px}
.contact-options article {border-top:1px solid var(--line);padding-block:28px;display:grid;grid-template-columns:45px 1fr;gap:12px}
.contact-options h2 {font-size:25px;margin-bottom:12px}
.contact-options p {font-size:15px;line-height:1.8;color:var(--muted)}
.contact-channel {background:var(--paper-deep);padding:36px;align-self:start}
.contact-channel h2 {font-size:29px;margin:30px 0 24px}
.contact-channel p {line-height:1.9}
.contact-channel .company-note {font-size:13px;margin-top:42px;color:var(--muted)}
.contact-channel .signature {width:100%;max-width:270px;margin-top:40px;color:var(--green)}
.reading {max-width:840px;padding-block:62px 85px}
.reading h1 {font-size:clamp(31px,3.7vw,50px);line-height:1.5;margin-block:26px}
.reading>h2 {font-size:27px;margin-block:45px 16px}
.reading p {line-height:1.9}
.article-deck {font-size:19px;color:var(--muted);margin-bottom:22px}
.article-body {margin-top:55px;font-size:17px;line-height:2}
.article-body section {margin-block:42px}
.article-body h2,.article-related h2 {font-size:26px;margin-bottom:19px}
.article-related {border-top:1px solid var(--line);padding-block:28px;margin-top:48px;display:flex;flex-wrap:wrap;gap:15px 30px;align-items:center}
.article-related h2 {width:100%;margin:0}
.draft-banner {border-left:3px solid var(--green);padding:14px 20px;background:var(--paper-deep);font-size:14px;margin-bottom:42px;line-height:1.8}
.candidate-list {display:grid;grid-template-columns:1fr 1fr;gap:25px}
.candidate-list img {width:100%;height:auto}
.site-footer {display:flex;align-items:center;flex-wrap:wrap;gap:35px;justify-content:space-between;padding-block:36px}
.site-footer .footer-brand {font-size:20px;display:inline-block;margin-bottom:13px}
.site-footer .footer-brand span {font-size:11px;margin-left:12px}
.site-footer p {font-size:12px;line-height:1.9;color:var(--muted)}
.site-footer nav {display:flex;flex-wrap:wrap;gap:18px 30px}
.site-footer nav a {min-height:44px;display:flex;align-items:center;font-size:13px}
.error-page p {line-height:1.8;margin-bottom:24px}
@media(max-width:1024px){.method-principles ol{grid-template-columns:repeat(3,1fr)}.work-entry-heading{display:block}.work-entry-heading>.meta{display:block;margin-top:15px}.contact-layout{gap:6%}}
@media(max-width:760px){
 .page-lead{padding-block:42px 46px}.page-lead h1{font-size:clamp(31px,7.8vw,45px);line-height:1.4;letter-spacing:-.035em}.page-intro{font-size:17px}.page-intro br{display:none}
 .breadcrumb{font-size:11px;padding-top:24px;gap:8px}
 .editorial-section{grid-template-columns:1fr;gap:24px;padding-block:44px}.editorial-section h2{margin-top:23px;font-size:29px}.editorial-body{padding-top:0;font-size:16px}
 .method-principles{padding-block:40px 48px}.method-principles ol{grid-template-columns:1fr;gap:0}.method-principles li{border-top:1px solid var(--line);padding:25px 0}.method-principles h3{margin:13px 0}.method-principles .section-rule{display:block}.method-principles .section-rule h2{margin-top:20px}
 .page-next{display:block;padding-block:40px 48px}.page-next h2{font-size:28px;margin-bottom:25px}
 .work-definitions{grid-template-columns:1fr;gap:24px;padding-block:28px 40px}.work-definitions article{display:grid;grid-template-columns:1fr 1fr;column-gap:12px}.work-definitions h2{margin:0;font-size:23px}.work-definitions p:last-child{grid-column:1/-1;margin-top:12px;max-width:none}
 .work-entry{padding-block:28px 48px}.work-entry-heading h2{font-size:30px}.work-entry-heading .status{margin-left:10px;font-size:10px}.work-summary{font-size:16px}.work-entry-bottom{grid-template-columns:1fr;gap:23px}.work-entry-bottom>p{font-size:15px}
 .field-visual{height:150px;padding:20px;display:block}.field-visual .signature{width:100%;height:70px}.field-visual p{margin-top:15px}
 .questions-grid{grid-template-columns:1fr;gap:35px}.questions-grid h3{font-size:23px}.tinted .section-rule{display:block}.tinted .section-rule h2{font-size:28px;margin-top:22px}
 .editorial-index{padding-bottom:50px;min-height:300px}.editorial-empty{display:block;padding-top:25px}.editorial-empty .text-link{margin-top:20px}.editorial-types{font-size:10px}
 .contact-layout{grid-template-columns:1fr;gap:25px;padding-bottom:48px}.contact-channel{padding:26px}.contact-channel h2{font-size:26px}.contact-channel .company-note{margin-top:28px}
 .reading{padding-block:40px 55px}.reading h1{font-size:31px}.article-deck{font-size:17px}.article-body{font-size:16px}.article-body h2{font-size:24px}.candidate-list{grid-template-columns:1fr}
 .site-footer{gap:20px;align-items:flex-start}.site-footer nav{gap:0 22px;width:100%}.site-footer .back-top{margin-left:auto}.site-footer p{font-size:11px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
.error-links {display:flex;flex-wrap:wrap;gap:24px;justify-content:center} .error-page h1 {font-size:clamp(29px,4.4vw,62px)}

/* Project journal. Existing brand colors, artwork and base remain intact. */
:root { --max-width:1280px; }
.kicker { font-size:12px; line-height:1.65; letter-spacing:.06em; font-weight:500; }
.site-header { height:100px; }
.site-header nav a { font-size:14px; }
.site-header nav a span { font-size:10px; }
.studio-intro { display:grid; grid-template-columns:1.05fr 1fr; gap:6%; padding-block:76px 65px; align-items:center; }
.studio-intro h1 { font-size:clamp(35px,3.85vw,56px); line-height:1.42; font-weight:500; letter-spacing:-.055em; margin:22px 0 26px; }
.studio-intro h1 em { font-style:normal; color:var(--green); }
.intro-deck { color:var(--muted); font-size:16px; line-height:1.95; margin-bottom:30px; }
.studio-intro-art { padding-top:18px; }
.intro-art.evidence { display:block; aspect-ratio:auto; background:none; }
.intro-art .evidence-label,.intro-art figcaption { display:none; }
.intro-art.evidence picture { display:block; }
.intro-art.evidence img { display:block; position:static; width:100%; height:auto; aspect-ratio:1672/941; object-fit:contain; opacity:1; }
.art-note { display:grid; grid-template-columns:1fr 1.25fr; gap:20px; padding-top:22px; border-top:1px solid var(--line); margin-top:16px; }
.art-note .kicker { color:var(--green); font-size:11px; }
.art-note p { font-size:13px; color:var(--muted); line-height:1.8; }
.project-directory { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding-block:24px; }
.project-directory a { display:flex; align-items:center; gap:20px; padding:3px 28px; border-left:1px solid var(--line); min-width:0; }
.project-directory a:first-child { border-left:0; padding-left:0; }
.project-directory a:last-child { padding-right:0; }
.directory-number { color:var(--muted); font:11px var(--font-meta); }
.project-directory small { display:block; font-size:11px; color:var(--muted); margin-bottom:9px; }
.project-directory strong { display:block; font-size:15px; font-weight:500; line-height:1.6; }
.project-directory a>span:last-child { margin-left:auto; color:var(--green); }
.studio-section { padding-block:84px 86px; }
.journal-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:30px; margin-bottom:42px; }
.journal-heading h2,.notes-intro h2,.studio-about h2 { font-size:clamp(28px,2.65vw,38px); line-height:1.5; letter-spacing:-.03em; margin-top:17px; }
.journal-heading>.text-link { flex-shrink:0; }
.journal-heading>p { font-size:14px; color:var(--muted); line-height:1.8; }
.director-feature { display:grid; grid-template-columns:1.4fr 1fr; background:#eceee5; align-items:center; }
.director-feature .project-image { padding:38px 0 38px 36px; }
.director-feature-copy { padding:40px 36px; }
.project-stage { display:flex; align-items:center; gap:8px; font-size:12px; color:var(--green); line-height:1.7; }
.project-stage>span { width:5px; height:5px; background:currentColor; border-radius:100%; }
.director-feature-copy h3 { margin:14px 0 20px; font-size:28px; font-weight:500; letter-spacing:-.035em; }
.feature-deck { font-size:22px; line-height:1.65; margin-bottom:16px; }
.director-feature-copy>p:not(.feature-deck,.project-stage) { font-size:14px; line-height:1.95; color:var(--muted); }
.project-facts { display:grid; gap:9px; margin-top:24px; font-size:13px; line-height:1.8; }
.project-facts li { padding-left:13px; border-left:2px solid #a9b9a2; }
.director-feature-copy .text-link { margin-top:20px; }
.editorial-image.evidence { display:block; height:auto; aspect-ratio:auto; min-height:0; background:none; color:inherit; }
.editorial-image .evidence-label { display:none; }
.editorial-image.evidence picture { display:block; height:auto; margin:0; }
.editorial-image.evidence img { display:block; position:static; width:100%; height:auto; object-fit:contain; opacity:1; }
.editorial-image figcaption { display:none; }
.project-image { display:block; min-width:0; }
.project-image img { transition:filter .2s; }
.project-image:hover img { filter:brightness(1.04); }
.project-stories { display:grid; grid-template-columns:1fr 1fr; gap:42px; margin-top:52px; }
.story-meta { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-block:23px 13px; font-size:11px; color:var(--muted); }
.story-meta .kicker { color:var(--green); }
.project-story h3,.portfolio-project h2 { font-size:27px; font-weight:500; line-height:1.5; letter-spacing:-.025em; }
.project-story h3 a,.portfolio-project h2 a { display:flex; align-items:baseline; justify-content:space-between; gap:15px; }
.project-story h3 span,.portfolio-project h2 span { font-size:19px; color:var(--green); }
.project-story>p,.portfolio-project>p { font-size:15px; color:var(--muted); line-height:1.95; margin-top:15px; }
.project-story .text-link { margin-top:17px; }
.studio-notes { background:var(--paper-deep); padding-block:72px; }
.notes-layout { display:grid; grid-template-columns:1fr 1.2fr; gap:10%; }
.notes-intro>p:not(.kicker) { font-size:14px; line-height:1.9; margin-top:22px; color:var(--muted); }
.notes-intro .text-link { margin-top:25px; }
.home-notes article { border-top:1px solid #c2c8bb; padding-block:23px 26px; }
.home-notes article:last-child { padding-bottom:0; }
.note-dateline { display:flex; gap:20px; justify-content:space-between; font-size:11px; color:var(--muted); line-height:1.8; }
.home-notes h3 { font-size:22px; font-weight:500; line-height:1.65; margin-top:16px; }
.home-notes h3 a { display:flex; gap:20px; justify-content:space-between; }
.home-notes h3 span { flex-shrink:0; color:var(--green); }
.home-notes article>p { margin-top:12px; color:var(--muted); font-size:14px; line-height:1.85; }
.studio-about { display:grid; grid-template-columns:1fr 2fr; gap:8%; padding-block:76px; }
.studio-about>.kicker { padding-top:10px; }
.studio-about h2 { margin-top:0; }
.studio-about div>p { font-size:16px; color:var(--muted); line-height:2; max-width:690px; margin:23px 0; }
.studio-contact { background:var(--green-dark); color:var(--inverse); padding-block:56px; }
.studio-contact>.wrap { display:flex; justify-content:space-between; align-items:center; gap:50px; }
.studio-contact h2 { font-size:34px; line-height:1.55; margin:16px 0; }
.studio-contact p:not(.kicker) { font-size:13px; line-height:1.8; color:#cbd6c9; }
.direct-contact { display:flex; flex-direction:column; align-items:flex-start; gap:17px; }
.direct-contact>a:first-child { font-size:clamp(20px,2.3vw,30px); letter-spacing:-.02em; border-bottom:1px solid #728772; padding-block:10px; }
.direct-contact .contact-phone { font-size:20px; letter-spacing:.04em; }
.direct-contact .text-link { border:0; color:#cbd6c9; }
.studio-contact a:focus-visible { outline-color:var(--inverse); }
.page-lead { padding-block:46px 56px; }
.page-lead h1 { font-size:clamp(34px,4vw,56px); line-height:1.4; margin-block:20px; }
.page-intro { font-size:18px; line-height:1.9; }
.about-opening { display:grid; grid-template-columns:1fr 1.3fr; gap:10%; border-top:1px solid var(--line); padding-block:50px 68px; }
.about-opening h2 { font-size:34px; margin-top:22px; line-height:1.5; }
.about-opening div>p:not(.kicker) { font-size:16px; line-height:2; margin-bottom:20px; color:var(--muted); }
.about-fields,.project-capabilities { display:grid; grid-template-columns:repeat(3,1fr); gap:48px; padding-block:58px; }
.about-fields h2,.project-capabilities h2 { font-size:27px; margin-block:20px 16px; }
.about-fields article>p:not(.kicker),.project-capabilities article>p:not(.kicker) { font-size:15px; color:var(--muted); line-height:1.95; }
.about-fields .text-link { margin-top:20px; }
.compact-method { padding-block:64px; }
.compact-method .method-visual { margin-top:26px; }
.compact-method .step-button strong { font-size:21px; }
.compact-method .step-button>span:last-child { font-size:11px; }
.compact-method .method-caption { margin-top:25px; }
.compact-method .method-caption>p { font-size:15px; }
.portfolio-grid { display:grid; grid-template-columns:1fr 1fr; gap:60px 42px; padding-bottom:65px; }
.portfolio-project .text-link { margin-top:17px; }
.workspace-project { padding:40px; background:var(--paper-deep); display:flex; flex-direction:column; align-items:flex-start; justify-content:center; }
.workspace-project h2 { margin-top:20px; font-size:32px; }
.workspace-project .workspace-line { color:var(--green); border-block:1px solid var(--line); padding-block:20px; margin:23px 0 8px; font-size:16px; line-height:2.2; text-wrap:balance; }
.applied-note { border-top:1px solid var(--line); padding-block:40px 60px; }
.applied-note h2 { font-size:30px; margin-block:18px; }
.applied-note>p:not(.kicker) { max-width:760px; font-size:16px; color:var(--muted); line-height:1.9; }
.applied-note .text-link { margin-top:20px; }
.product-evidence { padding-bottom:30px; }
.product-evidence>.editorial-image { max-width:1050px; margin-inline:auto; }
.product-evidence>.image-note { max-width:1050px; margin-inline:auto; }
.editorial-section { padding-block:56px; }
.editorial-section h2 { font-size:34px; margin-top:23px; }
.editorial-body { font-size:16px; }
.project-milestones { display:grid; grid-template-columns:1fr 1.3fr; gap:10%; padding-block:62px; }
.project-milestones h2 { font-size:29px; margin-top:20px; }
.project-milestones li { display:grid; grid-template-columns:90px 1fr; gap:24px; padding:22px 0; border-top:1px solid var(--line); }
.project-milestones time { font-size:12px; line-height:1.9; color:var(--muted); }
.project-milestones h3 { font-size:19px; font-weight:500; line-height:1.5; }
.project-milestones li p { font-size:14px; line-height:1.9; color:var(--muted); margin-top:10px; }
.project-status { border-top:1px solid var(--line); padding-block:35px 40px; display:grid; grid-template-columns:1fr 1.3fr; gap:10%; }
.project-status h2 { font-size:25px; }
.project-status p { color:var(--muted); font-size:15px; line-height:1.95; }
.project-reading { display:flex; flex-direction:column; align-items:flex-start; padding-block:32px 48px; gap:16px; }
.project-reading a { text-decoration:underline; text-underline-offset:5px; line-height:1.8; font-size:15px; }
.project-reading .kicker { color:var(--muted); }
.music-workspace>.wrap { display:grid; grid-template-columns:1fr 1.3fr; gap:10%; padding-block:60px; }
.music-workspace h2 { font-size:35px; margin:23px 0; }
.music-workspace .wrap>div>p:not(.feature-deck,.kicker,.image-note) { line-height:1.95; font-size:16px; }
.workspace-steps { margin-top:25px; }
.workspace-steps li { display:grid; grid-template-columns:130px 1fr; gap:20px; border-top:1px solid var(--line); padding-block:20px; font-size:14px; line-height:1.8; }
.workspace-steps strong { font-weight:500; }
.workspace-steps span { color:var(--muted); }
.game-directions { padding-block:55px 62px; }
.game-direction-grid { display:grid; grid-template-columns:1fr 1fr; gap:60px; }
.game-direction-grid h3 { font-size:30px; font-weight:500; margin:18px 0; }
.game-direction-grid article>p:last-child { font-size:16px; color:var(--muted); line-height:1.95; }
.journal-index { padding-bottom:65px; }
.journal-index-meta { display:flex; justify-content:space-between; gap:22px; font-size:12px; color:var(--muted); border-bottom:1px solid var(--line); padding-block:18px; line-height:1.8; }
.journal-list-item { display:grid; grid-template-columns:190px 1fr; gap:40px; padding-block:38px; border-bottom:1px solid var(--line); }
.journal-list-item time { display:block; font-size:12px; margin-top:12px; color:var(--muted); }
.journal-list-item h2 { font-size:27px; line-height:1.6; }
.journal-list-item div>p:not(.kicker) { font-size:15px; color:var(--muted); margin-top:14px; line-height:1.9; }
.journal-list-item .text-link { margin-top:13px; }
.reading { max-width:820px; padding-top:42px; }
.reading h1 { font-size:clamp(29px,3.3vw,45px); line-height:1.55; }
.article-byline { display:flex; gap:20px; flex-wrap:wrap; font-size:13px; color:var(--muted); padding-block:16px 25px; border-bottom:1px solid var(--line); }
.article-byline a { color:var(--green); text-decoration:underline; text-underline-offset:4px; }
.article-toc { padding:24px 28px; margin-top:28px; background:var(--paper-deep); }
.article-toc>p { font-size:13px; font-weight:600; margin-bottom:12px; }
.article-toc ol { display:grid; gap:8px; }
.article-toc a { font-size:14px; line-height:1.8; display:inline-block; padding-block:3px; color:var(--muted); }
.article-toc a:hover { color:var(--green); text-decoration:underline; text-underline-offset:4px; }
.article-body section { scroll-margin-top:30px; margin-block:42px; }
.article-body p+p { margin-top:20px; }
.article-body h2 { line-height:1.6; }
.article-sources { border-top:1px solid var(--line); padding-top:28px; }
.article-sources h2 { font-size:23px; margin-bottom:20px; }
.article-sources li { font-size:15px; line-height:1.85; margin-top:12px; }
.article-sources a { text-decoration:underline; text-underline-offset:4px; }
.progress-list { max-width:1050px; padding-bottom:65px; }
.progress-list article { display:grid; grid-template-columns:150px 1fr; gap:35px; padding-block:32px; border-top:1px solid var(--line); }
.progress-list time { color:var(--muted); font-size:13px; }
.progress-list h2 { font-size:26px; margin:12px 0; }
.progress-list div>p:not(.kicker) { font-size:15px; line-height:1.9; color:var(--muted); }
.progress-list .text-link { margin-top:15px; }
.contact-details div { margin-top:25px; }
.contact-details dt { font-size:12px; color:var(--muted); margin-bottom:9px; }
.contact-details a { display:inline-block; font-size:clamp(18px,2vw,27px); line-height:1.5; padding-block:6px; border-bottom:1px solid var(--line); overflow-wrap:anywhere; }
.contact-hint { color:var(--muted); font-size:13px; line-height:1.9; margin-top:18px; }
.contact-channel h2 { font-size:27px; line-height:1.5; }
.page-next h2 { font-size:30px; line-height:1.5; text-wrap:balance; }
.site-footer { border-top:0; padding-block:38px; }
@media(max-width:1050px) {
 .studio-intro { gap:4%; padding-block:55px; }
 .studio-intro h1 { font-size:38px; }
 .art-note { display:block; }
 .art-note p { margin-top:12px; }
 .director-feature { grid-template-columns:1.1fr 1fr; }
 .director-feature .project-image { padding:25px 0 25px 25px; }
 .director-feature-copy { padding:28px; }
 .project-directory a { padding-inline:18px; gap:14px; }
 .project-directory strong { font-size:13px; }
 .project-stories { gap:30px; }
 .portfolio-grid { gap:40px 30px; }
 .workspace-project { padding:30px; }
 .about-fields,.project-capabilities { gap:30px; }
 .journal-list-item { grid-template-columns:140px 1fr; }
}
@media(max-width:760px) {
 .site-header { height:80px; }
 .studio-intro { grid-template-columns:1fr; padding-block:38px 30px; gap:32px; }
 .studio-intro h1 { font-size:clamp(31px,8.5vw,49px); line-height:1.43; margin:18px 0 22px; letter-spacing:-.055em; }
 .intro-deck { font-size:15px; line-height:1.9; margin-bottom:24px; }
 .intro-deck br { display:none; }
 .studio-intro-art { padding-top:0; }
 .art-note { display:flex; justify-content:space-between; gap:16px; padding-top:15px; margin-top:12px; }
 .art-note .kicker { flex:1; font-size:10px; }
 .art-note p { flex:1.4; margin-top:0; font-size:11px; }
 .project-directory { grid-template-columns:1fr; padding-block:0; }
 .project-directory a,.project-directory a:first-child,.project-directory a:last-child { padding:18px 0; border:0; border-bottom:1px solid var(--line); gap:20px; }
 .project-directory a:last-child { border-bottom:0; }
 .project-directory a>span:nth-child(2) { display:flex; align-items:baseline; gap:18px; flex:1; }
 .project-directory small { margin:0; font-size:10px; flex-shrink:0; width:56px; }
 .project-directory strong { font-size:13px; }
 .directory-number { font-size:10px; }
 .studio-section { padding-block:48px; }
 .journal-heading { display:block; margin-bottom:28px; }
 .journal-heading h2,.notes-intro h2,.studio-about h2 { font-size:28px; line-height:1.5; margin-top:14px; }
 .journal-heading>.text-link { margin-top:17px; }
 .director-feature { grid-template-columns:1fr; }
 .director-feature .project-image { padding:22px 22px 0; }
 .director-feature-copy { padding:26px 24px; }
 .director-feature-copy h3 { font-size:26px; margin-block:12px 18px; }
 .feature-deck { font-size:21px; }
 .director-feature-copy>p:not(.feature-deck,.project-stage) { font-size:14px; }
 .project-facts { margin-top:20px; }
 .project-stories { grid-template-columns:1fr; gap:38px; margin-top:38px; }
 .story-meta { margin-top:19px; }
 .project-story h3,.portfolio-project h2 { font-size:24px; }
 .project-story>p,.portfolio-project>p { font-size:15px; }
 .studio-notes { padding-block:45px; }
 .notes-layout { grid-template-columns:1fr; gap:30px; }
 .notes-intro>p:not(.kicker) { margin-top:17px; }
 .notes-intro .text-link { margin-top:14px; }
 .home-notes h3 { font-size:21px; }
 .studio-about { grid-template-columns:1fr; padding-block:43px; gap:16px; }
 .studio-about>.kicker { padding:0; }
 .studio-about h2 { margin-top:0; }
 .studio-about div>p { font-size:15px; margin-block:20px; }
 .studio-contact { padding-block:38px; }
 .studio-contact>.wrap { display:block; }
 .studio-contact h2 { font-size:28px; }
 .direct-contact { margin-top:24px; gap:14px; }
 .direct-contact>a:first-child { font-size:24px; }
 .direct-contact .contact-phone { font-size:20px; }
 .page-lead { padding-block:33px 38px; }
 .page-lead h1 { font-size:clamp(30px,8.2vw,44px); margin-block:17px; }
 .page-intro { font-size:16px; }
 .about-opening { grid-template-columns:1fr; gap:26px; padding-block:34px 38px; }
 .about-opening h2 { font-size:28px; margin-top:17px; }
 .about-opening div>p:not(.kicker) { font-size:15px; }
 .about-fields,.project-capabilities { grid-template-columns:1fr; gap:30px; padding-block:38px; }
 .about-fields h2,.project-capabilities h2 { font-size:25px; margin-block:12px; }
 .compact-method { padding-block:40px; }
 .compact-method .journal-heading>p { margin-top:15px; }
 .compact-method .step-button strong { font-size:21px; }
 .compact-method .step-button>span:last-child { font-size:10px; }
 .portfolio-grid { grid-template-columns:1fr; gap:38px; padding-bottom:40px; }
 .workspace-project { padding:28px; }
 .workspace-project h2 { margin-top:18px; }
 .applied-note { padding-block:30px 40px; }
 .applied-note h2 { font-size:25px; }
 .applied-note>p:not(.kicker) { font-size:15px; }
 .editorial-section { padding-block:38px; }
 .editorial-section h2 { font-size:28px; }
 .editorial-body { font-size:15px; }
 .project-milestones { grid-template-columns:1fr; gap:26px; padding-block:38px; }
 .project-milestones h2 { margin-top:14px; font-size:27px; }
 .project-milestones li { grid-template-columns:75px 1fr; gap:17px; }
 .project-milestones time { font-size:11px; }
 .project-milestones h3 { font-size:18px; }
 .project-status { grid-template-columns:1fr; gap:18px; padding-block:30px; }
 .project-status h2 { font-size:25px; }
 .project-reading { padding-block:26px 34px; }
 .project-reading a { font-size:14px; }
 .music-workspace>.wrap { grid-template-columns:1fr; gap:20px; padding-block:38px; }
 .music-workspace h2 { font-size:29px; margin:17px 0; }
 .music-workspace .wrap>div>p:not(.feature-deck,.kicker,.image-note) { font-size:15px; }
 .workspace-steps li { grid-template-columns:100px 1fr; gap:16px; font-size:13px; }
 .game-directions { padding-block:38px; }
 .game-direction-grid { grid-template-columns:1fr; gap:32px; }
 .game-direction-grid h3 { font-size:27px; }
 .game-direction-grid article>p:last-child { font-size:15px; }
 .journal-index { padding-bottom:40px; }
 .journal-index-meta { flex-wrap:wrap; gap:12px 20px; font-size:11px; }
 .journal-list-item { grid-template-columns:1fr; gap:17px; padding-block:26px; }
 .journal-list-item>div:first-child { display:flex; justify-content:space-between; gap:20px; align-items:baseline; }
 .journal-list-item time { margin:0; font-size:11px; }
 .journal-list-item h2 { font-size:23px; }
 .journal-list-item div>p:not(.kicker) { font-size:14px; }
 .reading h1 { font-size:28px; }
 .article-byline { font-size:12px; gap:15px; }
 .article-toc { padding:20px; }
 .article-toc a { font-size:13px; }
 .article-body { margin-top:30px; }
 .article-body h2 { font-size:23px; }
 .article-sources h2 { font-size:22px; }
 .progress-list { padding-bottom:40px; }
 .progress-list article { grid-template-columns:1fr; gap:14px; padding-block:27px; }
 .progress-list h2 { font-size:24px; }
 .contact-channel { padding:26px; }
 .contact-channel h2 { font-size:25px; margin-block:22px; }
 .contact-details a { font-size:23px; }
 .page-next h2 { font-size:26px; }
 .site-footer { padding-block:30px; }
}
@media(max-width:360px) {
 .studio-intro h1 { font-size:29px; }
 .project-directory a { gap:14px; }
 .project-directory a>span:nth-child(2) { gap:10px; }
 .project-directory strong { font-size:12px; }
 .director-feature-copy { padding:22px; }
 .direct-contact>a:first-child { font-size:22px; }
 .contact-details a { font-size:20px; }
}
/* V0.3.3: concrete project selection and current game case studies. */
.portfolio-nav { display:flex; flex-wrap:wrap; gap:12px 28px; margin-bottom:32px; padding-bottom:18px; border-bottom:1px solid var(--line); }
.portfolio-nav a { font-size:13px; padding-block:8px; color:var(--green); }
.portfolio-nav a:hover { text-decoration:underline; text-underline-offset:6px; }
.portfolio-selected { gap:40px 32px; }
.portfolio-selected .portfolio-project { scroll-margin-top:24px; }
.portfolio-selected .portfolio-project h2 { margin-top:9px; }
.portfolio-selected .portfolio-project>p { margin-top:11px; font-size:14px; }
.portfolio-selected .project-image { display:block; background:#122126; }
.portfolio-selected .project-image img { aspect-ratio:8/5; object-fit:contain; }
.portfolio-archive { padding:30px; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; background:#e9ede4; border-top:2px solid #7f9a87; }
.portfolio-archive h2 { margin-top:20px; }
.game-case { display:grid; grid-template-columns:1.28fr 1fr; gap:5%; align-items:center; padding-block:10px 45px; scroll-margin-top:24px; }
.game-case-media,.game-case-copy { min-width:0; }
.game-case-media .editorial-image { border:1px solid var(--line); }
.game-case-copy h2 { font-size:39px; font-weight:500; margin:14px 0; letter-spacing:.04em; line-height:1.4; }
.game-case-copy h2 span { font:20px var(--font-meta); }
.game-case-deck { font-size:25px; line-height:1.6; margin-bottom:17px; }
.game-case-copy>p:not(.kicker,.game-case-deck,.image-note) { font-size:14px; line-height:1.95; color:var(--muted); }
.game-case-copy dl { margin-top:20px; font-size:12px; line-height:1.8; }
.game-case-copy dl>div { display:grid; grid-template-columns:70px 1fr; gap:15px; border-top:1px solid var(--line); padding-block:9px; }
.game-case-copy dt { color:var(--muted); }
.game-case-copy dd { margin:0; }
.starwake-case { background:#102126; color:#e4eee8; --line:#385356; --muted:#adc3c2; --green:#92dfcd; padding-block:38px 0; }
.starwake-case .game-case { grid-template-columns:1fr 1.28fr; }
.starwake-case .game-case-media { grid-column:2; grid-row:1; }
.starwake-case .game-case-copy { grid-column:1; grid-row:1; }
.starwake-case .image-note { color:#a2bdb9; }
.game-loop { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; list-style:none; margin:22px 0; padding:0; }
.game-loop li { padding-top:11px; border-top:1px solid #496462; }
.game-loop strong { display:block; color:#b2ead9; font-size:13px; font-weight:500; }
.game-loop span { display:block; font-size:11px; line-height:1.8; color:#a9c4c0; margin-top:7px; }
.early-experiment { display:grid; grid-template-columns:.8fr 1.3fr; gap:6%; padding-block:44px; align-items:center; scroll-margin-top:24px; border-bottom:1px solid var(--line); }
.early-experiment h2 { font-size:28px; font-weight:500; line-height:1.5; margin:13px 0; }
.early-experiment p:not(.kicker,.image-note) { font-size:14px; color:var(--muted); line-height:1.95; }
.early-experiment .text-link { font-size:13px; margin-top:16px; }
.workspace-detail-image { margin-top:20px; border:1px solid var(--line); }
@media(max-width:900px) {
 .game-case,.starwake-case .game-case { grid-template-columns:1fr; gap:20px; }
 .starwake-case .game-case-media,.starwake-case .game-case-copy { grid-column:auto; grid-row:auto; }
 .game-case-copy h2 { font-size:34px; }
 .game-case-deck br { display:none; }
}
@media(max-width:700px) {
 .portfolio-nav { gap:8px 22px; margin-bottom:24px; }
 .portfolio-selected { gap:30px; }
 .portfolio-archive { padding:23px; }
 .game-case { padding-bottom:28px; gap:16px; }
 .game-case-deck { font-size:23px; }
 .game-case-copy h2 { font-size:32px; }
 .game-case-copy h2 span { font-size:18px; }
 .starwake-case { padding-top:26px; }
 .early-experiment { grid-template-columns:1fr; gap:20px; padding-block:28px; }
 .early-experiment h2 { font-size:25px; }
}

/* Homepage: compact industrial-futurist studio. Other routes keep the editorial theme. */
body.home-theme {
  --paper:#0b1418; --paper-deep:#16262c; --ink:#ecf3ef; --muted:#a4b8ba;
  --green:#77e3d5; --green-dark:#133d3d; --inverse:#0b1418;
  --line:#2d4147; --sage:#77e3d5; --warm:#e9bf7d;
  --font-brand:"PingFang SC","Microsoft YaHei","Noto Sans CJK SC",sans-serif;
  --font-meta:Consolas,"SFMono-Regular","Liberation Mono",monospace;
  color-scheme:dark; background:#0b1418;
}
.home-theme .site-header { height:auto; min-height:82px; border-color:#2d4147; }
.home-theme .wordmark .brand-mark { width:29px; height:38px; }
.home-theme .wordmark .brand-type { width:108px; filter:brightness(0) invert(.95); }
.home-theme .site-header nav a { color:#dce7e5; }
.home-theme .site-header nav a:hover { color:var(--green); }
.home-theme .site-header nav a span { color:#92a9ad; }
.home-theme .menu-toggle { background:transparent; }
.home-theme #mobile-nav { background:#16262c; border-color:#345056; }
.home-theme .skip-link { color:#0b1418; background:#77e3d5; }
.home-theme .journal-home { position:relative; isolation:isolate; background:radial-gradient(ellipse 65% 440px at 85% 5%,#17474b55,transparent 80%); }
.home-theme .journal-home::before { content:""; position:absolute; z-index:-1; inset:0 0 auto; height:620px; pointer-events:none; background:radial-gradient(ellipse at 92% 22%,#288b8c4a,transparent 58%),radial-gradient(ellipse at 6% 95%,#9273421a,transparent 40%),repeating-linear-gradient(128deg,transparent 0 89px,#80dace0a 90px,transparent 91px); mask-image:linear-gradient(#000 65%,transparent); }
.home-theme .home-eyebrow { font-size:11px; font-weight:500; line-height:1.75; letter-spacing:.08em; color:#9bb6b9; }
.home-theme .home-eyebrow>span { display:inline-block; width:6px; height:6px; margin:0 9px 1px 0; border-radius:50%; background:#77e3d5; box-shadow:0 0 13px #77e3d57a; }
.home-theme .home-hero { position:relative; isolation:isolate; display:grid; grid-template-columns:.91fr 1.09fr; gap:5%; align-items:center; padding-block:48px 35px; }
.home-theme .home-hero-copy { min-width:0; }
.home-theme .home-hero h1 { margin:21px 0 22px; font-size:clamp(36px,3.9vw,56px); font-weight:500; line-height:1.35; letter-spacing:-.055em; }
.home-theme .home-hero h1 em { font-style:normal; color:#77e3d5; }
.home-theme .home-deck { max-width:440px; font-size:15px; line-height:1.95; color:#b8c9c9; }
.home-theme .home-actions { display:flex; align-items:center; gap:26px; margin-top:25px; flex-wrap:wrap; }
.home-theme .home-actions .button { color:#0b1418; background:#77e3d5; min-height:48px; gap:30px; padding:12px 21px; border:1px solid #a1f7e8; border-radius:3px; }
.home-theme .home-actions .button:hover { background:#a7f5e9; }
.home-theme .home-actions .text-link { border:0; font-size:13px; gap:16px; }
.home-theme .home-hero-note { display:flex; flex-direction:column; gap:7px; margin-top:30px; font-size:11px; color:#8ca8ac; line-height:1.7; }
.home-theme .home-hero-note span { color:#b7c7c7; letter-spacing:.16em; }
.home-theme .home-product { min-width:0; position:relative; padding:12px 0 0; }
.home-theme .home-product::before { content:""; position:absolute; inset:-24px -20px 60px; pointer-events:none; background:linear-gradient(#5cbfb10c 1px,transparent 1px),linear-gradient(90deg,#5cbfb10c 1px,transparent 1px); background-size:32px 32px; mask-image:radial-gradient(ellipse at center,#000,transparent 75%); }
.home-theme .product-frame { position:relative; border:1px solid #42666c; border-radius:8px; background:#101d22; box-shadow:0 0 0 5px #77e3d504,0 18px 60px #0005; }
.home-theme .product-frame::before { content:""; position:absolute; height:2px; top:-1px; left:18%; right:18%; background:linear-gradient(90deg,transparent,#83e8dd,transparent); }
.home-theme .product-frame-label { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:13px 17px; font-size:10px; color:#bbced0; letter-spacing:.07em; }
.home-theme .home-status { display:inline-flex; align-items:center; gap:6px; color:#e9bf7d; }
.home-theme .home-status::before { content:""; width:5px; height:5px; border-radius:50%; background:currentColor; }
.home-theme .home-canvas { display:block; margin:0 8px; border:1px solid #38454c; }
.home-theme .home-canvas img { width:100%; height:auto; display:block; }
.home-theme .product-frame-bottom { display:flex; justify-content:space-between; gap:8px; padding:12px 18px; font-size:10px; color:#92a9ad; }
.home-theme .product-frame-bottom span::before { content:"+"; color:#77e3d5; margin-right:7px; }
.home-theme .home-product-caption { display:flex; justify-content:space-between; align-items:center; gap:18px; margin-top:18px; }
.home-theme .home-product-caption h2 { font-size:19px; font-weight:500; letter-spacing:-.025em; }
.home-theme .home-product-caption p { margin-top:7px; font-size:12px; color:#9bb1b5; line-height:1.8; }
.home-theme .product-detail-link { flex-shrink:0; font-size:11px; color:#bed1d0; padding-block:12px; }
.home-theme .home-directory { display:grid; grid-template-columns:repeat(3,1fr); border-block:1px solid #2d4147; }
.home-theme .home-directory>a { display:flex; align-items:center; gap:15px; min-width:0; padding:18px 22px; border-left:1px solid #2d4147; transition:background .2s; }
.home-theme .home-directory>a:first-child { padding-left:0; border-left:0; }
.home-theme .home-directory>a:last-child { padding-right:0; }
.home-theme .home-directory>a:hover { background:#77e3d508; }
.home-theme .home-index { font:24px var(--font-meta); color:#6a9198; letter-spacing:-.08em; }
.home-theme .home-directory small { display:block; font:9px var(--font-meta); color:#95b0b4; margin-bottom:6px; letter-spacing:.05em; }
.home-theme .home-directory strong { display:block; font-size:14px; font-weight:500; }
.home-theme .directory-detail { margin-left:auto; font-size:10px; color:#94aaad; }
.home-theme .home-projects { padding-block:43px 44px; scroll-margin-top:24px; }
.home-theme .home-section-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:25px; }
.home-theme .home-section-heading h2 { margin-top:10px; font-size:clamp(25px,2.2vw,32px); line-height:1.5; font-weight:500; letter-spacing:-.035em; }
.home-theme .home-section-heading>.text-link { flex-shrink:0; gap:22px; font-size:12px; border-color:#577174; }
/* Selected projects: a large inhabited world beside two compact, different practices. */
.home-theme .home-section-heading h2 em { color:var(--green); font-style:normal; }
.home-theme .home-project-grid { display:grid; grid-template-columns:1.18fr 1fr; gap:20px; align-items:stretch; }
.home-theme .home-project { min-width:0; border:1px solid #31494e; background:#101c21; border-radius:5px; overflow:hidden; }
.home-theme .home-project:focus-within { outline:2px solid var(--green); outline-offset:4px; }
.home-theme .home-project--spool { grid-row:span 2; background:linear-gradient(155deg,#202a27,#102025); display:flex; flex-direction:column; }
.home-theme .home-project-visual { display:block; position:relative; border-bottom:1px solid #31494e; }
.home-theme .home-project-visual img { display:block; width:100%; height:auto; }
.home-theme .project-visual-label { display:block; padding:9px 20px; color:#b4c7c8; background:#16262c; font:10px/1.7 var(--font-meta); letter-spacing:.025em; }
.home-theme .home-project--spool .project-visual-label { color:#e9bf7d; background:#27302b; }
.home-theme .home-project-copy { padding:19px 23px 21px; }
.home-theme .home-project-meta { display:flex; justify-content:space-between; flex-wrap:wrap; gap:4px 16px; color:#a5bbbc; font-size:10px; line-height:1.8; }
.home-theme .home-project-meta>span:first-child { color:var(--green); letter-spacing:.06em; }
.home-theme .home-project h3 { margin-top:9px; font-size:25px; font-weight:500; line-height:1.5; letter-spacing:-.03em; }
.home-theme .home-project--spool h3 { font-size:36px; letter-spacing:.1em; }
.home-theme .home-project-copy>p { margin-top:9px; color:#b7c8c8; font-size:13px; line-height:1.9; }
.home-theme .home-project--spool .home-project-copy { flex:1; display:flex; flex-direction:column; padding:24px 27px; }
.home-theme .home-project--spool .home-project-copy>p { max-width:470px; font-size:15px; line-height:2; }
.home-theme .home-project--spool .home-project-copy>.project-observation { margin-top:20px; padding-top:14px; border-top:1px solid #3f5650; color:#c6c9b1; font-size:12px; }
.home-theme .project-observation span { display:block; margin-bottom:5px; font:9px/1.8 var(--font-meta); color:#b7af8d; letter-spacing:.04em; }
.home-theme .project-tags { display:flex; flex-wrap:wrap; gap:8px; padding:0; list-style:none; margin-top:17px; }
.home-theme .project-tags li { color:#bdd0c9; font-size:10px; line-height:1.8; padding:3px 9px; border:1px solid #496058; border-radius:2px; }
.home-theme .home-project--starwake .project-tags { display:none; }
.home-theme .home-project .text-link { margin-top:12px; font-size:12px; border:0; color:#d1e6df; padding-block:7px; }
.home-theme .home-project--spool .text-link { margin-top:auto; padding-top:22px; align-self:flex-start; }
.home-theme .home-project--music { display:grid; grid-template-columns:.78fr 1.1fr; align-items:center; background:#222723; }
.home-theme .home-project--music .home-project-visual { border:0; align-self:stretch; display:flex; flex-direction:column; justify-content:center; background:#131f22; }
.home-theme .home-project--music .project-visual-label { font-size:9px; padding:7px 12px; }
.home-theme .home-project--music .home-project-copy { padding:17px; }
.home-theme .home-project--music .home-project-meta { font-size:9px; gap:2px 8px; }
.home-theme .home-project--music h3 { font-size:22px; }
.home-theme .home-project--music .home-project-copy>p { font-size:12px; }
.home-theme .home-project--music .text-link { margin-top:8px; font-size:11px; }
.home-theme .home-workspace { display:grid; grid-template-columns:190px 1fr auto; align-items:center; gap:25px; border-block:1px solid #365259; background:linear-gradient(110deg,#1b3236,#122126); padding:20px; margin-top:20px; }
.home-theme .workspace-preview { display:block; border:1px solid #4b6468; }
.home-theme .workspace-preview img { display:block; width:100%; height:auto; }
.home-theme .workspace-copy { min-width:0; }
.home-theme .workspace-copy .home-eyebrow { color:#9bbdb8; font-size:10px; }
.home-theme .workspace-copy h3 { display:flex; align-items:center; flex-wrap:wrap; gap:6px 15px; margin-block:10px 8px; font-size:20px; font-weight:500; }
.home-theme .workspace-copy h3 span { color:#e9bf7d; font:10px/1.8 var(--font-meta); }
.home-theme .workspace-copy>p:last-child { max-width:640px; color:#b8cccb; font-size:13px; line-height:1.85; }
.home-theme .workspace-link { color:#bce8e1; font-size:12px; white-space:nowrap; padding-block:12px; }
.home-theme .home-project-update { display:flex; align-items:baseline; flex-wrap:wrap; gap:10px 22px; padding-top:18px; color:#a8bdbc; font-size:11px; line-height:1.8; }
.home-theme .update-date { color:#e9bf7d; font:10px var(--font-meta); }
.home-theme .home-project-update a { margin-left:auto; color:#c3dcd6; padding-block:5px; }
.home-theme .home-journal { background:#e9eee7; color:#233b39; padding-block:43px 39px; }
.home-theme .home-journal .home-eyebrow { color:#526d69; }
.home-theme .home-journal .text-link { color:#2b5e52; border-color:#66897c; }
.home-theme .home-journal a:focus-visible { outline-color:#265e54; }
.home-theme .home-journal-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:30px; }
.home-theme .home-journal-grid article { display:flex; flex-direction:column; border-top:1px solid #a8bbb2; padding-top:20px; }
.home-theme .home-note-meta { display:flex; align-items:center; gap:16px; color:#536c62; }
.home-theme .home-note-number { font:32px var(--font-meta); letter-spacing:-.07em; color:#4e796b; }
.home-theme .home-note-meta>span:last-child { font-size:10px; line-height:1.7; }
.home-theme .home-note-meta time { display:block; color:#5c7269; font:10px var(--font-meta); margin-top:4px; }
.home-theme .home-journal h3 { font-size:21px; font-weight:500; line-height:1.6; margin:17px 0 12px; }
.home-theme .home-journal-grid article>p { font-size:13px; color:#53685d; line-height:1.9; margin-bottom:15px; }
.home-theme .home-journal-grid article>.text-link { margin-top:auto; font-size:12px; border:0; }
.home-theme .home-about { display:grid; grid-template-columns:1fr 1.4fr; gap:9%; align-items:center; padding-block:43px; }
.home-theme .home-about h2 { font-size:30px; line-height:1.5; margin-top:12px; }
.home-theme .home-about>div>p:not(.home-eyebrow) { color:#aebfc0; font-size:14px; line-height:2; max-width:660px; }
.home-theme .home-about .text-link { margin-top:14px; color:#cbded9; font-size:12px; border:0; }
.home-theme .home-contact { background:radial-gradient(ellipse at 75% 115%,#2b626747,transparent 62%),#14272d; border-block:1px solid #345159; padding-block:36px; }
.home-theme .home-contact>.wrap { display:flex; align-items:center; justify-content:space-between; gap:40px; }
.home-theme .home-contact .home-eyebrow { color:#8fc7c2; font:10px var(--font-meta); letter-spacing:.12em; }
.home-theme .home-contact h2 { font-size:32px; font-weight:500; line-height:1.5; margin-block:12px; }
.home-theme .home-contact p:not(.home-eyebrow) { font-size:12px; line-height:1.8; color:#b4c9c9; }
.home-theme .home-contact-details { display:flex; flex-direction:column; align-items:flex-start; gap:13px; }
.home-theme .home-email { font-size:clamp(21px,2.1vw,30px); padding-block:7px; border-bottom:1px solid #5a8d90; color:#92e8d9; letter-spacing:-.03em; }
.home-theme .home-phone { font:18px var(--font-meta); letter-spacing:.06em; padding-block:5px; }
.home-theme .home-contact-details .text-link { border:0; color:#b6cfcd; font-size:12px; }
.home-theme :is(.text-link,.product-detail-link,.home-product-caption h2 a,.home-project h3 a,.home-journal h3 a):hover,
.home-theme .home-workspace:hover .workspace-link { text-decoration:underline; text-underline-offset:5px; }
.home-theme .site-footer { padding-block:28px; color:#a4b8ba; }
.home-theme .footer-brand { color:#edf4ef; font-family:var(--font-brand); }
.home-theme .site-footer .back-top { color:#c8ddda; }
@media (max-width:1100px) {
  .home-theme .home-hero { gap:4%; }
  .home-theme .home-directory>a { gap:12px; padding-inline:17px; }
  .home-theme .directory-detail { display:none; }
  .home-theme .home-journal-grid { gap:22px; }
}
@media (max-width:900px) {
  .home-theme .home-hero { grid-template-columns:1fr 1fr; padding-top:32px; gap:24px; }
  .home-theme .home-hero h1 { font-size:34px; }
  .home-theme .home-deck { font-size:14px; }
  .home-theme .home-actions { gap:13px; margin-top:20px; }
  .home-theme .home-actions .button { gap:17px; padding-inline:15px; font-size:12px; }
  .home-theme .home-actions .text-link { font-size:12px; gap:10px; }
  .home-theme .home-hero-note { margin-top:20px; font-size:10px; }
  .home-theme .home-product-caption { display:block; }
  .home-theme .product-detail-link { display:none; }
  .home-theme .home-product-caption h2 { font-size:17px; }
  .home-theme .home-product-caption p { font-size:11px; }
  .home-theme .home-journal h3 { font-size:18px; }
  .home-theme .home-journal-grid article>p { font-size:12px; }
}
@media (max-width:700px) {
  .home-theme .site-header { min-height:72px; }
  .home-theme .wordmark .brand-mark { width:25px; height:33px; }
  .home-theme .wordmark .brand-type { width:98px; }
  .home-theme .home-hero { grid-template-columns:1fr; gap:25px; padding-block:30px 27px; }
  .home-theme .home-hero h1 { font-size:clamp(33px,8.8vw,49px); margin-block:17px 18px; line-height:1.35; }
  .home-theme .home-deck { max-width:460px; font-size:14px; line-height:1.85; }
  .home-theme .home-actions { gap:23px; margin-top:20px; }
  .home-theme .home-actions .button { font-size:13px; gap:22px; padding-inline:17px; min-height:46px; }
  .home-theme .home-hero-note { display:none; }
  .home-theme .home-product { padding:0; }
  .home-theme .home-product::before { inset:-16px -12px 45px; }
  .home-theme .product-frame-label { padding:11px 13px; font-size:9px; }
  .home-theme .home-canvas { margin-inline:6px; }
  .home-theme .product-frame-bottom { padding:10px 13px; font-size:9px; }
  .home-theme .home-product-caption { margin-top:14px; }
  .home-theme .home-product-caption h2 { font-size:18px; }
  .home-theme .home-product-caption p { font-size:12px; }
  .home-theme .home-directory { grid-template-columns:1fr; }
  .home-theme .home-directory>a { gap:17px; padding:15px 0; border-left:0; border-top:1px solid #2d4147; }
  .home-theme .home-directory>a:first-child { border-top:0; }
  .home-theme .home-index { font-size:21px; }
  .home-theme .home-directory>a>span:nth-child(2) { display:flex; flex-direction:row-reverse; justify-content:space-between; align-items:center; gap:18px; flex:1; }
  .home-theme .home-directory small { margin:0; font-size:8px; }
  .home-theme .home-directory strong { font-size:13px; }
  .home-theme .home-projects { padding-block:30px; }
  .home-theme .home-section-heading { align-items:flex-start; margin-bottom:20px; flex-wrap:wrap; gap:8px 20px; }
  .home-theme .home-section-heading h2 { font-size:25px; margin-top:9px; }
  .home-theme .home-section-heading>.text-link { padding-block:5px; min-height:36px; gap:19px; }
  .home-theme .home-journal { padding-block:30px 25px; }
  .home-theme .home-journal-grid { grid-template-columns:1fr; gap:23px; }
  .home-theme .home-journal-grid article { padding-top:18px; }
  .home-theme .home-note-meta { gap:12px; }
  .home-theme .home-note-number { font-size:28px; }
  .home-theme .home-note-meta>span:last-child { display:flex; justify-content:space-between; align-items:center; flex:1; }
  .home-theme .home-note-meta time { margin:0; }
  .home-theme .home-journal h3 { font-size:21px; margin-block:13px 10px; }
  .home-theme .home-journal-grid article>p { font-size:13px; margin-bottom:8px; }
  .home-theme .home-about { grid-template-columns:1fr; gap:18px; padding-block:30px 27px; }
  .home-theme .home-about h2 { font-size:28px; }
  .home-theme .home-about>div>p:not(.home-eyebrow) { font-size:14px; line-height:1.95; }
  .home-theme .home-about .text-link { margin-top:10px; }
  .home-theme .home-contact { padding-block:28px; }
  .home-theme .home-contact>.wrap { display:block; }
  .home-theme .home-contact h2 { font-size:29px; }
  .home-theme .home-contact-details { margin-top:23px; gap:10px; }
  .home-theme .home-email { font-size:23px; }
  .home-theme .home-phone { font-size:19px; }
  .home-theme .site-footer { padding-block:26px; }
}
@media(max-width:360px) {
  .home-theme .home-hero h1 { font-size:31px; }
  .home-theme .home-actions { gap:14px; }
  .home-theme .home-actions .button { padding-inline:13px; gap:16px; }
  .home-theme .home-actions .text-link { font-size:11px; }
  .home-theme .home-directory>a>span:nth-child(2) { gap:10px; }
  .home-theme .home-directory small { font-size:7px; }
  .home-theme .home-section-heading h2 { font-size:23px; }
  .home-theme .home-email { font-size:21px; }
}
@media(prefers-reduced-motion:reduce) {
  .home-theme .home-directory>a { transition:none; }
}

.home-theme .studio-practice { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; list-style:none; padding:0; margin-top:22px; }
.home-theme .studio-practice li { border-top:1px solid #3b5456; padding-top:12px; }
.home-theme .studio-practice span { color:#7caaa7; font:10px var(--font-meta); display:block; margin-bottom:9px; }
.home-theme .studio-practice strong { font-size:12px; font-weight:500; color:#d6e7e0; }
.home-theme .studio-practice p { color:#9db7b6; font-size:11px; line-height:1.9; margin-top:7px; }
.home-theme :is(.workspace-copy h3 a,.home-project-update a):hover { text-decoration:underline; text-underline-offset:5px; }
@media (max-width:1100px) {
 .home-theme .home-project-grid { gap:16px; }
 .home-theme .home-project--spool .home-project-copy { padding:21px; }
 .home-theme .home-workspace { grid-template-columns:160px 1fr; gap:18px; }
 .home-theme .workspace-preview { grid-row:span 2; }
 .home-theme .workspace-link { justify-self:start; padding-block:0; }
}
@media (max-width:700px) {
 .home-theme .home-project-grid { grid-template-columns:1fr; gap:18px; }
 .home-theme .home-project--spool { grid-row:auto; }
 .home-theme .home-project--spool .home-project-copy,.home-theme .home-project-copy { padding:19px 20px; }
 .home-theme .home-project--spool h3 { font-size:30px; }
 .home-theme .home-project--spool .home-project-copy>p { font-size:14px; }
 .home-theme .home-project--spool .text-link { padding-top:15px; }
 .home-theme .home-project--music { grid-column:auto; grid-template-columns:.8fr 1.1fr; }
 .home-theme .home-project--music .home-project-visual { display:flex; }
 .home-theme .home-project--music .home-project-copy { padding:14px; }
 .home-theme .home-project--music .home-project-meta>span:last-child { display:none; }
 .home-theme .home-project--music h3 { font-size:21px; }
 .home-theme .home-project--music .home-project-copy>p { font-size:12px; }
 .home-theme .home-project--music .text-link { padding-block:4px; }
 .home-theme .home-workspace { grid-template-columns:105px 1fr; padding:17px 14px; gap:14px; }
 .home-theme .workspace-preview { grid-column:1; grid-row:1 / 3; align-self:center; }
 .home-theme .workspace-copy { display:contents; }
 .home-theme .workspace-copy h3 { grid-column:2; grid-row:2; font-size:17px; margin:0; align-self:start; }
 .home-theme .workspace-copy .home-eyebrow { grid-column:2; grid-row:1; font-size:9px; align-self:end; }
 .home-theme .workspace-copy>p:last-child { grid-column:1 / -1; grid-row:3; font-size:12px; margin:0; }
 .home-theme .workspace-link { grid-column:1 / -1; grid-row:4; font-size:11px; }
 .home-theme .home-project-update { column-gap:13px; font-size:11px; }
 .home-theme .home-project-update p { flex:1; min-width:190px; }
 .home-theme .home-project-update a { margin-left:0; }
 .home-theme .studio-practice { gap:14px; }
 .home-theme .home-section-heading h2 em { display:block; }
}
@media (max-width:360px) {
 .home-theme .workspace-copy h3 { font-size:16px; }
 .home-theme .studio-practice { grid-template-columns:1fr; gap:11px; }
 .home-theme .studio-practice span { float:left; margin-right:12px; }
 .home-theme .studio-practice p { margin-left:26px; }
}

/* Filing links only; preserve the frozen site styles and existing visual tokens. */
.footer-registrations {display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;max-width:100%;font-size:12px;color:var(--muted)}
.footer-registrations a {display:inline-flex;align-items:center;gap:6px;max-width:100%;min-height:24px}
.footer-registrations img {display:block;flex:none;height:20px;width:auto}
