/* Restrained paper edges; technology labels retain the reference's pill shape. */
:root{--radius-card:3px;--radius-control:3px;--radius-small:2px}
.top-nav,.contact-code,.partner-section .connection-bridge,.workflow-artifact{border-radius:var(--radius-card)}
.sequence-nav button,.sequence-nav button[aria-current=step],.guard-choices button,.guard-run,.stack-flow>div{border-radius:var(--radius-small)}
.work-card,.work-card-tilt{border-radius:2px}
.work-card{width:640px;flex-basis:640px}
.animated .work-rail{height:45vh;max-height:420px;top:35vh}
.work-card-tilt{overflow:hidden;background:#fbf8f0;box-shadow:2px 3px 0 #c4c0a4,0 5px 10px #203d2108}
.card-art{position:absolute;inset:0 0 62px 43%;width:auto;border:0;overflow:hidden;background:#fbf8f0}
.card-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.card-art:after{background:linear-gradient(90deg,#fbf8f0 0%,#fbf8f0a0 13%,transparent 36%)}
.card-meta{top:7%;left:4.5%;width:70%;font:600 10px/1.5 var(--mono);letter-spacing:.3px}
.card-copy{top:25%;left:4.5%;bottom:auto;width:60%;z-index:4}
.card-copy .project-title{font:700 clamp(40px,4vw,56px)/.95 var(--display);letter-spacing:-.02em;margin:0 0 20px;color:#182d25;cursor:default;max-width:100%}
.card-summary{font:500 13px/1.8 var(--body);margin:0;padding:17px 18px 23px 14px;background:#fffef9;filter:drop-shadow(0 2px 1px #24362710);clip-path:polygon(0 4%,9% 1%,17% 4%,30% 0,47% 3%,65% 1%,80% 3%,100% 0,99% 91%,89% 94%,76% 92%,62% 97%,43% 93%,25% 98%,8% 94%,0 100%)}
.card-statement{font:500 10px/1.7 var(--mono);color:#63725e;margin:13px 0 0;max-width:85%}
.card-footer{position:absolute;left:0;right:0;bottom:0;min-height:62px;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px 4.5%;z-index:5;background:#fbf8f0}
.card-tags{position:static;width:auto;display:flex;gap:5px;flex-wrap:wrap;max-width:61%}
.card-tags span{font:500 8px/1.3 var(--mono);border:1px solid #73806a;border-radius:999px;padding:5px 7px;color:#283f31}
.project-actions{display:flex;gap:15px;flex-direction:row;flex-shrink:0}
.project-action,.project-action.action-live,.project-action.action-github{display:inline-flex;width:auto;min-height:40px;gap:6px;padding:6px 0;background:transparent;color:#203b2f;border:0;border-radius:0;font:500 10px var(--mono);text-decoration:none;box-shadow:none}
.project-action:hover,.project-action.action-live:hover{background:none;color:#008c9e;text-decoration:underline;text-underline-offset:5px}
.project-action:focus-visible{outline:2px solid #009eaf;outline-offset:4px}
.action-icon{font-size:12px}.gallery-guide:after{display:none}
@media(min-width:1600px){.work-card{width:720px;flex-basis:720px}.card-copy .project-title{font-size:62px}.card-summary{font-size:15px}.card-statement{font-size:11px}.card-meta{font-size:11px}.card-tags span{font-size:9px}.project-action{font-size:11px}}
@media(max-height:750px) and (min-width:801px){.work-card{width:600px;flex-basis:600px}.card-copy{top:23%}.card-copy .project-title{font-size:43px;margin-bottom:14px}.card-summary{font-size:11px;padding:13px 14px 18px}.card-statement{font-size:8px;margin-top:8px}.card-meta{font-size:9px}.card-footer{min-height:56px;padding-top:8px;padding-bottom:8px}.card-tags span{font-size:7px}.project-action{font-size:9px}.card-art{bottom:56px}}
@media(max-width:800px){.work-card,body:not(.animated) .work-card{width:100%;height:450px;margin-bottom:30px}.card-meta{top:24px;left:24px;font-size:9px;width:85%}.card-art{inset:0 0 65px 30%;opacity:.53}.card-art:after{background:linear-gradient(90deg,#fbf8f0,transparent 65%)}.card-copy{left:24px;top:110px;width:calc(100% - 48px)}.card-copy .project-title{font-size:48px;margin-bottom:22px}.card-summary{max-width:440px;font-size:14px;line-height:1.8;padding:17px 16px 23px}.card-statement{font-size:10px;max-width:90%;margin-top:18px}.card-footer{min-height:65px;padding:10px 24px;gap:10px}.card-tags{max-width:56%;gap:5px}.card-tags span{font-size:6px;padding:5px 6px}.project-actions{gap:12px}.project-action,.project-action.action-live,.project-action.action-github{font-size:9px;min-height:44px;gap:4px}.action-icon{font-size:10px}}
@media(max-width:480px){.work-card,body:not(.animated) .work-card{height:440px}.card-copy{top:102px}.card-copy .project-title{font-size:43px}.card-summary{font-size:12px;line-height:1.85}.card-statement{font-size:8px}.card-meta{font-size:8px}.card-footer{padding:10px 18px}.card-tags{max-width:51%;gap:4px}.card-tags span{font-size:5px;padding:4px 5px}.project-actions{gap:10px}.project-action,.project-action.action-live,.project-action.action-github{font-size:8px}}

.project-actions{width:auto;margin:0}
@media(max-width:800px){.card-tags span{font-size:7px}.card-tags{max-width:58%}}

/* Full-height artwork with links laid over it, rather than a full-width footer band. */
.card-art{bottom:0}
.card-footer{min-height:58px;background:transparent;pointer-events:none}
.card-tags{pointer-events:auto;max-width:53%}
.project-actions{pointer-events:auto;gap:7px}
.project-action,.project-action.action-live,.project-action.action-github{padding:8px 9px;min-height:36px;background:#fbf8f0ed;border:1px solid #77826d70;border-radius:2px;font-size:8px;color:#1e392a;backdrop-filter:blur(6px)}
.project-action:hover,.project-action.action-live:hover{background:#fffdf5;color:#087e8d;text-decoration:none;border-color:#4b7660}
.card-summary{background:#fffef9;clip-path:polygon(0 9%,3% 6%,6% 8%,9% 3%,13% 7%,17% 2%,21% 5%,25% 0,29% 4%,34% 2%,38% 7%,42% 3%,46% 8%,51% 4%,55% 7%,60% 1%,64% 6%,69% 3%,74% 8%,78% 4%,82% 7%,86% 2%,91% 6%,96% 3%,100% 8%,99% 22%,100% 37%,98.5% 50%,100% 68%,99% 86%,100% 94%,96% 92%,92% 97%,87% 93%,83% 99%,78% 95%,73% 98%,69% 92%,64% 96%,59% 93%,54% 100%,50% 96%,45% 99%,40% 94%,35% 98%,30% 94%,25% 99%,21% 95%,16% 97%,12% 92%,8% 96%,4% 93%,0 98%,1% 77%,0 63%,1.5% 45%,0 29%);padding:22px 18px 27px 16px;transform:rotate(-.7deg);filter:none}
@media(max-height:750px) and (min-width:801px){.card-art{bottom:0}.card-summary{padding:16px 14px 20px}.card-footer{min-height:53px}}
@media(max-width:800px){.card-art{bottom:0}.card-copy{top:95px}.card-footer{padding:9px 18px}.card-summary{padding:21px 16px 25px}.project-action,.project-action.action-live,.project-action.action-github{min-height:44px;font-size:7px;padding:8px}.card-tags{max-width:49%}.card-tags span{font-size:6px}.card-statement{margin-top:12px}}
/* Only the grid, a conventional spinner, and the percentage. No launch card. */
#site-loader{display:none;position:fixed;inset:0;z-index:1000;place-items:center;background-color:#f7f4ea;background-image:linear-gradient(#65765e15 1px,transparent 1px),linear-gradient(90deg,#65765e15 1px,transparent 1px),linear-gradient(#65765e10 1px,transparent 1px),linear-gradient(90deg,#65765e10 1px,transparent 1px);background-size:100px 100px,100px 100px,20px 20px,20px 20px}
.booting #site-loader{display:grid}#site-loader[hidden]{display:none!important}
.loader-simple{display:flex;align-items:center;gap:20px;color:#203c2d}
.loader-spinner{width:30px;height:30px;border:2px solid #a4b09855;border-top-color:#203c2d;border-radius:50%;animation:loader-spin .8s linear infinite}
.loader-percentage{display:flex;align-items:baseline;font:400 clamp(28px,3.4vw,40px)/1.3 'Press Start 2P',monospace;letter-spacing:0;font-variant-numeric:tabular-nums;min-width:4.1ch}
.loader-percentage>span:last-child{font-size:.48em;letter-spacing:0;margin-left:6px}
@keyframes loader-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.loader-spinner{animation:none;border-right-color:#203c2d}}
