/* Public links and language controls share the existing atelier palette. */
.public-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 30px 0;flex:0 0 auto;background:#111815}
.public-links{display:flex;align-items:center;gap:8px;min-width:0}
.public-links a{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:44px;padding:8px 13px;color:var(--text);border:1px solid #53614c;border-radius:8px;text-decoration:none;font-size:14px;line-height:1.3}
.public-links .coffee-link{color:var(--accent);border-color:#74874e;background:#25301e}
.public-links a:hover{background:#34432a;border-color:var(--accent)}
a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.language-switch{display:flex;gap:2px;flex-shrink:0}
.language-switch button{min-height:44px;min-width:44px;font-size:14px;padding:8px 10px}
.screen-note{flex:0 0 auto;font-size:14px;line-height:1.45;color:#b8c6b7;background:#111815;margin:0;padding:8px 30px 12px;border-bottom:1px solid var(--line)}
.compact-label{display:none}
.stage.dragover:after{content:attr(data-drop-label)}
.mobile-focus .public-toolbar,.mobile-focus .screen-note{display:none}
@media(max-width:900px),(max-height:520px) and (pointer:coarse){
 .public-toolbar{padding:2px max(10px,env(safe-area-inset-right)) 0 max(10px,env(safe-area-inset-left));gap:8px}
 .public-links{gap:6px;flex:1}.public-links a{padding:7px 9px;flex:1;white-space:nowrap}
 .public-toolbar .full-label{display:none}.public-toolbar .compact-label{display:inline}
 .language-switch{gap:2px}.language-switch button{padding:6px;min-width:44px}
 .screen-note{font-size:12px;padding:5px max(12px,env(safe-area-inset-right)) 9px max(12px,env(safe-area-inset-left));line-height:1.35}
}
@media(orientation:landscape) and (max-height:540px){
 .screen-note{font-size:14px;padding-top:4px;padding-bottom:6px}
 .public-toolbar{padding-top:2px}.public-links{flex:0 1 auto}
}
@media(max-width:330px){.public-toolbar{gap:4px;padding-left:6px;padding-right:6px}.public-links{gap:4px}.public-links a{padding:6px;font-size:14px}.language-switch button{padding:4px}}

@media(max-width:900px),(max-height:520px) and (pointer:coarse){.screen-note .full-label{display:none}.screen-note .compact-label{display:inline}.screen-note{line-height:1.3;padding-bottom:6px}}

/* Naming belongs to saving, not another permanent toolbar. */
#saveDialog{width:min(440px,calc(100vw - 32px))}
#saveDialog h2{margin-top:0}#saveDialog .control{margin-top:22px}
.save-name-row{display:flex;align-items:center;gap:8px;min-width:0}
#saveName{width:100%;min-width:0;min-height:46px;font:inherit;background:#111a15;border:1px solid #78836d;border-radius:8px;padding:10px;color:var(--text,#e4eadf)}
#saveExtension{font-size:13px;color:#b9c4b5;flex-shrink:0}
.save-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:22px}.save-actions button{min-height:44px}
.touch-hint{display:none}
@media(pointer:coarse){.touch-hint{display:block;flex:0 0 auto;text-align:center;color:#aab7a8;font-size:12px;line-height:1.4;margin:0;padding:2px 10px 7px;pointer-events:none}}
@media(max-width:900px),(max-height:520px) and (pointer:coarse){.touch-hint{display:block;flex:0 0 auto;text-align:center;color:#aab7a8;font-size:12px;line-height:1.4;margin:0;padding:0 10px 3px;pointer-events:none}}
@media(orientation:landscape) and (max-height:540px){.touch-hint{display:none}.workspace{flex-basis:220px;min-height:220px}}
.mobile-focus .touch-hint{display:none}.mobile-focus .workspace{flex-basis:0;min-height:0}
