.main-folder{width:52%;margin-top:-30px}.main-folder img{height:340px;object-fit:contain}.cursor{bottom:13%}.poster strong{font-size:21px}.poster-two strong{font-size:23px;letter-spacing:-1px}.poster-index{letter-spacing:.4px}.project-one{right:14%}.identity{margin-top:0}.main-folder{z-index:1}.hero{z-index:0}.file{z-index:1}
@media(max-width:900px){.main-folder{width:58%;margin-top:-12px}.main-folder img{height:280px}.project-one{right:12%}.hero{top:270px}.resume,.project-two{top:630px}.project-three{top:855px}.notes{top:835px}.contact{top:880px}.desktop{height:1070px}}
@media(max-width:520px){.hero{top:273px}.main-folder{width:70%;margin-top:0}.main-folder img{height:230px}.identity{margin-top:4px}.resume,.project-two{top:650px}.project-one{right:10%}.project-three{top:875px}.notes{top:855px}.contact{top:1010px}.desktop{height:1125px}.poster strong{font-size:18px}.poster-two strong{font-size:20px}.poster-index{font-size:7px;letter-spacing:0}.cursor{bottom:6%}}
.note-paper{gap:6px}.note-paper small{margin-top:0;font-size:9px;line-height:1.3}.paper .note-heading{font-size:21px!important}
.navigation{max-width:none;width:100%;padding:22px clamp(24px,4vw,90px)}
body{min-height:100dvh;padding-bottom:62px}
footer{position:fixed;inset:auto 0 0;z-index:5;max-width:none;width:100%;min-height:54px;padding:18px clamp(24px,4vw,90px);background:var(--cream);align-items:center}
@media(min-width:901px){
 .desktop{width:1380px;max-width:none;height:850px;zoom:var(--desktop-scale,1)}
 .hero{top:145px}.hero h1{font-size:190px}.script{font-size:134px}
 .project-three,.notes{top:645px}.contact{top:677px}
}
@media(pointer:fine){html,body,body *,dialog::backdrop{cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='40' viewBox='0 0 64 80'%3E%3Cpath d='M5 4L57 40 34 44 47 67 35 74 23 51 7 67Z' fill='%23fffdf7' stroke='%23321e19' stroke-width='4'/%3E%3C/svg%3E") 3 2,default}}
@media(max-width:520px){footer{min-height:48px;padding:14px 18px}footer span:nth-child(2){font-size:10px}.navigation{padding:18px 21px}}
.project-folders{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.project-folder.work-link{display:flex;flex-direction:column;gap:8px;border:0;background:none;text-align:center;padding:12px 4px}.project-folder img{width:100%;max-width:150px}.project-folder small{font-size:12px;color:var(--muted)}.project-folder:hover{background:#e5eadb;border-radius:8px}.back-to-works{font-size:14px;padding:8px 0;margin-bottom:18px;color:#506a40;text-decoration:underline;text-underline-offset:5px}.experience-list{padding-left:22px;color:#726958;font-size:16px}.experience-list li{margin:10px 0}.window-content h3{font-weight:500;margin:28px 0 8px}@media(max-width:520px){.project-folders{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* The identity card is an information surface; other file windows keep their layout. */
dialog.about-window{width:min(860px,calc(100vw - 32px));background:#e8eddf;border-color:#cad4bf}
.about-window .window-bar{background:#e5e9dd}
.about-window .window-content{padding:0}
.badge-stage{padding:76px 42px 60px;background:radial-gradient(ellipse at 12% 15%,#fffffff2,transparent 55%),radial-gradient(ellipse at 95% 85%,#c1cfb4,transparent 65%),#e8eddf}
.identity-badge{position:relative;display:grid;grid-template-columns:.8fr 1.2fr;gap:32px;padding:38px 34px 28px;border:2px solid #fffffff0;border-radius:28px;background:linear-gradient(125deg,#ffffff80,#ffffff35);box-shadow:0 20px 32px #40553520,inset 0 0 0 1px #cbd7bf80;backdrop-filter:blur(10px)}
.badge-slot{position:absolute;top:12px;left:calc(50% - 28px);width:56px;height:7px;border-radius:8px;background:#78906a50;box-shadow:inset 0 2px 3px #35412d25}
.badge-monogram{border-radius:14px;display:flex;flex-direction:column;justify-content:center;padding:24px 16px;color:#586d49;border:1px solid #a6b99455;background:#dce6d24d}
.badge-monogram>span{font-size:12px;letter-spacing:2px}.badge-monogram b{font:italic 86px/.88 Georgia,serif;letter-spacing:-8px;margin:28px 0}.badge-monogram small{font-size:13px;letter-spacing:2px}
.badge-information .badge-kicker{font-size:12px;letter-spacing:2px;margin:0 0 10px;color:#596b4b}.badge-information h2{font-size:36px;margin:0 0 16px}.badge-label{display:inline-block;background:#c3d894;border-radius:50%;padding:10px 20px;font-size:14px;transform:rotate(-3deg);color:#354629}
.badge-details{margin:26px 0 20px}.badge-details>div{display:grid;grid-template-columns:70px 1fr;gap:12px;margin:12px 0;font-size:14px;line-height:1.6}.badge-details dt{color:#6b7562}.badge-details dd{margin:0;color:#2f3c28;overflow-wrap:anywhere}
.badge-bars{height:30px;opacity:.7;background:repeating-linear-gradient(90deg,#31412a 0 2px,transparent 2px 4px,#31412a 4px 5px,transparent 5px 9px,#31412a 9px 13px,transparent 13px 15px,#31412a 15px 16px,transparent 16px 21px);max-width:240px}
.badge-information .badge-signature{font-size:10px;letter-spacing:3px;margin:7px 0 0;color:#627455}
@media(max-width:600px){.badge-stage{padding:42px 18px 28px}.identity-badge{grid-template-columns:1fr;gap:24px;padding:34px 24px 24px;border-radius:22px}.badge-monogram{padding:16px;display:grid;grid-template-columns:1fr auto;align-items:center}.badge-monogram b{font-size:52px;letter-spacing:-4px;margin:0;grid-column:2;grid-row:1/3}.badge-monogram b br{display:none}.badge-monogram small{font-size:12px}.badge-information h2{font-size:30px}.badge-details>div{grid-template-columns:64px 1fr;gap:8px}}
dialog.about-window{background:transparent;border:0;box-shadow:none;border-radius:0;width:min(860px,calc(100vw - 24px));max-height:95dvh;overflow:auto}
.about-window .window-bar{display:none}.about-window .window-content{padding:0}.about-window::backdrop{background:#28332135;backdrop-filter:blur(6px)}
.about-window .badge-stage{background:none;padding:76px 24px 38px}
.about-window .identity-badge{grid-template-columns:1fr 1.1fr;gap:28px;align-items:center;padding:32px 36px 0 20px;background:linear-gradient(125deg,#ffffff9c 0%,#ffffff38 38%,#dcead12e 70%,#ffffff80 100%);border:1px solid #ffffffe6;border-radius:30px;backdrop-filter:blur(24px) saturate(1.6);box-shadow:inset 2px 2px 3px #fff,inset -2px -2px 5px #ffffffb0,0 22px 34px #23351c30}
.badge-portrait{align-self:end;line-height:0;border:0;background:none}.badge-portrait img{width:100%;height:380px;object-fit:contain;object-position:center bottom;filter:grayscale(1);border:0;border-radius:0 0 0 25px}
.about-window .badge-information{padding:10px 0 28px}.badge-clip{position:absolute;left:calc(50% - 30px);top:-65px;font-family:'Segoe UI Emoji',sans-serif;font-size:64px;line-height:1.3;filter:grayscale(1) drop-shadow(2px 4px 2px #0003);transform:rotate(-12deg)}
.badge-close{position:absolute;right:14px;top:12px;width:30px;height:30px;padding:0;font-size:25px;color:#4c5945;border-radius:50%;z-index:2}.badge-close:hover{background:#ffffff70}.badge-details a{color:inherit;text-decoration:none}.badge-details a:hover{text-decoration:underline}
@media(max-width:600px){.about-window .badge-stage{padding:66px 10px 24px}.about-window .identity-badge{grid-template-columns:1fr;gap:12px;padding:28px 24px 20px}.badge-portrait{order:2;max-width:220px;justify-self:center}.badge-portrait img{height:230px;border-radius:0}.about-window .badge-information{padding:8px 0}.badge-clip{font-size:52px;top:-53px;left:calc(50% - 26px)}}
.badge-portrait img{filter:none}
.about-window .badge-close{left:14px;right:auto;top:12px;display:grid;place-items:center;width:30px;height:30px;padding:0;line-height:1;font-size:0;background:#ffffff65}
.about-window .badge-close::before,.about-window .badge-close::after{content:"";position:absolute;width:12px;height:1.5px;border-radius:2px;background:currentColor;transform:rotate(45deg)}
.about-window .badge-close::after{transform:rotate(-45deg)}
.about-window .badge-portrait{align-self:center;display:flex;align-items:center;justify-content:center}
.about-window .badge-portrait img{object-position:center;border-radius:0}
@media(min-width:601px){.about-window .identity-badge{padding-top:32px;padding-bottom:32px}.about-window .badge-information{padding-top:0;padding-bottom:0}}
/* Shared glass material for all file windows; About retains its standalone badge. */
:root{--window-glass:linear-gradient(125deg,#ffffffb3 0%,#ffffff70 38%,#e0ebd959 72%,#ffffffa6 100%);--window-glass-shadow:inset 2px 2px 3px #fffffff0,inset -2px -2px 5px #ffffffb0,0 22px 45px #23351c30}
dialog:not(.about-window){background:var(--window-glass);border:1px solid #ffffffe6;border-radius:24px;box-shadow:var(--window-glass-shadow);backdrop-filter:blur(24px) saturate(1.6);-webkit-backdrop-filter:blur(24px) saturate(1.6)}
dialog::backdrop{background:#28332135;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
dialog:not(.about-window) .window-bar{background:linear-gradient(110deg,#ffffff80,#edf3e666);border-bottom:1px solid #ffffff90;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
dialog:not(.about-window) .window-content{background:transparent}
dialog:not(.about-window) .window-content p,dialog:not(.about-window) .experience-list{color:#4b5344}
dialog:not(.about-window) .detail-labels{color:#58614f}
dialog:not(.about-window) .placeholder{background:#ffffff38;border-color:#899a7580}
dialog:not(.about-window) .project-cover{background:linear-gradient(120deg,#d4e0c780,#ffffff55)}
dialog:not(.about-window) .project-folder:hover{background:#ffffff50}
:root{--close-button-background:#d2d1d0}
#close-window,.about-window .badge-close,.about-window .badge-close:hover{background:var(--close-button-background);color:#3d3d3b}
:root{--body-text-size:1rem;--body-text-color:#2b3125}
#window .window-content p:not(.eyebrow):not(.badge-kicker):not(.badge-signature),
#window .window-content .detail-labels,
#window .window-content .experience-list,
#window .window-content .badge-details,
#window .window-content .badge-details>div,
#window .window-content .badge-details dt,
#window .window-content .badge-details dd,
#window .window-content .badge-label,
#window .window-content .project-folder span,
#window .window-content .project-folder small,
#window .window-content .back-to-works{font-size:var(--body-text-size);color:var(--body-text-color)}
#window .window-content .detail-labels span,#window .window-content .experience-list li{font-size:inherit;color:inherit}
@media(min-width:901px){
 dialog.about-window{width:min(1060px,calc(100vw - 48px))}
 .about-window .identity-badge{gap:40px;padding:40px 48px 40px 28px}
 .about-window .badge-portrait img{height:460px}
 .about-window .badge-information h2{font-size:42px}
}
.desktop .resume{left:auto;right:4%;top:405px;transform:rotate(4deg)}
.desktop .project-two{left:5%;right:auto;top:415px;transform:rotate(-5deg)}
.desktop .contact{left:auto;right:26%;top:645px}
@media(max-width:900px){.desktop .resume{right:3%;top:630px}.desktop .project-two{left:3%;top:630px}.desktop .contact{right:37%;top:835px}}
@media(max-width:520px){.desktop .resume{right:10%;top:650px}.desktop .project-two{left:7%;top:650px}.desktop .contact{right:11%;top:855px}.desktop{height:1030px}}
.desktop .resume:hover,.desktop .project-two:hover{transform:translateY(-7px) rotate(-2deg)}
.main-folder .filename{display:block;width:60px;max-width:100%;margin:-32px auto 33px;padding:5px 0;font-style:normal;font-weight:600;text-align:center;position:relative}
dialog.resume-window{width:min(1080px,calc(100vw - 32px));height:90dvh;max-height:90dvh}
.resume-window .window-content{padding:20px;height:calc(100% - 50px);display:flex;flex-direction:column;gap:16px}
.resume-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.resume-toolbar h2{margin:0;font-size:24px}.resume-actions{display:flex;align-items:center;gap:20px;font-size:16px}
.resume-actions .resume-download{background:#d2d1d0;color:#2b3125;border-radius:8px;padding:10px 16px;text-decoration:none}
.resume-viewer{display:block;width:100%;flex:1;min-height:250px;border:0;border-radius:8px;background:#ffffff80}
@media(max-width:600px){.resume-window .window-content{padding:14px}.resume-toolbar h2{font-size:20px}.resume-actions{gap:14px}}
.project-folders .project-folder span{max-width:100%;overflow-wrap:anywhere}
.project-folders .project-folder small:empty{display:none}
.contact-details{margin:24px 0 0;font-size:var(--body-text-size);color:var(--body-text-color);line-height:1.8}
.contact-details>div{display:grid;grid-template-columns:85px minmax(0,1fr);gap:12px;padding:10px 0}
.contact-details dt,.contact-details dd{margin:0}
.contact-details dd{display:flex;align-items:center;justify-content:space-between;gap:16px;min-width:0}
.contact-details dd span{overflow-wrap:anywhere;user-select:text}
.contact-copy{flex-shrink:0;padding:5px 12px;border:1px solid #ffffff90;border-radius:8px;background:#ffffff50;color:inherit;font:inherit;font-size:14px}
.contact-copy:hover{background:#ffffff90}
.contact-copy:focus-visible{outline:2px solid #738965;outline-offset:3px}
.copy-status{min-height:1.8em;margin:10px 0 0}
.contact-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.contact-heading h2{margin:0}
.project-experience-item{padding:24px 0;border-bottom:1px solid #ffffff80}
.project-experience-item:first-child{padding-top:0}
.project-experience-item:last-child{padding-bottom:0;border-bottom:0}
.project-experience-item h3{margin:0 0 12px;font-size:20px;line-height:1.5}
.project-experience-item .detail-labels{margin:0 0 12px;flex-wrap:wrap}
.project-experience-item p{margin:0;line-height:1.85}
.phone-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;margin-top:24px}
.phone-preview{min-width:0;text-align:center}
.phone-device{display:block;position:relative;width:100%;max-width:230px;margin:0 auto;padding:7px;border:2px solid #93958e;border-radius:36px;background:#161714;box-shadow:inset 0 0 0 2px #42443d,0 14px 24px #26301f25;text-decoration:none;color:inherit;transition:transform .2s}
a.phone-device:hover{transform:translateY(-4px)}
.phone-device::after{content:'';position:absolute;top:16px;left:50%;transform:translateX(-50%);width:32%;height:18px;background:#090a08;border-radius:20px;pointer-events:none}
.phone-screen{display:block;aspect-ratio:9/19.5;overflow:hidden;border-radius:27px;background:linear-gradient(145deg,#e9ede3,#bdcab1)}
.phone-screen img{display:block;width:100%;height:100%;object-fit:cover}
.phone-empty{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:#536348;font-size:20px}
.phone-empty small{font-size:14px;font-weight:400}
.phone-caption{margin:18px 0 0}
@media(max-width:520px){.phone-gallery{gap:16px}.phone-device{padding:5px;border-radius:24px}.phone-screen{border-radius:17px}.phone-device::after{top:12px;height:12px}.phone-empty{font-size:16px}.phone-empty small{font-size:12px}}
@media(max-width:520px){.contact-details>div{grid-template-columns:72px minmax(0,1fr);gap:6px}.contact-details dd{gap:8px;flex-wrap:wrap}}

/* The title shares the desktop stacking context, above personal and file icons. */
.desktop .hero{z-index:auto}
.hero h1.interactive-title{display:flex;align-items:baseline;justify-content:center;pointer-events:auto;isolation:isolate;z-index:10}
.title-slot{display:inline-block;position:relative;flex:0 0 auto;padding:0;--art-width:1.12em;--art-height:1.12em;--art-top:55%;--art-tilt:-1deg;--float-distance:-.008em;--float-time:3.2s}
.title-letter{display:block;position:relative;font:inherit;letter-spacing:inherit;line-height:inherit;color:inherit;border:0;padding:0;background:none;overflow:visible;touch-action:manipulation}
.title-letter:active{transform:none}
.title-glyph{display:block;line-height:1.15;transition:opacity .2s ease,transform .38s cubic-bezier(.2,.8,.25,1);transform-origin:50% 65%}
.title-artwork{position:absolute;left:50%;top:var(--art-top);width:var(--art-width);height:var(--art-height);opacity:0;pointer-events:none;transform:translate(-50%,-50%) rotate(var(--art-tilt)) scale(.92);transition:opacity .2s ease,transform .36s cubic-bezier(.16,1,.3,1);transform-origin:center}
.title-artwork img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 .018em .016em #321e191a)}
.title-slot.is-active{z-index:4}
/* Move the visible glyphs only; stable buttons prevent hover flicker. */
.title-slot.is-before-active .title-glyph{transform:translateX(-.08em)}
.title-slot.is-after-active .title-glyph{transform:translateX(.08em)}
.title-slot.is-active .title-glyph{opacity:0;transform:none}
.title-slot.is-active .title-artwork{opacity:1;transform:translate(-50%,calc(-50% - .01em)) rotate(calc(var(--art-tilt) * 5)) scale(1);animation:illustration-pop .38s cubic-bezier(.16,1,.3,1) both}
.title-slot.is-active .title-artwork img{animation:none}
.title-slot[data-letter="p"]{--art-height:1.34em;--art-width:1.18em;--art-top:70%;--art-tilt:-1deg}
.title-slot[data-letter="o-one"]{--art-width:.78em;--art-height:.78em;--art-top:57%;--art-tilt:1deg;--float-time:3.2s}
.title-slot[data-letter="r"]{--art-width:.94em;--art-height:1.04em;--art-tilt:-1deg;--float-time:3.6s}
.title-slot[data-letter="t"]{--art-width:1.13em;--art-height:1.27em;--art-top:50%;--art-tilt:1deg}
.title-slot[data-letter="f"]{--art-width:1.13em;--art-height:1.3em;--art-top:50%;--art-tilt:-1deg;--float-time:3.8s}
.title-slot[data-letter="o-two"]{--art-width:.8em;--art-height:.8em;--art-top:57%;--art-tilt:1deg;--float-time:3.5s}
.title-slot[data-letter="l"]{--art-width:1.13em;--art-height:1.3em;--art-top:50%;--art-tilt:-1deg}
.title-slot[data-letter="i"]{--art-width:1.09em;--art-height:1.27em;--art-top:50%;--art-tilt:1deg;--float-time:4s}
.title-slot[data-letter="o-three"]{--art-width:.8em;--art-height:.8em;--art-top:57%;--art-tilt:-1deg;--float-time:3.4s}
.title-letter:focus-visible{outline:2px solid #758b62;outline-offset:4px;border-radius:8px}
/* One directional pop, then hold the final tilted pose until pointer leave. */
@keyframes illustration-pop{
  from{transform:translate(-50%,-50%) rotate(0deg) scale(.92)}
  to{transform:translate(-50%,calc(-50% - .01em)) rotate(calc(var(--art-tilt) * 5)) scale(1)}
}
@media(prefers-reduced-motion:reduce){.title-glyph,.title-artwork{transition:none}.title-slot.is-active .title-artwork,.title-slot.is-active .title-artwork img{animation:none}.title-slot.is-before-active .title-glyph,.title-slot.is-after-active .title-glyph{transform:none}}
/* Reference phone frame: mask removes the baked checkerboard around and inside it. */
.phone-device{padding:0;border:0;border-radius:0;background:none;box-shadow:none;aspect-ratio:728/1098;max-width:280px}
.phone-device::after{display:none}
.phone-frame-art{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none;mask:url("assets/phone-mask.svg") center/100% 100%;-webkit-mask:url("assets/phone-mask.svg") center/100% 100%}
.phone-device .phone-screen{position:absolute;left:18.5%;top:2.7%;width:63.6%;height:91.2%;aspect-ratio:auto;border-radius:12% / 6%;overflow:hidden}
.phone-device .phone-screen img{object-fit:cover}
.phone-gallery{gap:20px}

/* Quiet editorial framing: grouped navigation and a two-line identity. */
.navigation { align-items:center; gap:24px; padding-block:24px; }
.navigation-links { display:flex; align-items:center; gap:32px; }
.navigation .identity { display:flex; flex-direction:column; gap:5px; margin:0 0 0 auto; text-align:right; font-style:normal; line-height:1.4; flex-shrink:0; }
.navigation .identity-name { font-size:22px; letter-spacing:.08em; }
.navigation .identity-role { font-size:14px; color:#726b60; letter-spacing:.02em; }
.hero .hint { margin-top:14px; }
footer.portfolio-footer { border-top:0; font-size:11px; letter-spacing:.02em; gap:24px; color:#80796e; }
.portfolio-footer .footer-signature { display:flex; align-items:center; gap:8px; text-align:right; }
@media(max-width:900px) { footer.portfolio-footer span:last-child { display:inline; } .portfolio-footer .footer-signature { display:flex; } }
@media(max-width:520px) {
 .navigation { padding:18px 20px; gap:12px; align-items:flex-start; }
 .navigation-links { gap:16px; }
 .navigation-links button { font-size:12px; white-space:nowrap; }
 .navigation-links button span { margin-left:2px; }
 .navigation .identity-name { font-size:15px; }
 .navigation .identity-role { font-size:10px; }
 footer.portfolio-footer { padding:12px 18px; gap:4px; flex-direction:column; align-items:flex-start; font-size:10px; }
 .portfolio-footer .footer-signature { text-align:left; gap:6px; }
}
/* Real playable snapshots tucked between the existing folder layers. */
.main-folder .portfolio-folder-art { display:block; position:relative; width:min(100%,340px); height:340px; margin:auto; isolation:isolate; pointer-events:none; }
.main-folder .portfolio-folder-art > img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; }
.main-folder .folder-back { z-index:0; }
.main-folder .folder-front { z-index:2; clip-path:inset(25.3% 0 0); }
.portfolio-peeks { position:absolute; inset:0; z-index:1; }
.peek-card { position:absolute; left:var(--card-x); top:36%; width:25%; height:40%; padding:4px; border-radius:4px; background:#fffefa; box-shadow:0 2px 5px #321e1926; opacity:0; transform:translateY(0) rotate(0deg) scale(.94); transform-origin:50% 90%; transition:transform 340ms cubic-bezier(.2,.85,.25,1),opacity 180ms ease; }
.main-folder .peek-card img { display:block; width:100%; height:100%; object-fit:cover; object-position:center top; border-radius:1px; }
.peek-card:nth-child(1) { --card-x:9%; --card-y:-56%; --card-angle:-15deg; z-index:1; }
.peek-card:nth-child(2) { --card-x:23%; --card-y:-68%; --card-angle:-7deg; z-index:2; }
.peek-card:nth-child(3) { --card-x:39%; --card-y:-75%; --card-angle:3deg; z-index:4; }
.peek-card:nth-child(4) { --card-x:54%; --card-y:-65%; --card-angle:10deg; z-index:3; }
.peek-card:nth-child(5) { --card-x:67%; --card-y:-52%; --card-angle:17deg; z-index:5; }
@media(hover:hover) and (pointer:fine) {
 .main-folder:hover .peek-card { opacity:1; transform:translateY(var(--card-y)) rotate(var(--card-angle)) scale(1); }
}
.main-folder:focus-visible .peek-card { opacity:1; transform:translateY(var(--card-y)) rotate(var(--card-angle)) scale(1); }
@media(max-width:900px) { .main-folder .portfolio-folder-art { width:min(100%,280px); height:280px; } }
@media(max-width:520px) { .main-folder .portfolio-folder-art { width:min(100%,230px); height:230px; } .peek-card { padding:3px; } }
@media(prefers-reduced-motion:reduce) { .peek-card { transition:none; } }