/* Responsive layout shared by both languages */
html{scroll-behavior:smooth}
body{min-width:280px}
header{gap:16px;padding:20px max(20px,calc((100vw - 1200px)/2))}
header .brand{flex-shrink:0}
header .tag{white-space:normal;text-align:center}
.language-picker{flex:0 0 140px}
main{width:100%;max-width:1280px;padding:32px clamp(16px,4vw,48px)}
.intro{max-width:760px}
h1{font-size:clamp(30px,4.4vw,48px);line-height:1.12}
h2{line-height:1.3}
.card,.grid>*{min-width:0}
.grid{grid-template-columns:minmax(0,1fr) minmax(0,1.35fr)}
.fields{grid-template-columns:repeat(2,minmax(0,1fr))}
input,select,textarea{font-size:16px;max-width:100%;min-height:48px}
button{min-height:46px;touch-action:manipulation;white-space:normal;line-height:1.3}
.actions button{min-height:44px;font-size:14px}
button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #8db8ff;outline-offset:3px}
.tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.tabs button{padding:13px 12px}
.rowtop{flex-wrap:wrap;align-items:flex-start}
.rowtop strong{flex:1 1 130px;overflow-wrap:anywhere}
.row p,.card p,#sessionName,#message,.notice,footer{overflow-wrap:anywhere}
.pill{flex-shrink:0}
#sessionBar{display:flex;align-items:center;flex-wrap:wrap;gap:14px}
#sessionName{flex:1 1 260px;min-width:0}
#logout{margin-left:0!important}
#accountStatus{flex-basis:100%;margin:0}
.stats{grid-template-columns:repeat(3,minmax(0,1fr))}
.stat span{display:block;line-height:1.45}
#message:empty{min-height:0;margin:0}
#login{width:100%}
#loginForm button,#verifyForm button,#passwordForm button{width:100%}
summary{cursor:pointer;padding:12px 0;line-height:1.5}
textarea{min-height:110px}
@media(min-width:801px) and (max-width:1100px){
 .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
 .card{padding:20px}
 #productForm .fields{grid-template-columns:1fr}
 #productForm .full{grid-column:auto}
}
@media(max-width:800px){
 main{padding-top:24px}
 .grid{grid-template-columns:minmax(0,1fr);gap:20px}
 .fields{grid-template-columns:repeat(2,minmax(0,1fr))}
 .card{padding:22px}
 header{padding:18px 20px}
 .intro{max-width:100%}
}
@media(max-width:540px){
 header{gap:12px;padding:16px}
 header>.tag{display:none}
 .brand{font-size:22px}
 .language-picker{flex-basis:124px;min-width:124px;font-size:12px}
 .language-picker select{padding:9px;min-height:44px}
 main{padding:22px 16px 32px}
 h1{letter-spacing:-.8px;font-size:32px}
 h1 br{display:none}
 .intro p{font-size:15px}
 .notice{margin:20px 0;padding:13px 15px}
 .tabs{grid-template-columns:1fr;margin:20px 0;gap:8px}
 .tabs button{text-align:left;padding:13px 16px}
 .card{padding:18px;border-radius:14px}
 .fields{grid-template-columns:1fr;gap:16px}
 .full{grid-column:auto}
 .stats{gap:8px}
 .stats .card{padding:14px 10px;border-radius:12px}
 .stat strong{font-size:26px}
 .stat span{font-size:12px}
 .actions{gap:10px}
 .actions button{flex:1 1 120px}
 #productForm>.actions{flex-direction:column}
 #sessionName{flex-basis:100%;font-size:15px}
 #logout{width:100%}
 .rowtop{gap:10px}
 label{font-size:14px}
 footer{line-height:1.6}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}