/* Compact landscape browsers, including the reported Tesla HW4 CSS viewports.
   Keep desktop/phone styling intact; never scale by devicePixelRatio. */
@media (min-width:651px) and (max-height:760px) {
  body.tesla-layout{padding:8px}
  body.tesla-layout #error:empty{display:none}
  body.tesla-layout #error:not(:empty){margin:0 auto 8px;padding:8px 12px;max-width:1440px;background:#392e22;border:1px solid #a07e4d;border-radius:8px}
  .radio.tesla{height:calc(100vh - 16px - var(--tesla-notice-height,0px));height:calc(100dvh - 16px - var(--tesla-notice-height,0px));min-height:480px;padding:12px;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto auto;gap:8px;border-radius:16px}
  .radio.tesla .brandbar{margin:0 3px;min-height:25px}
  .radio.tesla .brand{font-size:21px}
  .radio.tesla .lcd{grid-template-columns:140px minmax(0,1fr) 178px;gap:12px;padding:9px 12px;margin:0}
  .radio.tesla .channel{grid-template-rows:44px 44px;gap:2px 7px;padding-right:8px}
  .radio.tesla .channel-pick .number{font-size:56px}
  .radio.tesla .roomname{font-size:22px;letter-spacing:1px;margin:5px 0;line-height:1.15;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .radio.tesla .liveinfo{font-size:12px;gap:7px;flex-wrap:wrap}
  .radio.tesla .signal{grid-column:auto;display:block;border:0;padding:0}
  .radio.tesla .timerrow{gap:8px;align-items:center}
  .radio.tesla #speakerLabel{max-width:100px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;letter-spacing:0}
  .radio.tesla .timer{font-size:25px;letter-spacing:0;white-space:nowrap}
  .radio.tesla .signal>.small{display:block;font-size:10px}
  .radio.tesla .meter{margin:8px 0;height:10px}
  .radio.tesla .bodygrid{display:grid;grid-template-columns:200px minmax(0,1fr);grid-template-rows:minmax(0,1fr) 76px;gap:8px;min-height:0}
  .radio.tesla .bodygrid>.workspace{height:auto;min-height:0;grid-column:2;grid-row:1/3;gap:8px}
  .radio.tesla .bodygrid>.side{height:auto;min-height:0;padding:9px}
  .radio.tesla .side-title{margin:0 0 4px;letter-spacing:.6px}
  .radio.tesla .person{min-height:44px;padding:5px;gap:7px}
  .radio.tesla .person>div{min-width:0}
  .radio.tesla .person b{overflow-wrap:anywhere}
  .radio.tesla .queue-label{margin:4px 0;padding-top:5px;max-height:30px;font-size:10px}
  .radio.tesla .photo{flex:0 0 100px;height:100px;min-height:100px;max-height:100px}
  .radio.tesla .photo-label{padding:5px;font-size:9px}
  .radio.tesla .bodygrid>.ptt{min-height:76px;font-size:17px;padding:8px;position:static}
  .radio.tesla .ptt small{margin-top:5px;line-height:1.25;font-size:11px}
  .radio.tesla .workspace[data-focus=chat] .map-wrap{display:none}
  .radio.tesla .workspace[data-focus=map] .panel-chat{display:none}
  .radio.tesla .workspace[data-focus=split] .map-wrap{flex:1;min-height:44px}
  .radio.tesla .workspace[data-focus=split] .panel-chat{flex:2;min-height:150px}
  .radio.tesla .chat-heading{padding:8px 12px}
  .radio.tesla .messages{padding:0 12px}
  .radio.tesla .composer{padding:6px 8px;gap:3px 6px}
  .radio.tesla .composer textarea{min-height:44px;max-height:64px;padding:9px;font-size:16px}
  .radio.tesla .send{min-height:44px;padding:0 12px}
  .radio.tesla .new-messages{bottom:84px}
  .radio.tesla .bottom-controls{gap:8px;margin:0;flex-wrap:nowrap}
  .radio.tesla .bottom-controls .viewbar{gap:8px}
  .radio.tesla .viewbar>.small{display:none}
  .radio.tesla .bottom-controls button{min-height:44px;min-width:44px;padding:8px 12px}
  .radio.tesla .bottom-controls #listen{flex-basis:auto}
  .radio.tesla .foot{margin:0 3px;font-size:9px;letter-spacing:0;gap:8px}
  #room:has(.radio.tesla)>.notes{display:none}
  body.tesla-layout dialog{max-height:calc(100dvh - 24px)}
  body.tesla-layout .join-panel{margin:8px auto;padding:18px}
  body.tesla-layout .join-panel h1{margin:0 0 10px}
}
@media (min-width:651px) and (max-width:850px) and (max-height:760px) {
  .radio.tesla .lcd{grid-template-columns:126px minmax(0,1fr) 155px;gap:10px}
  .radio.tesla .roomname{font-size:20px}
  .radio.tesla .brandbar .engraved{font-size:9px;letter-spacing:1px}
  .radio.tesla .bottom-controls{gap:5px}
  .radio.tesla .bottom-controls button{padding:8px 10px;font-size:12px}
}
/* Shared symbols remain hidden outside the explicit Tesla layout. */
.tesla-only{display:none!important}
.radio.tesla .tesla-only{display:flex!important}
.tesla-icon{width:22px;height:22px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle}
.radio.tesla .hardware{align-items:center;justify-content:center;gap:7px}
.radio.tesla .tesla-status{grid-column:1/-1;grid-row:1;justify-content:space-between;gap:8px;font:700 10px monospace;color:var(--lit);letter-spacing:.4px}
.tesla-status span{opacity:.3}.tesla-status span.lit{opacity:1}
.tesla-dialog .tesla-field{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:18px 0}
.tesla-dialog select,.tesla-dialog input[type=file]{max-width:65%;min-height:44px}
.tesla-dialog input[type=checkbox]{width:24px;height:24px}
.tesla-dialog input[type=range]{width:55%;min-height:44px}
.tesla-dialog .tesla-avatar-preview{width:120px;height:90px;object-fit:contain}
.radio.tesla .settings-fields>.tesla-only{min-height:44px}
.radio.tesla .privacy-controls label:has(#cameraEnabled){display:none}
.radio.tesla #channelDialog>.tesla-only{display:inline-flex!important;min-height:44px;margin:5px}
.radio.tesla .tesla-people-panel{flex:1;min-height:0;overflow:hidden;border:1px solid #496067;border-radius:12px;background:#142228;padding:12px;display:flex;flex-direction:column;gap:8px}
.radio.tesla .tesla-people-panel[hidden]{display:none}
.radio.tesla .tesla-people-panel h2{font-size:14px;letter-spacing:1px;margin:0;color:var(--lit)}
.radio.tesla .tesla-people-panel #members{flex:1;min-height:0;overflow:auto}
.radio.tesla .workspace[data-focus=people] .panel-chat,.radio.tesla .workspace[data-focus=people] .map-wrap{display:none}
.radio.tesla #teslaPeople[aria-pressed=true]{border-color:var(--lit);color:var(--lit);box-shadow:inset 0 0 0 1px var(--lit)}
.radio.tesla .signal .timerrow{display:grid;grid-template-columns:minmax(0,1fr) 44px 44px;gap:2px}
.radio.tesla #speakerLabel{grid-column:1/-1;max-width:none;font-size:10px}
.radio.tesla #teslaImageIndicator,.radio.tesla #teslaAudio{padding:4px;min-height:44px;min-width:44px;border:0;background:none;box-shadow:none;color:var(--lit)}
.radio.tesla #teslaImageIndicator{opacity:.3}.radio.tesla #teslaImageIndicator.image-ready{opacity:1}
.radio.tesla .tesla-speaker-caption{font-size:10px;letter-spacing:1.3px;color:var(--lit)}
.radio.tesla .tesla-speaker-name{font-size:17px;font-weight:700;color:var(--lit);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.radio.tesla .tesla-speaker-client{font-size:11px;color:#a7b8bd}
.radio.tesla #teslaPicture{min-height:44px;font-size:11px;padding:5px;width:100%;flex-direction:row-reverse}
.radio.tesla .message{border:0;padding:10px 0;font-size:15px;line-height:1.4}
.radio.tesla .message b{color:var(--lit)}
.radio.tesla .message .tesla-icon{width:16px;height:16px;color:var(--lit);margin-left:6px}
.radio.tesla .message time{float:right;font-size:10px;color:#a7b8bd}
.radio.tesla .ptt>.tesla-icon{display:block;margin:0 auto 9px;width:30px;height:30px;color:var(--lit)}
.radio.tesla .tesla-turn-limit{display:block;font-size:9px;letter-spacing:.5px;margin-top:12px}
@media (min-width:651px) and (max-height:760px){
 .radio.tesla{grid-template-columns:200px minmax(0,1fr);grid-template-rows:25px auto minmax(0,1fr) 72px 44px}
 .radio.tesla .brandbar{grid-column:1/-1;grid-row:1}
 .radio.tesla .lcd{grid-column:1/-1;grid-row:2;grid-template-rows:12px auto;gap:5px 12px}
 .radio.tesla .channel,.radio.tesla .lcd>div:nth-child(2),.radio.tesla .signal{grid-row:2}
 .radio.tesla .meter{display:flex;margin:3px 0;height:10px}
 .radio.tesla .bodygrid{display:contents}
 .radio.tesla .bodygrid>.side{grid-column:1;grid-row:3;display:flex;flex-direction:column;gap:4px;padding:9px;overflow:hidden}
 .radio.tesla .side>.side-title,.radio.tesla .photo-label{display:none}
 .radio.tesla .photo{flex:1 1 60px;height:auto;min-height:40px;max-height:none;margin:0;border:0;background:#0b2026}
 .radio.tesla #speakerImage{width:100%;height:100%;object-fit:contain}
 .radio.tesla #speakerAvatar{height:100%;min-height:0;font-size:32px}
 .radio.tesla .bodygrid>.workspace{grid-column:2;grid-row:3/5}
 .radio.tesla .bodygrid>.ptt{grid-column:1;grid-row:4/6;min-height:124px;font-size:18px;padding:9px}
 .radio.tesla .bottom-controls{grid-column:2;grid-row:5;display:flex;gap:5px}
 .radio.tesla .bottom-controls .viewbar,.radio.tesla .viewbar>div{display:contents}
 .radio.tesla .viewbar button{display:flex;align-items:center;justify-content:center;gap:5px}
 .radio.tesla .bottom-controls button{flex:1;min-width:0;font-size:11px;padding:5px}
 .radio.tesla [data-focus=chat]{order:1}.radio.tesla [data-focus=split]{order:2}.radio.tesla [data-focus=map]{order:3}
 .radio.tesla #teslaPeople{order:4}.radio.tesla #openSettings{order:5;display:flex}
 .radio.tesla .bottom-controls .tesla-icon{width:18px;height:18px}
 .radio.tesla #openTopic,.radio.tesla #leave,.radio.tesla .foot{display:none!important}
 .radio.tesla #listen:not([hidden]){position:fixed;z-index:5;right:20px;top:12px;padding:8px 16px;background:#19434a}
 .radio.tesla .viewbar>.small{display:none}
 .radio.tesla .chat-heading{padding:7px 10px;font-size:11px}
 .radio.tesla .composer-note{display:none}
 .radio.tesla .new-messages{bottom:62px}
 .radio.tesla .workspace[data-focus=split] .panel-chat{min-height:135px}
}
@media (min-width:651px) and (max-height:760px){
 .radio.tesla .lcd{grid-template-columns:126px minmax(0,1fr) 180px}
 .radio.tesla .timer{font-size:22px}
 .radio.tesla .bodygrid>.ptt{font-size:15px;line-height:1.15;padding:8px}
 .radio.tesla .ptt>.tesla-icon{width:25px;height:25px;margin-bottom:6px}
 .radio.tesla .ptt small{font-size:10px;margin-top:5px}
 .radio.tesla .tesla-turn-limit{font-size:8px;margin-top:8px}
}
.radio.tesla .message header{display:flex;align-items:center;gap:5px}
.radio.tesla .message time{margin-left:auto;float:none}
.radio.tesla .message p{display:block;margin:4px 0 0}
