#desktop{background:#e5d2a2 url('assets/butter-wallpaper.jpg') center/cover no-repeat}
#desktop:before{background:linear-gradient(90deg,#4b331b12,transparent 40%);opacity:1}
.wallpaper{display:none}
.icons{width:130px;left:18px;gap:20px;grid-template-columns:1fr 1fr;top:65px}
.icons button{width:62px;padding:2px;gap:7px}
.icons .icon{width:51px;height:51px;filter:drop-shadow(2px 3px 0 #63421c44)}
.icons img{width:100%;height:100%;image-rendering:pixelated}
.icons b{font:9px/1.25 'Courier New',monospace;color:#39291a;text-shadow:none;background:#fff4d9c9;padding:3px 4px}
.icons button:hover .icon{transform:translateY(-3px)}
.icons button:focus-visible{outline:1px dashed #39291a;outline-offset:3px}
.bath-window{left:17%;width:38%;top:8vh}
.welcome-window{right:5%;width:33%;top:11vh}
.welcome-body{padding:24px 26px 14px}
.welcome-body h2{font-size:clamp(38px,4.1vw,60px)}
.video-wrap{height:53vh}
#note{display:none}
.photo-notes{position:absolute;right:7%;top:69vh;display:flex;gap:20px;z-index:4}
.photo-note{border:0;background:#fbefd2;padding:8px 8px 12px;width:130px;box-shadow:2px 5px 10px #57371130;position:relative;transform:rotate(-5deg)}
.photo-note:before{content:'';position:absolute;width:48px;height:17px;background:#f8dd9eaa;left:calc(50% - 24px);top:-8px;transform:rotate(7deg)}
.photo-note img{width:100%;height:84px;object-fit:cover;display:block}
.photo-note span{display:block;font:italic 13px/1.15 Georgia,serif;margin-top:8px;text-align:left}
.ski-note{transform:rotate(5deg);margin-top:10px}
.ski-note img{object-position:center 40%}
.photo-note:hover{transform:rotate(0) translateY(-4px)}
.ski-window{width:min(420px,80vw);left:calc(50% - 210px);top:7vh}
.ski-window video{display:block;width:100%;height:70vh;object-fit:contain;background:#362614}
.gallery-window{width:min(640px,85vw);left:calc(50% - 320px);top:12vh}
.gallery-stage{background:#dbc9a0;padding:12px;height:55vh}
.gallery-stage img{width:100%;height:100%;object-fit:contain;display:block}
.gallery-controls{display:flex;align-items:center;gap:12px;padding:8px;font:10px 'Courier New',monospace}
.gallery-controls p{font:10px/1.4 'Courier New',monospace;flex:1;text-align:center;margin:0}
.gallery-controls button{border:2px outset #fff5db;background:#e8d5a6;min-width:38px;min-height:36px}
@media(pointer:fine){body,button,a,.titlebar,.photo-note{cursor:url('assets/butter-cursor.svg') 3 3,auto}}
@media(max-width:700px){
 #desktop{background-position:center}
 #desktop:after{min-height:1100px}
 .icons{left:10px;right:10px;top:48px;width:auto;display:grid;grid-template-columns:repeat(4,1fr);gap:9px 2px;justify-items:center}
 .icons button{width:70px;gap:3px}
 .icons .icon{width:39px;height:39px}
 .icons b{font-size:8px;max-width:76px}
 .bath-window{top:213px;left:5%;width:83%}
 .video-wrap{height:29svh;min-height:190px}
 .welcome-window{top:calc(213px + max(23svh,150px));right:4%;width:78%}
 .welcome-body{padding:20px 22px 12px}
 .welcome-body h2{font-size:42px}
 .photo-notes{top:calc(213px + max(23svh,150px) + 340px);right:auto;left:12%;gap:25px;padding-bottom:75px}
 .photo-note{width:115px}
 .photo-note img{height:78px}
 .popup.ski-window,.popup.gallery-window{width:90%;left:5%;top:80px;max-height:calc(100svh - 140px)}
 .ski-window video{height:65svh}
 .gallery-stage{height:50svh}
}
@media(prefers-reduced-motion:reduce){.icons button:hover .icon,.photo-note:hover{transform:none}}
.photo-notes{right:5%;gap:12px;top:auto;bottom:58px}
.photo-note,.ski-note{width:180px;padding:3px;border:1px solid #32251b;border-radius:0;background:var(--cream);box-shadow:inset 1px 1px #fff8e9,inset -1px -1px #a9997e,4px 5px 0 #3b251b33;transform:none;margin:0;text-align:left}
.photo-note:before{display:none}
.photo-note img{height:83px;object-fit:cover;border:1px inset #dac9a4;margin-top:3px}
.photo-note span{font:10px/1.4 'Courier New',monospace;font-style:normal;margin:0}
.photo-note .preview-title{display:flex;align-items:center;justify-content:space-between;background:#735036;color:#fff3d5;height:25px;padding:3px 5px;font-size:9px;white-space:nowrap}
.photo-note .preview-title span{font-size:13px;line-height:16px}
.photo-note .preview-caption{display:block;padding:7px 8px;color:var(--ink)}
.photo-note .preview-status{display:block;border:1px inset #dfd1b4;padding:4px 5px;font-size:8px;color:var(--ink)}
.photo-note:hover{transform:none;filter:brightness(1.025);box-shadow:inset 1px 1px #fff8e9,inset -1px -1px #a9997e,5px 6px 0 #3b251b44}
@media(max-width:700px){.photo-notes{left:5%;right:5%;bottom:auto;top:calc(213px + max(23svh,150px) + 340px);gap:10px}.photo-note{width:calc(50% - 5px)}.photo-note .preview-title{font-size:8px}.photo-note img{height:85px}.photo-note .preview-caption{font-size:9px}.photo-note .preview-status{font-size:7px}}