/* Approved r2 reference; scoped by scripts/port-r2-styles.mjs. */
/* Final records extend the existing Living Canvas shell; earlier views unchanged. */
.portfolio .concept-hero-art{position:relative;padding:28px 10px 0 25px;perspective:1100px;min-width:0;isolation:isolate;margin-top:12px}
.portfolio .concept-art-back{position:absolute;inset:0 22px 125px 14px;border:1px solid #777369;background:#2c2c28;transform:rotate(-5deg);z-index:-1;transition:transform .4s}
.portfolio .concept-art-back>span{display:block;padding:12px 17px;font:9px/1.5 var(--mono);letter-spacing:1px;color:#d9d5c8}
.portfolio .concept-art-front{background:#f0ede3;border:6px solid #dcd8cb;box-shadow:0 24px 45px #0007;transform:rotate(2deg);transition:transform .4s;position:relative;z-index:1}
.portfolio .concept-art-front img{width:100%;height:285px;object-fit:cover;object-position:top;}
.portfolio .concept-art-ticket{position:relative;z-index:2;margin:-27px 15px 16px auto;padding:19px 23px;width:min(85%,310px);background:var(--paper);color:var(--paper-ink);transform:rotate(-3deg);box-shadow:0 12px 30px #0005;transition:transform .4s}
.portfolio .concept-art-ticket strong{display:block;font-size:20px;font-weight:500;line-height:1.25;letter-spacing:-.03em;margin-top:7px}
.portfolio .concept-hero-art>button{margin:10px 0;color:var(--ink)}
.portfolio .concept-hero-art figcaption{font:10px/1.7 var(--mono);color:var(--muted);margin-top:6px;max-width:54ch}
.portfolio .concept-hero-art.depth-open .concept-art-front{transform:rotate(0) translateY(-8px)}
.portfolio .concept-hero-art.depth-open .concept-art-back{transform:rotate(-8deg) translate(-7px,-12px)}
.portfolio .concept-hero-art.depth-open .concept-art-ticket{transform:rotate(0) translateY(7px)}
.portfolio .concept-typography{padding:27px 25px 35px;background:#16477c;color:#fff;min-height:285px}
.portfolio .concept-typography>span{font:9px/1.5 var(--mono);letter-spacing:1px;color:#e6eaf0}
.portfolio .concept-typography>strong{display:block;font-size:clamp(30px,4vw,54px);line-height:1;letter-spacing:-.055em;font-weight:600;margin:26px 0}
.portfolio .concept-typography>strong span{color:#ffe078}.portfolio .concept-type-path{display:flex;flex-wrap:wrap;gap:10px;font:10px/1.6 var(--mono);color:#fff}.portfolio .concept-type-path span+span{border-left:1px solid #a5b7c8;padding-left:10px}
.portfolio .concept-evidence{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin:38px 0 0}
.portfolio .concept-evidence section{background:var(--surface);padding:25px}.portfolio .concept-evidence .eyebrow{color:var(--orange);font-size:9px}.portfolio .concept-evidence :is(h3:not(:where([data-portfolio-heading-source])),:where([data-portfolio-heading-source="h3"])){font-size:19px;line-height:1.25;margin:12px 0}.portfolio .concept-evidence section>p:last-child{font-size:12px;line-height:1.85;color:var(--muted)}
.portfolio .concept-figure :is(h3:not(:where([data-portfolio-heading-source])),:where([data-portfolio-heading-source="h3"])){font-size:clamp(21px,3vw,32px);font-weight:500;margin-top:12px;letter-spacing:-.035em;max-width:660px}.portfolio .concept-figure .figure-head{align-items:start;gap:20px}.portfolio .cf-controls{display:flex;flex-wrap:wrap;gap:8px;margin:25px 0}.portfolio .cf-result{padding:28px;border:1px solid var(--line);background:var(--surface);margin:22px 0}.portfolio .cf-result>.eyebrow{color:var(--orange)}.portfolio .cf-result :is(h4:not(:where([data-portfolio-heading-source])),:where([data-portfolio-heading-source="h4"])){font-size:clamp(22px,3vw,34px);margin:14px 0;font-weight:500;line-height:1.2}.portfolio .cf-result>p{font-size:14px;line-height:1.8;color:var(--muted)}.portfolio .cf-result pre{font:11px/1.7 var(--mono);white-space:pre-wrap;overflow-wrap:anywhere;border-top:1px solid var(--line);padding-top:20px;margin-top:22px;color:var(--muted)}.portfolio .cf-palette{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:25px}.portfolio .cf-palette span{border:1px solid #746e61;background:#38352e;color:#f5eddd;padding:14px 10px;font-size:12px;line-height:1.6}.portfolio .concept-figure figcaption{font-size:11px;line-height:1.8;color:var(--muted)}
.portfolio .final-related{margin:55px 0;padding:34px 0;border-block:1px solid var(--line)}.portfolio .final-related>:is(h2:not(:where([data-portfolio-heading-source])),:where([data-portfolio-heading-source="h2"])){font-size:30px;font-weight:400;margin-bottom:18px}.portfolio .final-related-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.portfolio .final-related a{display:flex;align-items:center;min-height:72px;padding:19px 22px;border:1px solid var(--line);font-size:15px;line-height:1.55;letter-spacing:-.02em;transition:border-color .2s}.portfolio .final-related a:hover{border-color:var(--orange)}.portfolio .article-body .final-related{color:var(--paper-ink);border-color:var(--paper-line)}.portfolio .article-body .final-related a{border-color:var(--paper-line)}.portfolio .paper-dark .article-body .final-related{color:var(--ink)}
.portfolio .final-record-meta{display:flex;gap:15px;flex-wrap:wrap;font:10px/1.65 var(--mono);color:var(--muted);margin-bottom:22px;padding-bottom:14px;border-bottom:1px solid var(--line)}.portfolio .final-record-meta [data-status-label]{color:var(--orange)}
.portfolio .card-bottom{flex-wrap:wrap}.portfolio .card-bottom .review-state{white-space:normal;font-size:9px;line-height:1.5;max-width:160px}.portfolio .card-reading-time{font:10px/1.6 var(--mono);color:var(--muted);display:block;margin:18px 0 4px}.portfolio .collection-card-copy{min-width:0}.portfolio .collection-card :is(h3:not(:where([data-portfolio-heading-source])),:where([data-portfolio-heading-source="h3"])){overflow-wrap:break-word}.portfolio .collection-card .eyebrow{min-width:0}.portfolio .article-page .byline{flex-wrap:wrap}
@media(max-width:1050px){.portfolio .concept-evidence{grid-template-columns:1fr}.portfolio .concept-evidence section{padding:23px}.portfolio .concept-hero-art{padding-left:15px}.portfolio .concept-art-front img{height:250px}.portfolio .concept-art-ticket{margin-right:2px;padding:15px 18px}.portfolio .concept-art-ticket strong{font-size:17px}}
@media(max-width:700px){.portfolio .concept-hero-art{padding:25px 8px 0;max-width:100%;margin-top:10px}.portfolio .concept-art-front img{height:auto;max-height:390px;object-fit:cover;object-position:top}.portfolio .concept-hero-art .concept-art-back{inset:3px 20px 130px 13px}.portfolio .concept-art-front{border-width:4px}.portfolio .concept-art-ticket{margin:-20px 8px 15px auto}.portfolio .concept-typography>strong{font-size:43px}.portfolio .concept-evidence{margin-top:28px}.portfolio .concept-figure .figure-head{flex-direction:column}.portfolio .cf-result{padding:20px 15px}.portfolio .cf-palette{grid-template-columns:1fr}.portfolio .cf-palette span{padding:10px 13px}.portfolio .final-related-links{grid-template-columns:1fr}.portfolio .final-related a{font-size:14px}.portfolio .concept-page .project-hero :is(h1:not(:where([data-portfolio-heading-source])),:where([data-portfolio-heading-source="h1"])){font-size:clamp(50px,13vw,84px)}}
@media(prefers-reduced-motion:reduce){.portfolio .concept-hero-art *{transition:none!important;transform:none!important}}
.portfolio .motion-off .concept-hero-art *{transition:none!important}
@media(forced-colors:active){.portfolio .concept-art-front,.portfolio .concept-art-ticket,.portfolio .cf-result,.portfolio .concept-evidence,.portfolio .cf-palette span{border:1px solid CanvasText}.portfolio .concept-art-ticket,.portfolio .concept-evidence section,.portfolio .cf-result{background:Canvas;color:CanvasText}}
/* Scoped final status label: the article's inherited accent was below 4.5:1. */
.portfolio .article-page:not(.paper-dark) .final-record-meta [data-status-label]{color:#9b401c}