/* Covers share a canvas; protected creator photos and detail media keep their own ratio. */
:root {
  --pc-paper:#efede5; --pc-ink:#24251f; --pc-muted:#69685d; --pc-line:#b4b1a5; --pc-clay:#b5563a; --pc-media-paper:#f8f6ef;
  --pc-body:"Hiragino Sans GB","PingFang SC","Microsoft YaHei",sans-serif; --pc-mono:"SFMono-Regular",Menlo,Consolas,monospace; --pc-pad:clamp(20px,4vw,72px);
}
* {box-sizing:border-box} html {scroll-behavior:smooth;scroll-padding-top:108px}
body.pc-page {margin:0;background:var(--pc-paper);background-image:var(--pc-grain);color:var(--pc-ink);font:16px/1.7 var(--pc-body);-webkit-font-smoothing:antialiased}
[hidden] {display:none!important} a {color:inherit} button {color:inherit;font:inherit;cursor:pointer} a,button {-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible {outline:3px solid var(--pc-clay);outline-offset:5px} h1,h2,h3,p,figure {margin:0}
.pc-shell {width:calc(100% - 2 * var(--pc-pad));max-width:1800px;margin-inline:auto}
.pc-skip {position:fixed;left:16px;top:-80px;z-index:30;padding:12px 20px;background:var(--pc-ink);color:white}.pc-skip:focus {top:12px}
.pc-sr-only {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.pc-preview {display:flex;flex-wrap:wrap;gap:4px 20px;align-items:center;justify-content:space-between;padding:6px var(--pc-pad);background:var(--pc-ink);color:var(--pc-paper);font:12px/1.6 var(--pc-mono)}
.pc-preview-note {color:#d3d0c5}.pc-header {position:sticky;top:0;z-index:10;background:var(--pc-paper);border-bottom:1px solid var(--pc-line)}
.pc-header-inner {min-height:84px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.pc-brand {display:inline-flex;align-items:center;gap:10px;text-decoration:none;min-height:44px}.pc-brand img {display:block;flex:none}
.pc-brand strong {display:block;font-size:20px;letter-spacing:-.6px;line-height:1.2;font-weight:850}.pc-brand small {display:block;font-size:12px;margin-top:3px;color:var(--pc-muted)}
.pc-nav {display:flex;align-items:center;gap:clamp(24px,3vw,48px)}.pc-nav a {display:inline-flex;align-items:center;min-height:44px;text-decoration:none;font-size:14px;font-weight:650;white-space:nowrap}
.pc-nav a[aria-current="page"] {color:var(--pc-clay)}.pc-nav sup {font:12px var(--pc-mono);margin-left:7px;margin-top:-12px}.pc-nav a:hover {text-decoration:underline;text-underline-offset:7px}
.pc-outline-link {min-height:44px;display:inline-flex;align-items:center;justify-content:space-between;gap:22px;border:1px solid var(--pc-ink);padding:9px 16px;text-decoration:none;font-size:14px;font-weight:650}
.pc-outline-link:hover {background:var(--pc-ink);color:var(--pc-paper)}
.pc-eyebrow {font:12px/1.5 var(--pc-mono);letter-spacing:.065em}
.pc-hero {display:grid;grid-template-columns:1.1fr 1fr;gap:44px;align-items:center;padding-block:34px 40px}.pc-hero-title>.pc-eyebrow {color:var(--pc-clay);margin-bottom:18px}
.pc-hero h1 {font-size:clamp(54px,5.65vw,92px);line-height:1.07;letter-spacing:-.065em;font-weight:900;-webkit-text-stroke:.4px currentColor}
.pc-hero h1>span {display:block;transform:rotate(-1.4deg);transform-origin:left center}.pc-hero h1>span+span {transform:rotate(.8deg);padding-left:.03em}
.pc-exclaim {display:inline-block;color:var(--pc-clay);transform:rotate(9deg);font-family:var(--pc-mono)}
.pc-hero-aside {display:flex;justify-content:space-between;align-items:center;gap:24px;min-width:0}.pc-hero-copy {min-width:0}.pc-hero-copy p {font-size:clamp(18px,1.55vw,25px);line-height:1.8;font-weight:550}
.pc-hero-copy>span {display:block;margin-top:12px;font-size:14px;color:var(--pc-muted)}.pc-hero-ornament {display:block;width:144px;height:76px;margin:0 0 10px;pointer-events:none}
.pc-circle-link {flex:none;width:112px;height:112px;border:1.5px solid var(--pc-ink);border-radius:50%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-decoration:none;transform:rotate(9deg);transition:transform .2s,background .2s}
.pc-circle-link span {font-size:18px;font-weight:850;line-height:1.4;text-align:center}.pc-circle-link b {font-size:30px;line-height:1.1}.pc-circle-link:hover {transform:rotate(0);background:#e7dfce}
.pc-section-line {display:flex;align-items:baseline;justify-content:space-between;gap:24px;border-block:1px solid var(--pc-ink);padding-block:14px}
.pc-section-line h2 {font-size:19px;font-weight:800}.pc-section-line h2 span {font:12px var(--pc-mono);margin-left:8px;color:var(--pc-muted)}.pc-section-line p {font-size:12px;color:var(--pc-muted)}
.pc-filter-bar {display:flex;flex-wrap:wrap;gap:8px;padding-block:17px}.pc-filter {display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:7px 16px;border:1px solid transparent;background:transparent;font-size:14px}
.pc-filter span {font:12px var(--pc-mono);opacity:.7}.pc-filter[aria-pressed="true"] {color:var(--pc-paper);background:var(--pc-ink);border-color:var(--pc-ink)}.pc-filter:hover:not([aria-pressed="true"]) {border-color:var(--pc-line)}
.pc-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--pc-line);border-left:1px solid var(--pc-line)}
.pc-card {min-width:0;border-right:1px solid var(--pc-line);border-bottom:1px solid var(--pc-line)}
.pc-card-link {display:flex;flex-direction:column;gap:24px;height:100%;padding:28px;text-decoration:none;transition:background .2s}.pc-card-link:hover {background:rgba(255,255,255,.22)}
.pc-card-copy {min-width:0;display:flex;flex-direction:column;flex:1}.pc-card-category {font-size:12px;color:var(--pc-clay);margin-bottom:9px}
.pc-card-name {display:flex;align-items:start;gap:12px;justify-content:space-between}.pc-card-name h3 {font-size:clamp(24px,1.85vw,33px);font-weight:850;letter-spacing:-.045em;line-height:1.4}
.pc-card-arrow {font-size:30px;line-height:1.35}.pc-card-link:hover .pc-card-arrow {color:var(--pc-clay)}
.pc-card-summary {margin-top:10px;margin-bottom:20px;font-size:16px;color:var(--pc-muted);line-height:1.8;text-wrap:pretty}.pc-card-author {margin-top:auto;font-size:12px;color:var(--pc-muted)}
/* The photograph is a separate unfiltered image layer, not an AI-redrawn composite. */
.pc-case-cover {--pc-cover-accent:#b5563a;--pc-cover-secondary:#77856a;position:relative;isolation:isolate;flex:none;width:100%;aspect-ratio:4/3;overflow:hidden;display:grid;place-items:center;border:1px solid var(--pc-line);background:#f3f0e6 url('covers/paper-v2.jpg') center/100% 100%}
.pc-case-cover[data-category="design"] {--pc-cover-accent:#77856a;--pc-cover-secondary:#b5563a}
.pc-case-cover[data-category="ai"] {--pc-cover-accent:#73877f;--pc-cover-secondary:#c2a469}
.pc-case-cover[data-category="build"] {--pc-cover-accent:#4b5e69;--pc-cover-secondary:#77856a}
.pc-cover-disc,.pc-cover-tile,.pc-cover-marks {position:absolute;pointer-events:none;z-index:0}
.pc-cover-disc {width:24%;aspect-ratio:1;border-radius:50%;background:var(--pc-cover-accent);left:4%;top:9%;opacity:.85}
.pc-cover-tile {width:25%;height:18%;right:4%;bottom:8%;background:var(--pc-cover-secondary);transform:rotate(8deg);opacity:.85}
.pc-cover-marks {width:7%;height:1%;left:8%;bottom:7%;border-block:1px solid var(--pc-ink);opacity:.6}
.pc-case-cover[data-variant="1"] .pc-cover-disc {left:auto;right:7%;top:8%;width:30%;border:2px solid var(--pc-cover-accent);background:transparent}
.pc-case-cover[data-variant="1"] .pc-cover-tile {right:auto;left:5%;bottom:7%;transform:rotate(-6deg)}
.pc-case-cover[data-variant="1"] .pc-cover-marks {left:auto;right:9%}
.pc-case-cover[data-variant="2"] .pc-cover-disc {top:auto;bottom:9%;width:28%;left:5%;border:2px solid var(--pc-cover-accent);background:transparent}
.pc-case-cover[data-variant="2"] .pc-cover-tile {bottom:auto;top:9%;right:5%;height:23%;width:20%;transform:rotate(5deg)}
.pc-case-cover[data-orientation="portrait"] .pc-cover-disc {width:38%;left:9%;top:17%;bottom:auto;right:auto}
.pc-case-cover[data-orientation="portrait"] .pc-cover-tile {width:32%;height:25%;right:7%;bottom:14%;top:auto;left:auto;transform:rotate(-7deg)}
.pc-cover-print {position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:var(--pc-cover-width);padding:1.2%;background:var(--pc-media-paper);border:1px solid #a6a292;box-shadow:0 3px 8px #24251f16;z-index:1}
.pc-cover-print .pc-media-image {position:static;width:100%;height:auto;object-fit:contain}
.pc-case-cover[data-orientation="abstract"]>.pc-media-image {position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:contain}
.pc-case-cover[data-orientation="abstract"]>.pc-cover-disc,.pc-case-cover[data-orientation="abstract"]>.pc-cover-tile,.pc-case-cover[data-orientation="abstract"]>.pc-cover-marks {display:none}
.pc-case-cover .pc-cover-video-badge {left:5%;bottom:6%;width:34px;height:34px;z-index:2}
.pc-case-cover[data-failed="true"] .pc-cover-print {display:none}.pc-cover-fallback {position:relative;z-index:2;padding:8px 12px;background:var(--pc-media-paper);font-size:14px}
.pc-media-frame {--pc-media-gap:6px;min-width:0;width:100%}.pc-media-viewport {padding:var(--pc-media-gap);border:1px solid var(--pc-line);background:var(--pc-media-paper);min-width:0}
.pc-media-surface {position:relative;width:100%;aspect-ratio:var(--pc-media-ratio);overflow:hidden;background:var(--pc-media-paper);isolation:isolate}
.pc-media-image,.pc-media-video {display:block;width:100%;height:100%;min-height:0;min-width:0;object-fit:contain}
.pc-media-surface>.pc-media-image,.pc-media-video {position:absolute;inset:0}.pc-media-video {background:#171914}
.pc-detail .pc-media-portrait {width:min(100%,calc(min(64svh,640px) * var(--pc-media-ratio) + 2 * var(--pc-media-gap)));margin-inline:auto}
.pc-media-caption {display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 16px;padding-top:10px;font-size:12px;line-height:1.7;color:var(--pc-muted)}
.pc-media-caption a {flex:none;min-height:32px;text-underline-offset:3px}
.pc-media-play {position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:10px;border:0;width:100%;background:linear-gradient(transparent 45%,rgba(24,25,20,.2))}
.pc-play-disc {display:grid;place-items:center;width:64px;height:64px;background:var(--pc-media-paper);color:var(--pc-ink);border:1px solid var(--pc-ink);border-radius:50%;box-shadow:0 3px 12px #24251f20;transition:background .15s,color .15s}
.pc-play-disc::after {content:"";width:0;height:0;border-top:8px solid transparent;border-bottom:8px solid transparent;border-left:12px solid currentColor;margin-left:4px}
.pc-play-label {padding:5px 11px;color:var(--pc-ink);background:var(--pc-media-paper);border:1px solid var(--pc-line);font-size:14px}
.pc-play-size {padding:3px 8px;background:var(--pc-media-paper);color:var(--pc-muted);font-size:12px}.pc-media-play:hover .pc-play-disc {background:var(--pc-ink);color:var(--pc-paper)}.pc-media-play:focus-visible {outline-offset:-4px}
.pc-cover-video-badge {position:absolute;left:14px;bottom:14px;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--pc-media-paper);border:1px solid var(--pc-line);color:var(--pc-ink)}
.pc-cover-video-badge::before {content:"";width:0;height:0;border-block:6px solid transparent;border-left:9px solid currentColor;margin-left:3px}
.pc-media-status {padding:8px 13px;color:var(--pc-clay);font-size:14px;border-top:1px solid #d0cdc2}.pc-media-status:empty {display:none}
.pc-image-error {position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:16px;color:var(--pc-muted);font-size:14px}
.pc-media-picker {display:flex;flex-wrap:wrap;gap:10px;margin-top:13px}.pc-media-choice {position:relative;width:76px;min-height:60px;padding:4px;border:1px solid var(--pc-line);background:var(--pc-media-paper)}
.pc-media-choice img {width:66px;height:50px;object-fit:contain}.pc-choice-play {position:absolute;left:6px;bottom:6px;padding:0 4px;color:var(--pc-ink);background:var(--pc-media-paper);font-size:12px;line-height:1.5}
.pc-media-choice[aria-pressed="true"] {border-color:var(--pc-clay);box-shadow:inset 0 -2px var(--pc-clay)}
.pc-nojs {padding:32px 0}.pc-catalog-tail {display:flex;justify-content:space-between;align-items:center;gap:24px;padding:26px 0 32px}
.pc-catalog-tail p {font-size:14px;font-weight:700}.pc-catalog-tail p span {margin-left:8px;color:var(--pc-muted);font-weight:400}.pc-catalog-tail>span {color:var(--pc-muted)}
.pc-contribute {display:grid;grid-template-columns:minmax(0,1.1fr) 100px minmax(0,1fr);gap:40px;align-items:center;padding-block:38px 46px;border-top:1px solid var(--pc-ink)}
.pc-contribute-ornament {display:block;width:100px;height:100px;pointer-events:none}.pc-contribute .pc-eyebrow {color:var(--pc-clay);margin-bottom:16px}
.pc-contribute h2 {font-size:clamp(32px,3.6vw,52px);line-height:1.25;font-weight:900;letter-spacing:-.045em}.pc-contribute-copy p {font-size:16px;line-height:1.9}.pc-contribute-copy a {margin-top:20px}
.pc-footer {border-top:1px solid var(--pc-ink)}.pc-footer-inner {display:flex;align-items:center;justify-content:space-between;gap:28px;padding-block:25px 32px}
.pc-footer-inner>div {display:flex;flex-direction:column}.pc-footer strong {font-size:25px;font-weight:850;letter-spacing:-1px}.pc-footer-inner>div span {color:var(--pc-muted);font-size:12px}.pc-footer a {display:inline-flex;align-items:center;min-height:44px;font-size:12px;text-underline-offset:5px}
.pc-detail {padding-block:20px 64px}.pc-back {display:inline-flex;min-height:44px;align-items:center;font-size:14px;text-decoration:none}.pc-back:hover {color:var(--pc-clay)}
.pc-detail-hero {display:grid;grid-template-columns:1.1fr 1fr;align-items:start;gap:clamp(30px,5vw,80px);padding-block:22px 46px}
.pc-detail-art-wrap,.pc-detail-copy {min-width:0}.pc-detail-copy {padding-top:18px}.pc-detail-copy>.pc-eyebrow {color:var(--pc-clay)}
.pc-detail-copy h1 {margin-block:18px 22px;max-width:9ch;font-size:clamp(42px,4.8vw,78px);line-height:1.15;font-weight:900;letter-spacing:-.065em}
#pc-detail-title:focus,#pc-library-title:focus {outline:none}
.pc-detail-summary {max-width:38ch;font-size:17px;line-height:1.9;color:#514f45;text-wrap:pretty}
.pc-detail[data-layout="text"] .pc-detail-hero {grid-template-columns:minmax(0,1fr);max-width:900px}.pc-detail[data-layout="text"] .pc-detail-copy h1 {max-width:16ch}.pc-detail[data-layout="text"] .pc-detail-summary {max-width:56ch}
.pc-creator-line {display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:24px;font-size:14px}.pc-creator-line>span:first-child {color:var(--pc-muted)}
.pc-category-label {padding-left:12px;border-left:1px solid var(--pc-line);color:var(--pc-muted)}.pc-detail-copy .pc-outline-link {margin-top:24px}
.pc-source-note {margin-top:15px;font-size:12px;color:var(--pc-muted);max-width:42ch}
.pc-detail-body {display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(32px,8vw,110px);padding-top:34px;border-top:1px solid var(--pc-ink);align-items:start}
.pc-about>.pc-eyebrow {margin-bottom:20px;color:var(--pc-clay)}.pc-about h2 {max-width:18ch;font-size:clamp(27px,2.5vw,39px);line-height:1.4;letter-spacing:-.04em}
.pc-about ol {list-style:none;padding:0;margin:27px 0 0;border-top:1px solid var(--pc-line)}.pc-about li {display:grid;grid-template-columns:30px 1fr;gap:14px;padding:19px 0;border-bottom:1px solid var(--pc-line);font-size:16px}
.pc-about li>b {font:12px/2 var(--pc-mono);color:var(--pc-clay)}
.pc-detail-note {padding:26px;background:#e5e2d8;border:1px solid var(--pc-line)}.pc-detail-note .pc-eyebrow {color:var(--pc-muted)}.pc-detail-note h2 {margin-block:16px;font-size:23px}
.pc-detail-note>p:not(.pc-eyebrow) {font-size:16px;color:#56554b}.pc-detail-note a {display:inline-flex;align-items:center;min-height:44px;margin-top:16px;font-size:14px;text-underline-offset:5px}
.pc-detail-note p.pc-note-small {padding-top:18px;margin-top:15px;border-top:1px solid var(--pc-line);font-size:12px}.pc-related-links {display:flex;flex-direction:column;align-items:flex-start}.pc-related-links a {margin-top:8px}
@media (min-width:1200px) {.pc-grid {grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:1100px) {.pc-nav {gap:20px}.pc-hero {gap:28px}.pc-circle-link {width:104px;height:104px}.pc-card-link {padding-inline:20px}.pc-contribute {gap:28px}}
@media (max-width:800px) {
  .pc-header {position:relative} html {scroll-padding-top:20px}.pc-nav {display:none}.pc-hero {grid-template-columns:1fr;gap:20px;padding-block:28px}
  .pc-hero h1 {font-size:clamp(48px,8.2vw,65px)}.pc-hero-copy p {font-size:18px}.pc-hero-copy p br {display:none}.pc-hero-ornament {display:none}
  .pc-hero-copy>span {margin-top:5px}.pc-card-link {padding:16px 17px 20px}.pc-card-name h3 {font-size:25px}
  .pc-contribute {grid-template-columns:1fr 1fr;gap:30px}.pc-contribute-ornament {display:none}.pc-detail-hero {gap:28px;grid-template-columns:1fr}
  .pc-detail-copy h1 {max-width:13ch;font-size:clamp(42px,7vw,60px)}.pc-detail-copy {padding-top:0}.pc-detail-summary {max-width:none}.pc-detail-body {gap:28px}
}
@media (max-width:600px) {
  .pc-header-inner {min-height:76px;gap:14px}.pc-brand strong {font-size:18px}.pc-brand img {width:32px;height:32px}
  .pc-hero-aside {gap:18px}.pc-circle-link {width:96px;height:96px}.pc-circle-link span {font-size:16px}
  .pc-hero h1 {font-size:clamp(40px,10.8vw,61px)}.pc-hero-copy p {font-size:16px}.pc-section-line {align-items:center;gap:14px}
  .pc-section-line h2 {font-size:17px;white-space:nowrap}.pc-section-line p {max-width:12ch;text-align:right}
  .pc-filter-bar {gap:5px;padding-block:12px}.pc-filter {padding:6px 10px;gap:7px}.pc-grid {grid-template-columns:minmax(0,1fr)}.pc-card-link {padding:17px 17px 21px}
  .pc-card-name h3 {font-size:25px}
  .pc-catalog-tail {display:block}.pc-catalog-tail p span {display:block;margin:4px 0 0}.pc-catalog-tail>span {display:block;margin-top:12px}
  .pc-contribute {display:block;padding-block:30px 36px}.pc-contribute h2 {font-size:34px}.pc-contribute-copy {margin-top:24px}.pc-footer-inner {align-items:flex-start;flex-direction:column;gap:9px}
  .pc-detail {padding-top:12px}.pc-detail-hero {padding-top:15px;padding-bottom:30px}.pc-detail-copy h1 {font-size:clamp(38px,10.5vw,57px);max-width:none}
  .pc-detail-summary {font-size:16px}.pc-detail-body {display:block}.pc-detail-note {margin-top:30px;padding:23px}
}
@media (max-width:400px) {.pc-hero-aside {flex-wrap:wrap}.pc-hero-copy {width:100%}.pc-circle-link {margin-left:auto}}
@media (prefers-reduced-motion:reduce) {html {scroll-behavior:auto}*,*::before,*::after {transition:none!important;animation:none!important}}
