/* CV08: source artwork, fluid device panel and a quiet reading rail. */
:root{--rail-width:106px;--masthead-height:76px;--page-gutter:24px}
body.cv08{padding:var(--masthead-height) var(--page-gutter) 0 var(--rail-width);background:#354ff0;isolation:isolate}
body.cv08:before{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;background:#354ff0 url('assets/cv08/blue-full.webp') center top/cover no-repeat}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.cv08 main{width:100%;max-width:none;margin:0;background:transparent;overflow:clip}
.cv08 section{scroll-margin-top:calc(var(--masthead-height) + 24px)}
.cv08 #resume{scroll-margin-top:var(--masthead-height)}
/* Nine-slice chrome stretches; the three original graphics never stretch. */
.cv-masthead{position:fixed;inset:0 0 auto;height:var(--masthead-height);z-index:65;border:8px solid transparent;border-image:url('assets/cv08/header-frame.png') 8 8 10 8 fill / 8px 12px 7px 12px / 0 stretch;background:#191919;display:flex;align-items:center;justify-content:space-between;padding:0 20px;box-shadow:0 2px 0 #18223040}
.cv-masthead img{height:54px;width:auto;object-fit:contain;pointer-events:none}
.cv-masthead .masthead-slot{position:absolute;height:52px;left:50%;top:5px;transform:translateX(-50%)}
.cv08 .rail{position:fixed;inset:var(--masthead-height) auto 0 0;width:var(--rail-width);height:auto;z-index:60;display:flex;padding:0 10px 0 16px;background:none;border:0;box-shadow:none;pointer-events:none}
.cv08 .rail nav{position:relative;width:100%;height:auto;display:flex;flex-direction:column;gap:0;padding:0;margin:auto;pointer-events:auto;--nav-position:0px;--nav-track-height:204px}
.cv08 .rail nav a{position:relative;display:flex;flex:none;flex-direction:row;align-items:center;justify-content:flex-start;min-height:68px;margin:0;padding:0 0 0 22px;border:0;border-radius:0;box-shadow:none;background:none;color:#e1e7ff;font-size:12px;font-weight:600;white-space:nowrap;transition:color 160ms}
.cv08 .rail nav a:before{content:'';position:absolute;left:1px;top:calc(50% - 2px);width:5px;height:5px;border-radius:50%;background:#b9c6ff}
.cv08 .rail nav a:hover{transform:none;background:none;color:#fff}
.cv08 .rail nav a.active{background:none;border:0;box-shadow:none;color:#d6f75c}
.cv08 .rail nav a.active:before{background:#d6f75c}
.cv08 .rail nav a:focus-visible{outline-offset:0}
.nav-track{position:absolute;left:3px;top:34px;height:var(--nav-track-height);width:1px;background:#c1cdff66;pointer-events:none}
.nav-progress{position:absolute;top:0;left:0;width:1px;height:var(--nav-position);background:#d6f75c;transition:height 320ms var(--ease)}
.nav-thumb{position:absolute;left:-2px;top:-11px;width:5px;height:22px;border-radius:3px;background:#d6f75c;transform:translateY(var(--nav-position));transition:transform 320ms var(--ease)}
.cv08 .intro{padding:14px 0 0;background:none}
.cv08 .hero{position:relative;height:auto;min-height:0;max-height:none;aspect-ratio:1080/572;transform:none;border:0;border-radius:0;background:none;box-shadow:none;overflow:visible;isolation:isolate;z-index:2}
.cv08 .cv-hero-art{width:100%;height:auto;display:block;animation:cv-screen-on 650ms ease-out both}
.cv08 .hero:after{display:block;position:absolute;inset:91.08% auto auto 47.2%;width:5.2%;height:.8%;border:0;border-radius:3px;background:#d8ff70;box-shadow:0 0 8px #c7fb65;animation:cv-power 3s ease-in-out infinite;pointer-events:none}
.portrait-viewport{position:absolute;inset:0;clip-path:polygon(0 0,100% 0,100% 87.25%,0 87.25%);pointer-events:none}
.cv08 .portrait{right:7.4%;bottom:9.1%;height:94.4%;width:48%;z-index:2;clip-path:none;pointer-events:auto}
.cv08 .cv-phone-hotspot,.cv08 .cv-mail-hotspot{position:absolute;left:12.8%;width:27%;height:6.6%;z-index:3;border-radius:3px}
.cv08 .cv-phone-hotspot{top:52.9%}.cv08 .cv-mail-hotspot{top:59.95%}
.cv08 .cv-phone-hotspot:hover,.cv08 .cv-mail-hotspot:hover{background:#33def214;outline:1px solid #39d0e36b}
/* Continuous dark panel, with three career cards in each desktop row. */
.cv08 .cv-career,.cv08 .collection,.cv08 .collection.personal,.cv08 .contact{margin:0 2.87% 0 2.6%;border:0;border-inline:2px solid #202020;background:radial-gradient(#ffffff04 .7px,transparent 1px) 0 0/3px 3px,linear-gradient(90deg,#292929,#242424 50%,#2a2a2a);box-shadow:none}
.cv08 .cv-career{--shoulder:clamp(36px,3.45vw,82px);position:relative;margin-top:-3.1%;padding:calc(var(--shoulder) + 14px) 2.7% 25px;border-radius:0;clip-path:polygon(5.3% 0,94.7% 0,100% var(--shoulder),100% 100%,0 100%,0 var(--shoulder))}
.cv08 .cv-career:before{content:'';position:absolute;inset:0 0 auto;height:calc(var(--shoulder) + 15px);background:linear-gradient(#050505b8,#11111146 45%,transparent);pointer-events:none}
.career-heading{display:flex;align-items:center;justify-content:center;gap:22px;margin:0 1.1% 18px;line-height:1}
.career-heading img{width:clamp(240px,25vw,420px);height:auto}
.career-heading:before,.career-heading:after{content:'';flex:1;height:32px;background:repeating-linear-gradient(0deg,#424242 0 5px,transparent 5px 10px)}
.career-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 13px}
.cv08 .cv-career-card{position:relative;min-width:0;transform-origin:center;transition:transform 260ms var(--ease),filter 260ms;line-height:0}
.cv08 .cv-career-card img{width:100%;height:auto}
.cv08 .cv-career-card:hover{filter:brightness(1.1) drop-shadow(0 8px 7px #0006);z-index:3}
.cv08 .collection,.cv08 .collection.personal{padding:42px 4.1% 64px}
.cv08 .collection:before{display:none}
.cv08 .collection-heading{margin-bottom:35px;gap:24px}
.cv08 .collection h2{background:none;clip-path:none;box-shadow:none;transform:none;color:#b7b7b7;text-shadow:2px 3px #111,-1px -1px #595959;font-size:clamp(28px,2.3vw,44px);padding:0;white-space:nowrap}
.cv08 .collection-heading:after{content:'';flex:1;order:1;height:17px;background:repeating-linear-gradient(0deg,#484848 0 3px,transparent 3px 6px)}
.cv08 .view-switch{order:2;background:#222;border-color:#131313;box-shadow:inset 0 1px #626262}
.cv08 .projects,.cv08 .projects.list{padding:0;background:none;border:0;box-shadow:none;border-radius:0}
.cv08 .projects:before{display:none}
.cv08 .gallery .project-track{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:38px 32px;height:auto;margin:0;overflow:visible;perspective:none}
.cv08 .gallery .project{display:block;width:100%;position:relative;padding:0;transform:none;opacity:1;filter:none}
.cv08 .projects .project.reveal-pending{opacity:0;transform:translateY(30px) scale(.965);pointer-events:none}
.cv08 .projects .project{transform-origin:50% 65%}
.cv08 .gallery .case-space{padding:0 4px 7px 0}
.cv08 .gallery .jewel{transform:rotateY(-4deg) rotateZ(-2deg)}
.cv08 .gallery .project:hover .jewel{transform:rotateY(0) rotateZ(0) translateY(-4px)}
.cv08 .gallery .project:hover .case-lid{transform:translateZ(3px) rotateY(-9deg)}
.cv08 .gallery .project:hover .case-disc{transform:translateX(5%) translateZ(1px) rotate(18deg)}
.cv08 .gallery .project-info{display:block;padding-top:14px}
.cv08 .gallery .project-name{font-size:clamp(16px,1.2vw,23px);color:#e9e9e9}
.cv08 .gallery .project-type{font-size:12px;color:#a1a1a1}
.cv08 .gallery .project-elements,.cv08 .gallery .project-description,.cv08 .gallery .project-arrow{display:none}
.cv08 .list .list-head{color:#b4d881;border-bottom-color:#525252}
.cv08 .list .project{border-bottom-color:#ffffff20}
.project[data-project=myhero2] .cover-logo{height:34%;width:77%;left:10%;bottom:5%}
.project[data-project=myhero2] .cover:after{background:linear-gradient(0deg,#141d2cf2,transparent 70%)}
.cv08 .contact{padding:45px 4.1% 50px;color:#e2e2e2;border-radius:0 0 15px 15px;border-top:6px double #494949}
.cv08 .contact h2{color:#b7b7b7;font-size:34px;transform:none;text-shadow:2px 3px #111;margin-bottom:25px}
.cv08 .contact-mail{color:#d6f75c;border-bottom-color:#606a49;font-size:27px}.cv08 .contact-phone{font-size:18px}
.cv08 .contact-actions button,.cv08 .back-top{border-color:#777}.cv08 .font-credit{background:none;text-align:center;padding:17px 10px 30px}
.cv08 .reader{inset:var(--masthead-height) 0 0 var(--rail-width)}
.cv08 .reader-backdrop{animation:cv-reader-in 280ms var(--ease) both}
@keyframes cv-reader-in{from{opacity:0}to{opacity:1}}
.cv08 .toast{left:calc(50% + var(--rail-width)/2)}
@keyframes cv-power{0%,100%{opacity:.35;box-shadow:0 0 5px #c7fb65}50%{opacity:.85;box-shadow:0 0 13px #c7fb65}}
@keyframes cv-screen-on{from{filter:brightness(.65);opacity:.5}to{filter:brightness(1);opacity:1}}
@media(max-width:1100px){:root{--rail-width:90px;--page-gutter:12px;--masthead-height:64px}.cv-masthead img{height:44px}.cv-masthead .masthead-slot{height:44px;top:3px}.cv08 .rail{padding-left:12px;padding-right:5px}.cv08 .rail nav a{font-size:11px;padding-left:18px}.career-grid{gap:10px 4px}.cv08 .gallery .project-track{gap:30px 22px}.cv08 .collection,.cv08 .collection.personal{padding-top:30px}}
@media(max-width:760px){:root{--rail-width:62px;--page-gutter:4px;--masthead-height:48px}.cv-masthead{padding:0 3px}.cv-masthead img{height:31px}.cv-masthead .masthead-slot{height:30px;top:3px}.cv08 .rail{padding:0 3px 0 8px}.cv08 .rail nav a{min-height:60px;font-size:10px;padding-left:11px}.nav-track{top:30px}.cv08 .rail nav a:before{left:1px;width:4px;height:4px}.cv08 .intro{padding-top:10px}.cv08 .hero{height:auto;min-height:0;border:0;box-shadow:none;border-radius:0}.cv08 .cv-career{padding:5% 2% 14px;border-radius:15px 15px 0 0}.career-heading{gap:9px;margin-bottom:12px}.career-heading img{width:60%;max-width:280px}.career-heading:before,.career-heading:after{height:18px}.career-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 2px}.cv08 .collection,.cv08 .collection.personal{padding:26px 5% 35px}.cv08 .collection h2{font-size:23px}.cv08 .collection-heading{margin-bottom:25px;gap:12px}.cv08 .collection-heading:after{display:none}.cv08 .view-switch button{font-size:10px;padding:6px 8px}.cv08 .view-switch svg{display:none}.cv08 .gallery .project-track{grid-template-columns:repeat(2,minmax(0,1fr));gap:27px 19px}.cv08 .gallery .project-name{font-size:12px}.cv08 .gallery .project-type{font-size:10px}.cv08 .gallery .project-info{padding-top:9px}.cv08 .gallery .cover-name{font-size:20px!important}.cv08 .projects.list{padding:0}.cv08 .list .project{grid-template-columns:55px 1fr 15px;gap:10px}.cv08 .list .case-space{width:55px}.cv08 .list .project-name{font-size:14px}.cv08 .list .project-description{font-size:11px}.cv08 .contact{padding:26px 5% 30px}.cv08 .contact h2{font-size:26px}.cv08 .contact-mail{font-size:clamp(12px,3.3vw,20px);gap:8px}.cv08 .contact-phone{font-size:16px}.cv08 .back-top{display:none}.cv08 .font-credit{font-size:9px;padding-bottom:25px}.cv08 .reader-scroll{padding-inline:9px}.cv08 .reader-toolbar{padding:12px 9px}.cv08 .reader-toolbar button,.cv08 .reader-toolbar a{min-width:32px;height:32px}.cv08 .toast{bottom:20px}}
@media(max-width:440px){.career-grid{grid-template-columns:1fr}.cv08 .cv-career{padding-inline:4%}.cv-masthead .masthead-slot{height:24px;top:7px;left:56%}.cv08 .contact-actions{flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){.cv08 .hero:after,.cv08 .cv-hero-art{animation:none!important}.cv08 .cv-career-card:hover{transform:none!important}.nav-thumb,.nav-progress{transition:none}}

/* Refinement: 75% of the previous desktop canvas and a full-width bottom rail. */
:root{--rail-width:0px;--bottom-nav-height:70px}
body.cv08{padding:var(--masthead-height) 0 calc(var(--bottom-nav-height) + env(safe-area-inset-bottom))}
.cv08 main{width:calc((100% - 130px)*.75);margin:0 auto}
.cv08 .rail{inset:auto 0 0;width:100%;height:calc(var(--bottom-nav-height) + env(safe-area-inset-bottom));padding:0 20px env(safe-area-inset-bottom);display:flex;flex-direction:row;justify-content:center;align-items:center;background:#191919;border:8px solid transparent;border-image:url('assets/cv08/footer-frame.png') 10 8 8 8 fill / 4px 12px 8px 12px / 0 stretch;pointer-events:auto;z-index:65}
.cv08 .rail nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));width:min(900px,100%);height:100%;margin:0;padding:0;gap:0;--nav-position:0px;--nav-track-width:0px}
.cv08 .rail nav a{min-height:0;height:100%;padding:0 5px 9px;justify-content:center;align-items:center;font-size:14px;font-weight:600;color:#8f9196}
.cv08 .rail nav a:before{display:none}
.cv08 .rail nav a.active{color:#d6f75c}
.cv08 .rail nav a:hover{color:#e5e7eb}
.cv08 .rail nav a:focus-visible{outline:1px solid #d6f75c;outline-offset:-7px}
.nav-track{left:12.5%;top:auto;bottom:6px;width:var(--nav-track-width);height:1px;background:#70727655}
.nav-progress{width:var(--nav-position);height:1px;transition:width 300ms var(--ease);background:#d6f75c66}
.nav-thumb{top:-1px;left:-14px;width:28px;height:3px;transform:translateX(var(--nav-position));box-shadow:0 0 6px #d6f75c30}
.cv08 .reader{inset:var(--masthead-height) 0 calc(var(--bottom-nav-height) + env(safe-area-inset-bottom))}
.cv08 .toast{left:50%;bottom:calc(var(--bottom-nav-height) + 18px)}
.cv08 .skip{left:20px}

/* No button outline or press treatment on the embedded contact information. */
.cv08 .cv-phone-hotspot,.cv08 .cv-mail-hotspot{cursor:default;border:0;border-radius:0;background:transparent;outline:0;backdrop-filter:brightness(.9);-webkit-backdrop-filter:brightness(.9);mask-image:linear-gradient(90deg,transparent,#000 10% 90%,transparent),linear-gradient(0deg,transparent,#000 28% 72%,transparent);mask-composite:intersect;transition:backdrop-filter 220ms ease,-webkit-backdrop-filter 220ms ease}
.cv08 .cv-phone-hotspot:hover,.cv08 .cv-mail-hotspot:hover{background:transparent;outline:0;backdrop-filter:brightness(1.12);-webkit-backdrop-filter:brightness(1.12)}
.cv08 .cv-phone-hotspot{top:54%;height:7%}.cv08 .cv-mail-hotspot{top:61.5%;height:7%}
.cv08 .cv-phone-hotspot:focus-visible,.cv08 .cv-mail-hotspot:focus-visible{outline:1px dotted #72dff0;outline-offset:0}

/* Recolor only the original footer glyph masks, preserving the source type. */
.cv08 .cv-career-card,.cv08 .cv-career-card:hover{transform:none;filter:drop-shadow(0 3px 0 #111) drop-shadow(0 9px 7px #0009);transition:none;cursor:default}
.cv08 .cv-career-card:before{display:none}
.cv08 .cv-career-card .career-label{position:absolute;filter:brightness(0) invert(.2157);pointer-events:none}
.cv08 .cv-career-card:after{content:'';position:absolute;border-radius:4%;pointer-events:none;opacity:0;transition:opacity 150ms ease}
@media(max-width:1100px){.cv08 main{width:86%}.cv08 .rail{padding-inline:16px}}
@media(max-width:760px){:root{--bottom-nav-height:60px}.cv08 main{width:96%}.cv08 .rail{padding-inline:5px}.cv08 .rail nav a{font-size:12px}.cv08 .cv-career-card:after{background-size:100px 100px,100% 3px}}
@media(prefers-reduced-motion:reduce){.cv08 .cv-career-card:hover:after{animation:none;opacity:.055}}

/* CV title system and native-app view switches. */
.cv08 #experience{scroll-margin-top:calc(var(--masthead-height) + 24px)}
.cv08 .rail nav a{font-size:18px;font-weight:750;color:#e2e2e6;padding-bottom:10px;line-height:1.4}
.cv08 .rail nav a.active{color:#ddff69;text-shadow:0 0 12px #d6f75c26}
.cv08 .rail nav a:hover{color:#fff}
.cv08 .rail nav a.active:hover{color:#ebff9e}
.cv08 .collection-heading{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:22px;min-height:84px;flex-wrap:nowrap;margin-bottom:35px}
.cv08 .collection-heading:before,.cv08 .collection-heading:after{content:'';display:block;height:32px;background:repeating-linear-gradient(0deg,#424242 0 5px,transparent 5px 10px);order:0}
.cv08 .collection-heading:after{margin-right:132px}
.cv08 .collection-heading h2{margin:0;padding:0;line-height:0;font-size:inherit;background:none;box-shadow:none;text-shadow:none;transform:none;clip-path:none}
.cv08 .collection-title-art{display:block;height:auto;width:clamp(190px,17.3vw,290px)}
.cv08 .view-switch{position:absolute;right:0;top:50%;transform:translateY(-50%);padding:0;border:0;background:none;box-shadow:none;order:0}
.cv08 .view-switch .view-toggle{position:relative;display:block;width:112px;height:50px;padding:0;border:1px solid #b7b9ba;border-radius:999px;background:#c8caca;box-shadow:inset 0 2px 5px #0004,0 1px 0 #ffffff25;transition:background-color 220ms ease,border-color 220ms ease;overflow:hidden;color:#404345}
.cv08 .view-switch .view-toggle[aria-checked=true]{background:#31c75d;border-color:#4ce877;color:#103f1b}
.cv08 .view-switch .view-toggle:hover{filter:brightness(1.06)}
.cv08 .view-switch .view-toggle:focus-visible{outline:2px solid #ddff69;outline-offset:4px}
.toggle-label{position:absolute;top:0;height:100%;display:flex;align-items:center;font-size:14px;font-weight:750;transition:opacity 160ms ease;letter-spacing:.03em}
.label-gallery{left:15px;opacity:0}.label-list{right:15px;opacity:1}
.view-toggle[aria-checked=true] .label-gallery{opacity:1}.view-toggle[aria-checked=true] .label-list{opacity:0}
.toggle-knob{position:absolute;top:4px;left:4px;width:40px;height:40px;border-radius:50%;background:linear-gradient(145deg,#fff,#eceeed);border:1px solid #fff;box-shadow:0 2px 5px #0005,inset 0 -1px 2px #0001;transform:translateX(0);transition:transform 240ms cubic-bezier(.22,1,.36,1);display:grid;place-items:center;color:#555e58}
.view-toggle[aria-checked=true] .toggle-knob{transform:translateX(62px)}
.cv08 .view-switch .toggle-knob svg{position:absolute;display:block;width:17px;height:17px;transition:opacity 120ms ease}
.toggle-knob .toggle-grid{opacity:0}.toggle-knob .toggle-list{opacity:1}
.view-toggle[aria-checked=true] .toggle-grid{opacity:1}.view-toggle[aria-checked=true] .toggle-list{opacity:0}
.view-toggle.keyboard-change,.view-toggle.keyboard-change *{transition:none!important}
@media(max-width:1100px){.cv08 .collection-heading{gap:14px}.cv08 .collection-heading:after{margin-right:112px}.cv08 .view-switch .view-toggle{width:96px;height:44px}.toggle-knob{width:34px;height:34px}.view-toggle[aria-checked=true] .toggle-knob{transform:translateX(52px)}.toggle-label{font-size:12px}.label-gallery{left:12px}.label-list{right:12px}}
@media(max-width:760px){.cv08 .rail nav a{font-size:14px;padding-inline:2px}.cv08 .collection-heading{min-height:60px;gap:9px;margin-bottom:66px}.cv08 .collection-title-art{width:170px}.cv08 .collection-heading:before,.cv08 .collection-heading:after{height:18px;margin:0}.cv08 .view-switch{top:calc(100% + 4px);transform:none}.cv08 .collection-heading h2{font-size:inherit}}
@media(prefers-reduced-motion:reduce){.view-toggle,.view-toggle *{transition:none!important}}

/* Seamless diagonal tape lanes with independent ambient motion and scroll parallax. */
body.cv08:before{display:none}
.cv-backdrop{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:#354ff0}
.cv-backdrop-parallax{position:absolute;inset:-180px -70px;will-change:transform}
.cv-backdrop-drift{position:absolute;inset:-280px -240px;transform:rotate(-12deg);background:repeating-linear-gradient(125deg,#ffffff05 0 2px,transparent 2px 7px)}
.cv-tape-field{position:absolute;inset:-320px 0 auto;display:grid;gap:136px}
.cv-tape{height:72px;width:calc(100% + 960px);background:linear-gradient(#8ba1ff23,#8ba1ff23),url('assets/cv08/source-tape.png') 0 0/960px 72px repeat-x;background-blend-mode:normal;animation:cv-tape-flow 110s linear infinite;will-change:transform;opacity:.75}
.cv-tape:nth-child(even){animation-duration:145s;animation-direction:reverse;opacity:.75}
.cv-tape:nth-child(3n){animation-delay:-38s}
.cv-motif-field{position:absolute;inset:-320px -960px -400px 0;background:url('assets/cv08/source-motifs-dense.png') 0 0/960px 208px repeat;animation:cv-tape-flow 210s linear infinite;will-change:transform;opacity:1}
@keyframes cv-tape-flow{from{transform:translate3d(-960px,0,0)}to{transform:translate3d(0,0,0)}}

/* Four complete, equal lines. Do not clip the final repeat of a gradient. */
.career-heading:before,.career-heading:after,.cv08 .collection-heading:before,.cv08 .collection-heading:after{height:34px;background:linear-gradient(#424242,#424242) 0 0/100% 4px no-repeat,linear-gradient(#424242,#424242) 0 10px/100% 4px no-repeat,linear-gradient(#424242,#424242) 0 20px/100% 4px no-repeat,linear-gradient(#424242,#424242) 0 30px/100% 4px no-repeat}
.cv08 .collection-heading:after{margin-right:132px}
.cv08 .collection-heading{margin-bottom:38px}
.cv08 .view-switch{top:50%;transform:translateY(-50%)}

/* Same supplied grain, encoded for the web; retain a quiet graphite surface. */
.cv08 .cv-career,.cv08 .collection,.cv08 .collection.personal,.cv08 .contact{background-color:#191919;background-image:linear-gradient(90deg,rgba(29,29,29,.91),rgba(27,27,27,.91) 50%,rgba(29,29,29,.91)),url('assets/cv08/metal-dust.webp');background-size:100% 100%,1080px auto;background-repeat:no-repeat,repeat}
.cv08 .gallery .project-track{column-gap:24px;row-gap:42px;align-items:start}
.cv08 .gallery .project{width:80%;max-width:320px;justify-self:center}
.cv08 .gallery .project-info{padding-top:12px}
@media(max-width:1100px){.cv08 .gallery .project-track{column-gap:16px;row-gap:34px}}
@media(max-width:760px){
  .career-heading:before,.career-heading:after,.cv08 .collection-heading:before,.cv08 .collection-heading:after{height:23px;background-size:100% 2px;background-position:0 0,0 7px,0 14px,0 21px}
  .cv08 .collection-heading{margin-bottom:70px}
  .cv08 .gallery .project{width:92%}
  .cv08 .gallery .project-track{column-gap:16px;row-gap:28px}
}
/* Actual regenerated television static, clipped to the color screen only. */
.cv08 .cv-career-card .cv-screen-noise{position:absolute;left:5%;top:9%;width:90%;height:65%;border-radius:5%;pointer-events:none;mix-blend-mode:screen;opacity:calc(var(--noise-level,0)*.26);transition:none;image-rendering:pixelated}

.cv08 .cv-career-card:after{inset:9% 5% 26%;background:linear-gradient(0deg,transparent 25%,#ffffff14 45%,#0002 51%,transparent 65%);background-size:100% 220%;mix-blend-mode:screen}
.cv08 .cv-career-card.tv-active:after{opacity:calc(var(--noise-level,0)*.2);transition:none;animation:cv-scan-roll 1s linear}
@keyframes cv-scan-roll{from{background-position:0 180%}to{background-position:0 -80%}}
@media(prefers-reduced-motion:reduce){.cv-tape,.cv-motif-field,.cv08 .cv-career-card.tv-active:after{animation:none}.cv-backdrop-parallax,.cv-tape,.cv-motif-field{will-change:auto}}

/* The closing plate uses the same outlined type and four-line grille. */
.cv08 .ending{display:block;position:relative;padding:58px 4.1% 64px;border-top:1px solid #ffffff0e;box-shadow:inset 0 3px 0 #0e0e0e;text-align:center}
.ending-heading{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:24px}
.cv08 .ending h2{margin:0;line-height:0;text-shadow:none}
.ending-heading img{display:block;width:clamp(260px,25vw,420px);height:auto}
.ending-heading:before,.ending-heading:after{content:'';height:34px;background:linear-gradient(#424242,#424242) 0 0/100% 4px no-repeat,linear-gradient(#424242,#424242) 0 10px/100% 4px no-repeat,linear-gradient(#424242,#424242) 0 20px/100% 4px no-repeat,linear-gradient(#424242,#424242) 0 30px/100% 4px no-repeat}
.ending-caption{margin:12px 0 23px;color:#878787;font-size:11px;font-weight:700;letter-spacing:.32em;line-height:1.6}
.ending-indicator{width:46px;height:5px;border-radius:5px;margin:auto;background:#cce959;box-shadow:0 0 0 3px #111,0 0 12px #cce95929}
.cv08 .ending .back-top{position:absolute;right:4.1%;bottom:28px;width:38px;height:38px;border:1px solid #545454;color:#a8a8a8;background:#202020}
.cv08 .ending .back-top:hover{color:#dcff71;border-color:#899652}
/* Larger default reading surface; original-size zoom still remains available. */
.cv08 .reader-scroll{padding:78px 4.5% 70px}
.cv08 .reader-sheet{max-width:1920px}
.cv08 .reader-sheet.video-sheet{max-width:1600px}
.cv08 .reader-scroll:not(.zoomed) .reader-sheet{width:85%;max-width:1632px}
.cv08 .reader-scroll:not(.zoomed) .reader-sheet.video-sheet{max-width:1360px}
.cv08 .reader-scroll.zoomed{padding-left:30px;padding-right:30px}

/* Desktop finish: equal grille spans, one lime accent, source-led materials. */
@media(min-width:761px){
  .cv08 .collection-heading{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) 112px;gap:20px}
  .cv08 .collection-heading:before{grid-column:1;grid-row:1}
  .cv08 .collection-heading h2{grid-column:2;grid-row:1}
  .cv08 .collection-heading:after{grid-column:3;grid-row:1;margin:0}
  .cv08 .view-switch{position:static;grid-column:4;grid-row:1;transform:none;justify-self:end}
  .cv08 .toggle-knob{width:40px;height:40px;background:linear-gradient(145deg,#fff,#dce1d8);border-color:#f9fff0;color:#3e493d}
  .cv08 #personal-projects.gallery .project{width:92%;max-width:320px}
  .cv08 #personal-projects.gallery .project:last-child:nth-child(3n + 1){grid-column:2}
  .cv08 .personal .original-collection{display:flex;width:max-content;margin:38px auto 0}
  .cv08 .gallery .project-type{color:#b8b8b2;font-size:13px}
  .cv08 .font-credit{font-size:12px;color:#f0f3ff}
  .cv08 .projects.list .project-elements>span{color:#c6cdb7;background:#292d25;border-color:#535b47}
  .cv08 .projects.list .project-description{color:#c0c3bc;font-size:13px;line-height:1.8}
  .cv08 .projects.list .project:focus-visible{outline:2px solid #d6f75c;outline-offset:5px;border-radius:3px}
  .cv08 .reader-backdrop{background:#101413dd;backdrop-filter:blur(20px) saturate(.6)}
  .cv08 .reader-toolbar{padding:14px 24px;background:linear-gradient(#111816ed,#111816b8 70%,transparent)}
  .cv08 .reader-toolbar button,.cv08 .reader-toolbar a{height:42px;min-width:42px;border-radius:10px;border:1px solid #606760;background:linear-gradient(#343b35,#242a26);color:#edf1e6;box-shadow:inset 0 1px #ffffff17,0 3px 5px #0004}
  .cv08 .reader-toolbar button:hover,.cv08 .reader-toolbar a:hover{background:#d6f75c;border-color:#edff9a;color:#243019}
  .cv08 .reader-toolbar button:focus-visible,.cv08 .reader-toolbar a:focus-visible{outline:2px solid #d6f75c;outline-offset:4px}
  .cv08 .reader-toolbar button[aria-pressed=true]{color:#d6f75c;border-color:#a1b653}
  .cv08 .load-error{min-height:240px;display:flex;gap:18px;align-items:center;justify-content:center;color:#e1e7db;font-size:16px}
  .cv08 .reader-retry{padding:10px 18px;border:1px solid #d6f75c;border-radius:7px;background:#d6f75c;color:#26351a;font-weight:700}
}
@media(min-width:761px) and (max-width:1500px){.career-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 14px}.cv08 .collection-heading{gap:14px}.cv08 .collection-title-art{width:210px}}

/* Original PSD mascot: retain the native silhouette and crop at the display glass. */
.cv08 .portrait{right:6.7%;bottom:-1.7%;height:100.9%;width:49.8%;background:none;border:0;border-radius:0;box-shadow:none;cursor:default}
.cv08 .portrait:focus-visible{outline:2px solid #cffe64;outline-offset:-12px}
.cv08 .portrait canvas{opacity:0}
.cv08 .portrait.live2d-ready canvas{opacity:1}

/* One continuous metal sheet eliminates texture restarts and separator gaps. */
.cv-body-panel{--shoulder:clamp(54px,4.1vw,84px);position:relative;isolation:isolate;margin:-3.1% 2.87% 0 2.6%;border-radius:0 0 18px 18px}
.cv-body-panel:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit;background-color:#191919;background-image:linear-gradient(180deg,#080808d9 0,#11111180 calc(var(--shoulder)*.4),#3c3c3c30 calc(var(--shoulder)*.91),transparent calc(var(--shoulder) + 16px)),linear-gradient(90deg,#1d1d1de8,#1b1b1be8 50%,#1d1d1de8),url('assets/cv08/metal-dust.webp');background-size:100% 100%,100% 100%,1080px auto;background-repeat:no-repeat,no-repeat,repeat;mask-image:url('assets/cv08/panel-shoulder-mask.svg'),linear-gradient(#000,#000);mask-size:100% var(--shoulder),100% calc(100% - var(--shoulder) + 1px);mask-position:top,bottom;mask-repeat:no-repeat;box-shadow:inset 1px 0 #ffffff08,inset -1px 0 #0005}
.cv08 .cv-body-panel .cv-career,.cv08 .cv-body-panel .collection,.cv08 .cv-body-panel .contact{margin:0;border:0;background:none;box-shadow:none;clip-path:none}
.cv08 .cv-body-panel .cv-career{padding:calc(var(--shoulder) + 12px) 2.85% 25px}
.cv08 .cv-body-panel .cv-career:before{display:none}
.cv08 .cv-body-panel .collection{padding-inline:4.34%}
.cv08 .cv-body-panel .ending{padding-inline:4.34%;border:0;box-shadow:none}
.cv08 #experience{scroll-margin-top:calc(var(--masthead-height) + 10px)}
.cv08 .cv-career-card>img:not(.career-label){filter:grayscale(.86) brightness(.78);transition:filter 280ms ease-out}
.cv08 .cv-career-card:hover>img:not(.career-label){filter:grayscale(0) brightness(1)}
.cv08 .cv-career-card,.cv08 .cv-career-card:hover,.cv08 .cv-career-card:focus{border:0;outline:0;box-shadow:none}
@media(prefers-reduced-motion:reduce){.cv08 .cv-career-card>img:not(.career-label){transition:none}}

/* Keep the requested control treatment in desktop preview panes too. */
.cv08 .view-switch .view-toggle,.cv08 .view-switch .view-toggle[aria-checked=true]{width:112px;height:50px;background:linear-gradient(#444647,#303233);border-color:#696c6d;color:#c0c2c3;box-shadow:inset 0 2px 5px #0007,0 1px #ffffff16,0 3px 5px #0003}
.cv08 .view-switch .view-toggle:hover,.cv08 .view-switch .view-toggle:focus-visible{background:linear-gradient(#e0fa83,#c4e356);border-color:#e2f6a0;color:#29331c;filter:none}
.cv08 .toggle-label{font-size:18px;font-weight:850;color:inherit}.cv08 .label-gallery{left:14px}.cv08 .label-list{right:14px}
