.project-artwork{height:360px;position:relative;overflow:hidden;display:flex;justify-content:center;align-items:center;isolation:isolate}.project-card:first-child .project-artwork{height:480px}.artwork-atlas{background:var(--peach);color:var(--navy)}.artwork-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(45,50,80,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(45,50,80,.04) 1px,transparent 1px);background-size:48px 48px;z-index:-1}.artwork-word{position:absolute;left:10%;font-size:150px;font-weight:600;letter-spacing:-8px;line-height:1;top:37%;color:rgba(45,50,80,.88)}.travel-orbit{position:absolute;width:570px;height:570px;border:1px solid rgba(45,50,80,.12);border-radius:50%;right:-100px;top:-80px}.orbit-two{width:710px;height:710px;right:-170px;top:-150px}.phone{width:202px;height:398px;border-radius:32px;background:var(--navy);padding:8px;position:relative;box-shadow:18px 30px 45px rgba(45,50,80,.25);transform:rotate(9deg) translate(60px,22px);transition:transform 800ms var(--ease)}.project-image-link:hover .phone{transform:rotate(4deg) translate(60px,8px)}.phone-notch{position:absolute;width:70px;height:17px;background:var(--navy);border-radius:0 0 12px 12px;left:calc(50% - 35px);top:8px;z-index:1}.phone-ui{height:100%;border-radius:25px;background:var(--white);padding:25px 14px 15px;color:var(--navy)}.phone-top{display:flex;justify-content:space-between;font-weight:700;font-size:18px;letter-spacing:-1px;margin-bottom:25px}.phone-ui>small{font-size:5px;letter-spacing:1.5px;opacity:.65}.phone-ui h3{font-size:23px;letter-spacing:-1px;line-height:1.1;margin-top:5px;white-space:pre-line}.landscape{height:120px;margin-top:17px;background:var(--surface);position:relative;border-radius:9px;overflow:hidden}.sun{position:absolute;width:30px;height:30px;border-radius:50%;background:var(--peach);top:16px;left:30px}.mountain{position:absolute;width:180px;height:130px;transform:rotate(38deg);border-radius:20px}.mountain.far{background:var(--lavender);left:70px;top:70px}.mountain.near{background:var(--navy);top:78px;left:-50px}.landscape>span{position:absolute;bottom:10px;left:10px;font-size:6px;color:var(--white)}.phone-destinations{display:flex;justify-content:space-between;font-size:6px;margin-top:14px;padding-block:8px;border-bottom:1px solid rgba(45,50,80,.1)}.phone-destinations>span:first-child{font-weight:700}.destination{display:flex;align-items:center;gap:8px;margin-top:12px;font-size:9px}.destination-image{width:30px;height:32px;border-radius:5px;background:var(--lavender)}.destination strong{display:block;font-size:6px}.destination small{display:block;font-size:5px;opacity:.6}.destination>div{flex:1}.floating-label{position:absolute;right:8%;bottom:25%;background:var(--white);padding:12px 20px;border-radius:8px;font-size:9px;display:flex;gap:10px;align-items:center;transform:rotate(-4deg);box-shadow:0 10px 30px rgba(45,50,80,.12)}.floating-label .label-dot{background:var(--navy);width:5px;height:5px}.artwork-studio{background:var(--surface)}.mini-browser{width:82%;background:var(--navy);border:1px solid var(--line-strong);border-radius:9px;transform:rotate(-5deg) translateY(-7px);overflow:hidden;box-shadow:10px 28px 50px rgba(45,50,80,.4);transition:transform 800ms var(--ease)}.project-image-link:hover .mini-browser{transform:rotate(-2deg) translateY(-15px)}.browser-bar{display:flex;justify-content:space-between;align-items:center;padding:9px 12px;font-size:6px;color:var(--muted);border-bottom:1px solid var(--line)}.browser-dots{letter-spacing:3px;color:var(--peach)}.mini-dashboard{display:flex;min-height:185px}.mini-sidebar{width:50px;border-inline-end:1px solid var(--line);padding:12px 9px}.mini-sidebar>strong{font-size:22px;color:var(--peach);line-height:1;display:block;margin-bottom:22px}.mini-line{display:block;width:25px;height:4px;background:rgba(255,255,255,.13);margin-bottom:12px;border-radius:2px}.mini-line.active{background:var(--peach)}.mini-content{padding:18px;flex:1}.mini-content>small{font-size:5px;letter-spacing:1px;color:var(--muted)}.mini-content h3{font-size:15px;margin-top:4px}.mini-stats{display:flex;gap:9px;margin-top:15px}.mini-stats>div{flex:1;background:var(--surface-soft);border:1px solid var(--line);padding:7px;border-radius:4px;min-width:0}.mini-stats small{font-size:5px;display:block;color:var(--muted)}.stat-stroke{display:block;width:24px;height:7px;border-radius:2px;background:var(--peach);margin-top:7px}.mini-chart{display:flex;gap:7px;height:50px;align-items:flex-end;margin-top:18px;border-bottom:1px solid var(--line)}.mini-chart>span{width:100%;height:var(--bar);background:var(--lavender);border-radius:2px 2px 0 0}.mini-chart>span:nth-child(3n){background:var(--peach)}.mini-lines{display:flex;gap:9px;margin-top:12px}.mini-lines>span{height:3px;background:var(--line-strong);width:100%;border-radius:2px}.artwork-studio-word{position:absolute;bottom:23px;right:25px;font-size:14px;letter-spacing:-.4px;color:var(--muted)}.artwork-margin{background:rgba(104,111,158,.65)}.margin-word{position:absolute;left:7%;top:40%;font-size:44px;letter-spacing:-2px;line-height:1.1;white-space:pre-line;font-weight:500;z-index:-1}.reading-card{width:175px;background:var(--white);color:var(--navy);padding:20px;transform:rotate(10deg) translateX(70px);box-shadow:15px 25px 45px rgba(45,50,80,.3);transition:transform 800ms var(--ease)}.project-image-link:hover .reading-card{transform:rotate(5deg) translate(70px,-10px)}.reading-card>small{font-size:5px;letter-spacing:1px}.reading-art{height:100px;position:relative;overflow:hidden;margin-block:15px;background:var(--navy);display:flex;align-items:center;justify-content:center}.reading-art>span{height:70px;width:33px;border-radius:40px;background:var(--peach);transform:rotate(35deg);margin-left:-6px}.reading-art>span:nth-child(2){background:var(--lavender);margin-top:35px}.reading-art>span:nth-child(3){background:var(--surface);margin-top:-25px}.reading-card h3{font-size:23px;letter-spacing:-1px;white-space:pre-line}.reading-card p{font-size:6px;margin-top:12px;opacity:.7}.reading-rule{height:1px;background:rgba(45,50,80,.2);margin:18px 0 8px}

/* Interface illustrations keep their own fixed palette in either app theme. */
.artwork-studio{--text:#F4F6FC;--muted:rgba(255,255,255,.72);--line:rgba(255,255,255,.14);--line-strong:rgba(255,255,255,.27);--surface-soft:rgba(104,111,158,.16);color:var(--text)}
.artwork-margin{background:#515A80;color:#FFFFFF}