.v-page-icon-button{display:grid;place-items:center;width:64px;height:64px;margin:0 0 32px;padding:4px;border:0;border-radius:10px;background:transparent;color:inherit;cursor:pointer}
.v-page-icon-button:hover,.v-page-icon-button[aria-expanded="true"]{background:rgba(128,128,128,.12)}
.v-page-icon-button:focus-visible{outline:2px solid var(--focus);outline-offset:3px}
.v-page-icon-button:disabled{cursor:default;opacity:.6}
.v-page-icon-button img{display:block;width:60px;height:60px;opacity:.62}
:root[data-theme="light"] .v-page-icon-button img{filter:grayscale(1) brightness(.55)}
:root[data-theme="dark"] .v-page-icon-button img{filter:invert(.72) grayscale(1)}
.v-page-icon-button .v-page-emoji{font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;font-size:32px;line-height:1}
.v-emoji-picker{position:fixed;inset:auto;z-index:1000;box-sizing:border-box;width:min(320px,calc(100vw - 16px));max-height:calc(100dvh - 16px);overflow-y:auto;margin:0;padding:16px;border:1px solid rgba(128,128,128,.3);border-radius:12px;background:var(--v-surface,var(--panel));color:var(--text);box-shadow:0 14px 42px rgba(0,0,0,.23);font-family:inherit}
.v-emoji-picker-title{margin:0 0 12px;font-size:14px;font-weight:600}
.v-emoji-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:4px;max-height:220px;overflow-y:auto}
.v-emoji-option{display:grid;place-items:center;min-width:0;height:36px;padding:0;border:0;border-radius:6px;background:transparent;font-size:24px;cursor:pointer}
.v-emoji-option:hover,.v-emoji-option:focus-visible{background:rgba(128,128,128,.16)}
.v-emoji-custom{display:flex;gap:8px;margin-top:12px}
.v-emoji-custom input{flex:1;min-width:0;padding:8px 8px;border:1px solid rgba(128,128,128,.4);border-radius:6px;background:transparent;color:inherit;font:inherit;font-size:12px}
#pan .v-emoji-picker .v-emoji-custom input,#editorPan .v-emoji-picker .v-emoji-custom input{width:auto;flex:1;min-width:0;border:1px solid rgba(128,128,128,.4);padding:8px 8px;font-size:12px}
.v-emoji-custom button{padding:8px 8px;border:1px solid rgba(128,128,128,.4);border-radius:6px;background:rgba(128,128,128,.12);color:inherit;font:inherit;font-size:12px;cursor:pointer}
.v-emoji-error{margin:8px 0 0;color:var(--error-text,#d95555);font-size:12px;font-weight:600}
.v-emoji-reset{margin-top:12px;padding:4px 0;border:0;background:transparent;color:inherit;font:inherit;font-size:12px;text-decoration:underline;cursor:pointer}
/* The content editor's page icon: the client's (#pan) and the staff pages' (#editorPan) editor alike. */
:is(#pan,#editorPan) .v-page-icon-button{margin-bottom:32px}
@media(max-width:700px){:is(#pan,#editorPan) .v-page-icon-button{width:52px;height:52px;margin-bottom:20px}:is(#pan,#editorPan) .v-page-icon-button img{width:48px;height:48px}:is(#pan,#editorPan) .v-page-icon-button .v-page-emoji{font-size:32px}}
