@media(min-width:1600px){#site{padding-top:10px}.layout{grid-template-columns:290px minmax(0,1fr);gap:40px}.project-description{font-size:12px}}
@media(max-width:1150px){#site{padding-left:22px;padding-right:22px}.layout{grid-template-columns:260px minmax(0,1fr);gap:26px}.turntable{transform:scale(.9);transform-origin:center;margin-left:2px;margin-right:2px;margin-bottom:0}.music-body{padding-left:13px;padding-right:13px}.transport{gap:3px}.volume-control .range{width:44px}.project-body{padding:14px}.project-description{font-size:10px;min-height:77px}.project-body h3{font-size:26px}.gallery-grid{gap:11px}.story-links{gap:11px;font-size:9px}}
@media(max-width:900px){.layout{grid-template-columns:235px minmax(0,1fr);gap:22px}.turntable{transform:scale(.82);transform-origin:top left;margin-left:12px;margin-right:0;width:220px;height:160px}.music-body{padding-left:11px;padding-right:11px}.volume-control{margin-left:2px}.volume-control .range{width:35px}.transport{gap:2px}.transport .icon-button{width:25px}.play-button{width:31px;height:31px}.project-grid{gap:14px}.project-description{min-height:95px;font-size:10px}.project-type{font-size:7px}.tags{gap:4px}.tags span{font-size:7px;padding:2px 4px}.gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.gallery-heading{align-items:flex-start;flex-direction:column;gap:0}.gallery-heading .section-title{margin-bottom:12px}.story-links{padding-bottom:18px}.section-title{font-size:32px}}
@media(max-width:700px){#site{padding:0 16px 42px}.topbar{height:64px}.topbar nav{gap:15px;font-size:10px}.language-switch{margin-left:0;gap:5px}.language-switch button{font-size:10px}.masthead{padding:26px 0 30px}.masthead h1{font-size:103px}.layout{display:flex;flex-direction:column;gap:33px}.sidebar{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);width:100%;gap:16px;align-items:start}.profile{grid-column:1/-1;display:grid;grid-template-columns:142px minmax(0,1fr);gap:20px;padding:14px}.profile-photo{width:142px}.profile-body{padding:2px 2px 0 0}.profile-handle{font-size:10px;gap:3px}#profile-location{margin:4px 0 10px;font-size:9px}#profile-bio{font-size:11px;line-height:1.8;margin-bottom:0}.music{width:100%}.turntable{transform:scale(.88);width:254px;height:174px;margin-left:12px}.music-body{padding:0 14px 14px}.transport{gap:4px}.volume-control{margin-left:auto}.volume-control .range{width:43px}.social-main{padding:14px 0;gap:10px}.social-row{padding:0 10px}.social-copy strong{font-size:10px}.social-copy small{font-size:8px}.social-main>.brand-icon{width:18px;height:18px}.copy-social{width:24px;margin-left:2px;padding:5px}.vault{width:100%}.section-title{font-size:34px}.project-description{font-size:11px;min-height:80px}.project-type{font-size:8px}.project-body h3{font-size:28px}.tags span{font-size:8px;padding:2px 5px}.gallery-heading{flex-direction:row;align-items:center;gap:16px}.gallery-heading .section-title{margin-bottom:23px}.story-links{font-size:10px;padding-bottom:15px;gap:15px}.gallery-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.project-grid{gap:16px}.keyboard-hint{display:none}}
@media(max-width:590px){.sidebar{display:flex;flex-direction:column}.profile{width:100%;grid-template-columns:110px minmax(0,1fr);gap:17px;padding:12px}.profile-photo{width:110px}#profile-bio{font-size:11px}.music{display:grid;grid-template-columns:164px minmax(0,1fr);position:relative}.music .panel-heading{grid-column:1/-1}.turntable{transform:scale(.6);transform-origin:top left;width:254px;height:150px;margin:25px 0 0 11px;pointer-events:none}.music-body{padding:12px 13px 14px 3px;position:relative;min-width:0}.playlist-label{font-size:8px;flex-wrap:wrap;gap:1px;padding-top:0;padding-bottom:7px}.playlist-label span{width:100%}#track-title{font-size:17px;margin-top:10px}#track-artist{font-size:9px;margin-bottom:10px}.timecode{margin-bottom:9px}.transport{flex-wrap:wrap;column-gap:5px;row-gap:7px}.transport .icon-button{width:25px}.volume-control{margin-left:0}.volume-control .range{width:48px}.preview-note{margin-top:10px;font-size:8px}.playlist-link{font-size:8px}.social-panel{width:100%}#social-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.social-row{border-bottom:1px solid var(--soft-line);min-width:0}.social-row:nth-child(odd){border-right:1px solid var(--soft-line)}.social-row:nth-last-child(-n+2){border-bottom:0}.social-main{gap:9px;padding:13px 0}.social-main>svg{display:none}.social-copy small{overflow-wrap:anywhere}.social-copy strong{font-size:10px}.social-copy small{font-size:8px}.copy-social{margin-left:0;width:23px}.project-grid{grid-template-columns:1fr;gap:19px}.project-image{aspect-ratio:16/8.6}.project-body{padding:17px}.project-body h3{font-size:29px}.project-description{font-size:12px;min-height:0;margin-bottom:16px}.project-type{font-size:9px}.tags span{font-size:9px;padding:2px 7px}.section-title{font-size:32px}.filters button{font-size:10px;padding:7px 10px}.gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.gallery-heading{align-items:flex-start;flex-direction:column;gap:0}.gallery-heading .section-title{margin-bottom:13px}.story-links{padding-bottom:17px}#archive{margin-top:38px}.lightbox-caption{padding:14px;align-items:flex-start;flex-direction:column;gap:8px}.lightbox-caption span,.lightbox-caption a{font-size:9px}.lightbox-caption h2{font-size:22px}.project-dialog-body{padding:18px}.project-dialog-body h2{font-size:28px}#project-detail{font-size:11px}.project-actions a{font-size:10px}.photo-arrow{width:32px;height:36px}#previous-photo{left:7px}#next-photo{right:7px}}
@media(max-width:360px){#site{padding-left:12px;padding-right:12px}.topbar nav{gap:10px;font-size:9px}.language-switch{gap:4px}.language-switch button{font-size:9px}.profile{grid-template-columns:90px minmax(0,1fr);gap:13px}.profile-photo{width:90px}#profile-bio{font-size:10px}.profile-handle{font-size:9px}#profile-location{font-size:8px}.music{grid-template-columns:133px minmax(0,1fr)}.turntable{transform:scale(.48);margin-top:24px;margin-left:8px}.music-body{padding-right:11px}.transport{column-gap:3px}#repeat-toggle{margin-left:0}.volume-control .range{width:50px}.social-row{padding:0 8px}.social-main{gap:7px}.social-main>.brand-icon{width:16px;height:16px}.social-copy small{font-size:7px}.copy-social{width:21px;padding:5px}}

/* Touch-first single-column layout and controls. Keep these last so the older
   breakpoint rules above cannot restore desktop grids on narrow screens. */
@media(max-width:768px){
 html,body{max-width:100%;overflow-x:hidden}
 body{min-width:0;overscroll-behavior-x:none}
 #site{width:100%;padding:0 18px 48px}
 .topbar{height:auto;min-height:64px;padding:6px 0}
 .topbar nav{width:100%;min-height:48px;justify-content:flex-end;flex-wrap:wrap;gap:4px 15px;font-size:10px}
 .topbar nav>a{display:inline-flex;align-items:center;min-height:44px;padding:6px 0}
 .language-switch{min-height:44px;align-items:center;gap:6px;margin-left:0}
 .language-switch button{min-width:36px;min-height:44px;padding:8px 6px;font-size:11px}
 .masthead{padding:20px 0 26px}
 .masthead h1{font-size:clamp(68px,17vw,100px)}
 .layout{display:flex;flex-direction:column;gap:34px;min-width:0}
 .sidebar{display:flex;flex-direction:column;width:100%;gap:18px;min-width:0}
 .profile{display:grid;grid-template-columns:minmax(110px,32%) minmax(0,1fr);gap:16px;width:100%;padding:12px;min-width:0}
 .profile-photo{width:100%;align-self:start}
 .profile-body{min-width:0;padding:4px 2px 2px 0}
 
 .profile-handle{flex-wrap:wrap;overflow-wrap:anywhere}
 #profile-location{margin:5px 0 9px}
 #profile-bio{font-size:11px;line-height:1.75;overflow-wrap:anywhere}
 .profile-pills{gap:6px;margin-top:8px}
 .profile-pill{white-space:normal;overflow-wrap:anywhere}
 .music,.social-panel,.vault{width:100%;min-width:0}
 .music{display:block;position:relative}
 .turntable{transform:none;width:254px;height:184px;margin:15px auto 7px;pointer-events:none}
 .music-body{padding:0 16px 16px;min-width:0}
 .playlist-label{flex-wrap:wrap}
 .transport{flex-wrap:wrap;gap:4px}
 .volume-control{margin-left:auto}
 .volume-control .range{width:72px}
 #links,#projects,#archive{scroll-margin-top:14px;min-width:0}
 .section-title{font-size:clamp(30px,6vw,36px)}
 .project-grid{grid-template-columns:minmax(0,1fr);gap:16px}
 .project-card{min-width:0}
 .project-description{min-height:0}
 .gallery-heading{align-items:flex-start;flex-wrap:wrap;gap:4px 14px}
 .gallery-heading .section-title{margin:0 0 8px}
 .story-links{flex-wrap:wrap;gap:4px 14px;padding:0 0 13px}
 .gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .gallery-card{min-width:0}
 .filters{gap:5px 7px;padding-bottom:10px;margin-bottom:15px}
 .filters button{min-height:44px;padding:9px 12px}
 .topbar button,.filters button,.transport button,.profile-handle button,.social-row button,
 .playlist-link,.story-links a,.project-title-button,.project-actions a,.close-button,.photo-arrow{touch-action:manipulation}
 .icon-button,.play-button{min-width:44px;min-height:44px;width:44px;height:44px;padding:10px}
 .profile-handle .icon-button{min-width:44px;min-height:44px;width:44px;height:44px;padding:10px}
 .volume-control button{min-width:44px;width:44px;height:44px;padding:10px}
 .range{height:44px;touch-action:pan-x}
 .range::-webkit-slider-thumb{width:14px;height:14px;margin-top:-6px}
 .range::-moz-range-thumb{width:14px;height:14px}
 .project-title-button{min-height:44px}
 .social-row{min-height:60px}
 .social-main{min-height:58px;padding:8px 3px}
 .copy-social{min-width:44px;min-height:44px;width:44px;height:44px;margin-left:3px}
 .playlist-link{min-height:44px}
 .story-links a{display:inline-flex;align-items:center;min-height:44px;padding:4px 0}
 dialog{width:calc(100vw - 24px);max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);overscroll-behavior:contain}
 #project-media img,#project-media video{max-height:48dvh}
 #lightbox-image{max-width:100%;max-height:56dvh}
 .dialog-bar{min-height:48px;padding:4px 10px}
 .close-button,.photo-arrow{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;width:44px;height:44px}
 .photo-arrow{top:50%}
 #previous-photo{left:6px}
 #next-photo{right:6px}
 .lightbox-caption{flex-wrap:wrap;padding:12px 14px}
 .lightbox-caption a{display:inline-flex;align-items:center;min-height:44px}
 .film-grain{opacity:.07}
}

@media(max-width:480px){
 #site{padding:0 12px 38px}
 .topbar nav{justify-content:center;gap:2px 11px}
 .masthead{padding:15px 0 22px}
 .masthead h1{font-size:clamp(64px,20vw,88px);gap:12px}
 .profile{grid-template-columns:minmax(90px,30%) minmax(0,1fr);gap:12px;padding:10px}
 .profile-body{padding-top:1px}
 
 .profile-pill{font-size:9px;line-height:1.45;padding:5px 8px}
 .profile-pills{gap:6px 5px}
 .turntable{margin-top:12px;margin-bottom:3px}
 .music-body{padding:0 12px 13px}
 .transport{justify-content:flex-start;gap:3px}
 .volume-control{margin-left:0}
 .volume-control .range{width:65px}
 #social-links{display:flex;flex-direction:column}
 .social-row{padding:0 9px}
 .social-main{gap:12px}
 .social-copy strong{font-size:11px}
 .social-copy small{font-size:9px;overflow-wrap:anywhere}
 .copy-social{margin-left:auto}
 .project-body{padding:15px}
 .project-body h3{font-size:27px}
 .project-description{font-size:11px;line-height:1.8}
 .tags{gap:6px}
 .tags span{font-size:8px;padding:4px 7px}
 .gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
 .gallery-card{padding:4px}
 .gallery-heading{display:block}
 .gallery-heading .section-title{margin-bottom:5px}
 .story-links{gap:3px 12px;padding-bottom:10px;font-size:10px}
 .filters{gap:4px}
 .filters button{padding:8px 9px;font-size:9px}
 .photo-arrow{background:rgba(10,9,10,.82)}
 .project-dialog-body{padding:15px}
 .project-dialog-body h2{font-size:26px}
 #project-detail{font-size:11px;overflow-wrap:anywhere}
 .project-actions{gap:7px}
 .project-actions a{min-height:44px;padding:8px 10px}
 .lightbox-caption h2{font-size:20px}
 .film-grain{opacity:.04}
}

/* Rounded controls and cards, with deliberately square gallery frames. */
.panel,.project-card,#project-dialog,#lightbox{border-radius:15px}
.panel,.project-card{overflow:visible}
#project-dialog,#lightbox{overflow:hidden}
button,a,input,[role=button],summary{border-radius:8px}
.profile-pill{border-radius:999px}
#psihopata-trigger.is-playing{border-color:#b59dab;background:rgba(88,65,80,.48);color:#f0e5ec}
#psihopata-error{font-size:9px;line-height:1.6;color:#d7b9c7;margin:7px 0 0}
.profile-photo{border-radius:9px}
.project-image{border-radius:14px 14px 0 0;overflow:hidden}
.filters button,.tags span,.project-actions a,.dialog-bar,.close-button,.photo-arrow,#toast,.skip-link,noscript{border-radius:8px}
.range::-webkit-slider-runnable-track{border-radius:999px}
.range::-webkit-slider-thumb{border-radius:50%}
.range::-moz-range-track{border-radius:999px}
.range::-moz-range-thumb{border-radius:50%}
#project-media{overflow:hidden}
#archive .gallery-card,#archive .gallery-card>img,#lightbox-image{border-radius:0;overflow:hidden}
