.auto-toggle,.vn-toolbar .auto-toggle,.pocket-tools .auto-toggle{display:inline-flex;align-items:center;justify-content:center;flex:none;min-height:29px;padding:5px 9px;border:1px solid #648396;border-radius:5px;background:#eef5ed;color:#345774;font:700 10px var(--font,sans-serif);line-height:1.4;white-space:nowrap;cursor:pointer;box-shadow:0 2px 0 #263b5633}
.auto-toggle.is-on,.vn-toolbar .auto-toggle.is-on,.pocket-tools .auto-toggle.is-on{color:#fffcec;background:#32657d;border-color:#b6d7d9}
.auto-toggle:hover{filter:brightness(1.08)}.auto-toggle:focus-visible{outline:3px solid #e3b858;outline-offset:2px}
.auto-floating{position:fixed;top:max(7px,env(safe-area-inset-top));right:max(12px,env(safe-area-inset-right));z-index:2100;padding:3px;border-radius:7px;background:#eaf1e8e8;box-shadow:0 2px 12px #25395144}
.pocket-tools:has(.auto-toggle)>span{display:none}
@media(max-width:480px){.auto-toggle,.vn-toolbar .auto-toggle,.pocket-tools .auto-toggle{min-height:26px;padding:4px 6px;font-size:9px}.vn-toolbar nav{gap:5px}.auto-floating{right:7px;top:max(5px,env(safe-area-inset-top))}}

.vn-toolbar>div{min-width:0}.vn-toolbar nav{flex-shrink:0}

.auto-toggle,.vn-toolbar .auto-toggle,.pocket-tools .auto-toggle{position:relative;width:28px;min-width:28px;max-width:28px;height:28px;min-height:28px;padding:0;font-size:13px;line-height:1;letter-spacing:0;overflow:hidden}.auto-toggle.is-on::after{content:"";position:absolute;width:4px;height:4px;right:2px;top:2px;border-radius:50%;background:#a9f6c0}.auto-floating{padding:2px}

.auto-floating{right:max(50px,env(safe-area-inset-right))}

button[data-auto-selected="true"]{position:relative;outline:3px solid #e3b858!important;outline-offset:1px;box-shadow:0 0 0 5px #e3b85855!important;background:#fff7d8!important}
button[data-auto-selected="true"]::after{content:"オート選択";position:absolute;right:5px;top:2px;padding:2px 5px;border-radius:3px;background:#755414;color:#fff;font-size:9px;line-height:1.3;pointer-events:none}

/* Modals without a dialogue toolbar reserve a row beneath the HUD for A/S. */
.auto-inline-controls{display:flex;justify-content:flex-end;gap:6px;flex:0 0 auto;padding:6px 12px;background:#eaf1e8;order:10;position:relative;z-index:6}
@media(max-width:600px){.auto-inline-controls{padding:5px 8px}.pocket-action-grid .pocket-action{min-height:62px;height:auto}.pocket-action-grid .pocket-action small{display:block;white-space:normal;overflow:visible;text-overflow:clip;-webkit-line-clamp:unset;line-clamp:unset;font-size:8px;line-height:1.35;max-height:none}.pocket-action-grid .pocket-action>div{min-width:0}}
