/* Shared phone layout: content remains readable at 320px and with larger text. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
img{max-width:100%}
.input,select,button{max-width:100%}
@media(max-width:999px){
 body{background:var(--paper)}
 .layout{width:100%;max-width:600px;margin-inline:auto;padding:0}
 .phone{width:100%;min-width:0;overflow:visible;min-height:calc(100svh - 48px)}
 .prototype{min-height:48px;gap:8px;padding:0 max(16px,env(safe-area-inset-right)) 0 max(16px,env(safe-area-inset-left));font-size:12px;letter-spacing:0}
 .prototype>span{min-width:0}
 .prototype button,.prototype>a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 0;font-size:13px;flex-shrink:0}
 header{height:auto;min-height:84px;gap:12px;padding:16px max(20px,env(safe-area-inset-right)) 16px max(20px,env(safe-area-inset-left))}
 .brand{min-width:0;gap:10px;font-size:23px;letter-spacing:.06em;min-height:44px}
 .brand-mark{flex-shrink:0}
 .brand small{font-size:11px;line-height:1.9;letter-spacing:.025em;white-space:nowrap}
 .header-label{font-size:13px;letter-spacing:.08em;flex-shrink:0}
 .hero{padding:24px 20px;min-height:240px}
 .hero img{object-position:64% center}
 .hero:after{background:linear-gradient(90deg,#eeeadef7 0%,#eeeadecc 34%,#eeeade40 61%,transparent 80%)}
 .hero h1{font-size:clamp(28px,7.7vw,36px);line-height:1.5;letter-spacing:.1em;margin:10px 0}
 .hero .eyebrow{font-size:11px;letter-spacing:.1em}
 .hero p{font-size:15px}
 .hero .stamp{font-size:12px;margin-top:16px;padding:3px 8px}
 .content{padding:26px max(20px,env(safe-area-inset-right)) 30px max(20px,env(safe-area-inset-left))}
 .section-head{gap:10px;flex-wrap:wrap;margin-bottom:16px}
 .section-head h2{font-size:24px}.section-head span{font-size:13px}
 .project{padding:23px 0}.project h3{font-size:26px}.project p{font-size:16px;line-height:1.8}
 .project-bottom{gap:12px;align-items:center;flex-wrap:wrap;margin-top:14px}
 .meta{font-size:14px;gap:7px 12px;flex-wrap:wrap;min-width:0;flex:1}
 .meta span{white-space:nowrap}.link-btn{font-size:15px;min-height:44px;flex-shrink:0}
 .notice{font-size:14px;gap:10px}.notice p{min-width:0}
 .back{min-height:44px;font-size:15px;margin-bottom:16px}
 .page-title{font-size:29px;overflow-wrap:anywhere}
 .subtitle{font-size:16px;line-height:1.8}
 .facts{gap:10px 22px;flex-wrap:wrap;font-size:15px}
 .step-label{gap:5px 10px;flex-wrap:wrap}.step-label small{font-size:13px}
 .dates{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}
 .date{min-width:0;padding:10px 2px;min-height:89px}.date strong{font-size:22px}.date span{font-size:14px}.date em{font-size:12px}
 .slot{min-height:88px;padding:14px 12px;gap:8px;flex-wrap:wrap}
 .slot>span:first-child{min-width:0}.slot strong{font-size:19px;line-height:1.7}.slot small{font-size:13px}.slot .remaining{font-size:15px}
 .input,select,input[type='date'],input[type='time']{font-size:16px;min-width:0;min-height:50px}
 .input::placeholder{font-size:15px}.form-label{font-size:16px}
 .counter button{min-width:52px;min-height:52px}.counter input{min-height:52px}
 .primary,.secondary{min-height:54px;font-size:16px}
 .note,.scenario{font-size:14px;line-height:1.8}
 .details p{font-size:15px}.booking-summary{padding:17px}.booking-summary p{font-size:15px}
 .ticket{padding:19px}.ticket dl{grid-template-columns:65px minmax(0,1fr);font-size:15px;gap:13px 10px}
 .ticket-top{flex-wrap:wrap}.ticket h2{font-size:24px}.badge{font-size:13px}
 .ticket-number{font-size:12px;gap:8px;flex-wrap:wrap;overflow-wrap:anywhere}
 .cancel{min-height:44px;font-size:15px}
 footer{gap:12px;flex-wrap:wrap;font-size:12px;align-items:center;padding:18px 20px max(24px,env(safe-area-inset-bottom));letter-spacing:.04em}
 footer a{display:inline-flex;align-items:center;min-height:44px;font-size:14px}
 dialog{width:min(420px,calc(100vw - 28px));max-width:calc(100vw - 28px);max-height:calc(100dvh - 40px - env(safe-area-inset-top) - env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior:contain;padding:22px;border-radius:8px}
 dialog h2{font-size:24px}dialog p{font-size:15px}dialog select{min-height:50px;font-size:16px}
 #toast{max-width:calc(100vw - 32px);white-space:normal;text-align:center;bottom:max(24px,env(safe-area-inset-bottom));font-size:14px}
 .admin-shell{width:100%;margin:0 auto;max-width:700px;border:0;min-height:100svh}
 .admin-content{padding:24px 20px}.admin-title{display:block}.admin-title label{display:block;margin-top:20px}
 .admin-title select{width:100%;min-width:0}.admin-title h1{font-size:28px}
 .admin-controls{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.admin-controls label{min-width:0}
 .metrics{gap:8px;grid-template-columns:repeat(3,minmax(0,1fr))}.metric{padding:12px}.metric strong{font-size:26px}.metric small{font-size:13px}
 .admin-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.admin-tabs button{font-size:15px;min-height:48px;padding:10px 0}
 .toolbar{gap:10px;flex-wrap:wrap}.toolbar button{min-height:46px}.toolbar h2{font-size:22px}
 .admin-card{padding:16px}.admin-card-head{flex-wrap:wrap}.admin-card h3{font-size:20px;overflow-wrap:anywhere}
 .booking-meta{grid-template-columns:1fr;overflow-wrap:anywhere}.row-actions{gap:9px}.row-actions button{min-height:46px;font-size:14px;padding:8px 12px;flex:1 1 auto}
 .admin-form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.admin-form-grid label{min-width:0}
 .admin-search{max-width:none}.owner-detail p{font-size:15px}
}
@media(max-width:374px){
 header{padding-inline:16px;gap:8px}.brand{font-size:21px;gap:8px}.brand small{font-size:10px}.header-label{font-size:12px}
 .content,.admin-content{padding-inline:16px}.hero{padding-inline:16px}.hero .eyebrow{font-size:10px;letter-spacing:.08em}
 .meta{gap:5px 9px}.section-head h2{font-size:23px}.section-head span{font-size:12px}
 .dates{gap:5px}.date strong{font-size:20px}.slot strong{font-size:18px}
 .admin-controls{grid-template-columns:1fr}.admin-form-grid{grid-template-columns:1fr}
 .ticket{padding:15px}.ticket dl{font-size:14px}
}