/* Shared density and alignment. Reading content retains its own typography. */
:root { --ui-gap:12px; --ui-panel-padding:18px; --ui-control-height:36px; }
button:disabled { cursor:default; }
button[aria-busy=true] { cursor:progress; }
.view-heading { margin-bottom:20px; }
.view-heading h1 { line-height:1.3; letter-spacing:-.025em; word-break:keep-all; overflow-wrap:anywhere; }
.view-heading>p { margin-top:7px; line-height:1.55; }
.section-heading { gap:8px 12px; flex-wrap:wrap; align-items:center; margin-bottom:14px; }
.section-heading>div,.section-heading h2,.home-content,.home-aside,.board-preview,.board-head,.world-card,.community-content,.writing-content,.studio-main,.admin-content { min-width:0; }
.section-title { line-height:1.35; word-break:keep-all; overflow-wrap:anywhere; }
.section-desc { line-height:1.5; margin-top:5px; }
.board-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.board-head { gap:8px; }
.board-head h2 { flex:1; min-width:0; line-height:1.4; word-break:keep-all; }
.board-head>.text-link { flex:none; }
.post-row { min-width:0; gap:8px; }
.post-row-title { min-width:0; }
.post-row time,.board-list-row>small:last-child { white-space:nowrap; font-variant-numeric:tabular-nums; }
.board-list-row { min-width:0; padding-block:13px; gap:8px 14px; }
.board-list-row>strong { min-width:0; line-height:1.5; overflow-wrap:anywhere; }
.world-grid,.entity-grid { gap:14px; }
.card-copy { padding:14px; }
.card-summary { line-height:1.55; min-height:3.1em; }
.card-meta { padding-top:9px; margin-top:10px; gap:5px 9px; }
.board-tabs,.studio-tabs,.admin-board-filters { min-width:0; max-width:100%; overscroll-behavior-x:contain; }
.admin-main-tabs { display:flex; flex-wrap:nowrap; gap:3px; overflow-x:auto; overflow-y:hidden; margin-bottom:16px; }
.admin-main-tabs .board-tab { flex:none; min-height:38px; padding:9px 11px; white-space:nowrap; }
.admin-panel { padding:var(--ui-panel-padding); margin-bottom:16px; border-radius:9px; }
.admin-panel h2 { margin-bottom:12px; line-height:1.4; }
.admin-stats { gap:12px; margin-bottom:16px; }
.admin-stats>div { padding:16px; }
.admin-role-grid { gap:12px; }
.admin-member,.admin-post { padding-block:12px; gap:12px; }
.admin-member .btn,.admin-post .btn { flex:none; }
.member-profile,.member-section-content { padding:18px; }
.member-detail-section>summary { padding:13px 18px; min-height:44px; }
.member-info { gap:9px 14px; }
.member-row { padding-block:13px; }
.point-shop { gap:12px; }
.point-product { gap:10px; }
.point-product p { line-height:1.55; }
.point-history article,.point-admin-list article,.point-request { padding-block:13px; gap:12px; }
.point-history-amount { font-variant-numeric:tabular-nums; }
.storage-volume,.storage-site { min-width:0; }
.form-field { min-width:0; }
.form-help { overflow-wrap:anywhere; }
.form-actions { gap:8px; flex-wrap:wrap; }
.modal { max-width:calc(100% - 24px); }
.modal-header { gap:12px; padding:17px 22px; }
.modal-header h2 { min-width:0; line-height:1.4; word-break:keep-all; overflow-wrap:anywhere; }
.modal-header>.icon-btn { flex:none; }
.modal-body { padding:18px 22px; scroll-padding-block:12px; }
.modal-body>.form-help { margin-block:0 12px; }
.form-row { gap:12px; }
.account-settings { margin-bottom:16px; }
.prose :is(pre,figure,table),.reader-body,.post-reader { min-width:0; }
.prose pre { max-width:100%; overflow-x:auto; }
.prose a { overflow-wrap:anywhere; }
.empty { padding:32px 18px; }
.empty h3 { line-height:1.4; }
.empty p { margin-block:8px 16px; line-height:1.6; }
@media(max-width:900px) {
 .admin-role-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .point-admin-list article { grid-template-columns:minmax(0,1fr) auto; gap:8px; }
 .point-admin-list article>.point-actions { grid-column:1/-1; justify-self:start; }
 .point-search { gap:8px; }
}
@media(max-width:650px) {
 :root { --ui-panel-padding:14px; }
 .view-heading { margin-bottom:18px; }
 .view-heading h1 { font-size:25px; }
 .board-grid { grid-template-columns:minmax(0,1fr); gap:12px; }
 .board-preview { padding:13px 12px 8px; }
 .board-head { margin-bottom:7px; }
 .board-head h2 { font-size:13px; }
 .post-row { padding-block:9px; }
 .section-heading { margin-bottom:12px; }
 .community-board-picker { margin-bottom:16px; gap:10px; }
 .world-grid,.entity-grid { gap:10px; }
 .home-content .world-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .home-content .card-copy { padding:10px 9px; }
 .home-content .card-summary { font-size:11px; line-height:1.45; min-height:2.9em; }
 .home-content .card-meta { font-size:10px; line-height:1.4; padding-top:7px; margin-top:7px; }
 .board-list-row { padding-block:11px; gap:6px 9px; }
 .board-list-row>strong { line-height:1.45; }
 .admin-stats { gap:8px; }
 .admin-stats>div { padding:12px 10px; }
 .admin-stats strong { font-size:23px; }
 .admin-main-tabs .board-tab { min-height:42px; padding:9px 10px; font-size:12px; }
 .admin-panel { margin-bottom:12px; }
 .admin-panel h2 { font-size:16px; }
 .admin-role-grid { grid-template-columns:minmax(0,1fr); }
 .member-profile,.member-section-content { padding:14px; }
 .member-detail-section>summary { padding:12px 14px; }
 .member-info { gap:8px 10px; }
 .point-product { padding:15px; }
 .point-product h2 { font-size:16px; }
 .point-product p { font-size:12px; }
 .point-product>strong { font-size:21px; }
 .point-history article { gap:10px; }
 .point-history small { font-size:11px; line-height:1.4; }
 .point-wallet .point-limit-label { font-size:13px; line-height:1.45; }
 .point-wallet strong { font-size:27px; }
 .modal-header { padding:13px 15px; }
 .modal-header h2 { font-size:17px; }
 .modal-body { padding:14px 15px; }
 .modal .form-actions { margin-top:16px; }
 .form-row { gap:8px; }
 .form-field { margin-bottom:13px; }
 .form-field :is(input:not([type=checkbox]):not([type=range]):not([type=color]),textarea,select) { font-size:16px; }
 .modal .btn { max-width:100%; }
}
@media(hover:none) { .btn.primary:hover { transform:none; } }
@media(prefers-reduced-motion:reduce) { .btn,.icon-btn { transition:none; } }

/* Settings have a single entry per purpose; original forms retain their state. */
.profile-settings-modal { height:min(710px,calc(100dvh - 36px)); }
.profile-settings-modal .modal-body { padding-top:0; scroll-padding-top:54px; }
.profile-settings-tabs { position:sticky; top:0; z-index:8; display:flex; gap:4px; padding:9px 0; margin-bottom:14px; border-bottom:1px solid var(--line); background:var(--paper); }
.profile-settings-tabs button { flex:1; min-width:0; min-height:36px; padding:7px 10px; border:0; border-radius:5px; background:transparent; color:var(--muted); font:600 12px/1.35 var(--sans); white-space:nowrap; }
.profile-settings-tabs button[aria-selected=true] { color:var(--accent); background:var(--accent-soft); }
.profile-settings-panel[hidden] { display:none!important; }
.profile-settings-panel { min-width:0; outline-offset:3px; }
.profile-settings-panel>.settings-section:first-child,.profile-settings-panel>form>.settings-section:first-child { margin-top:0; padding-top:0; border-top:0; }
.profile-settings-panel .settings-section { margin-top:16px; padding-top:16px; }
.profile-settings-panel .form-actions { position:sticky; bottom:0; z-index:4; padding:10px 0; margin-bottom:0; background:var(--paper); border-top:1px solid var(--line); }
.profile-settings-panel .storage-summary { margin:0; }
.profile-settings-panel :is(h3,summary,p,.form-help) { text-align:left; }
.profile-settings-panel h3 { line-height:1.4; }
.profile-settings-panel .account-settings summary>span { display:block; margin-top:3px; line-height:1.4; }
.profile-settings-panel .storage-metrics dd { text-align:left; }
.storage-filters { display:grid; grid-template-columns:minmax(0,1fr); gap:8px; }
.storage-filter-basic,.storage-filter-advanced { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; align-items:end; }
.storage-filter-basic .storage-query { grid-column:span 2; }
.storage-filter-basic:has([name=owner]) .storage-query { grid-column:auto; }
.storage-explanation { font-size:11px; color:var(--muted); }
.storage-explanation summary { cursor:pointer; width:fit-content; }
.storage-explanation p { margin-top:7px; line-height:1.5; }
.storage-filter-details { min-width:0; border-block:1px solid var(--line); padding-block:8px; }
.storage-filter-details summary { display:flex; align-items:center; gap:9px; width:fit-content; font-size:12px; cursor:pointer; list-style:none; }
.storage-filter-details summary::-webkit-details-marker { display:none; }
.storage-filter-details summary::before { content:'›'; font-size:17px; line-height:1; transition:transform .12s; }
.storage-filter-details[open] summary::before { transform:rotate(90deg); }
.storage-filter-details summary :is(small,span) { font-size:10px; color:var(--muted); font-variant-numeric:tabular-nums; }
.storage-filter-advanced { margin-top:9px; }
.storage-filter-actions { display:flex; gap:6px; justify-content:flex-end; }
.storage-list-actions>label { display:flex; align-items:center; gap:5px; }
.storage-item>div:not(.storage-item-size) { flex:1; }
.storage-item-size { font-variant-numeric:tabular-nums; }
.entity-grid { grid-template-columns:repeat(2,minmax(0,1fr)); align-items:stretch; }
.entity-card { display:flex; flex-direction:column; align-items:stretch; justify-content:flex-start; padding:14px; }
.entity-card-header { display:flex; align-items:flex-start; justify-content:space-between; gap:8px; min-height:34px; margin-bottom:6px; }
.entity-card-labels { display:flex; flex-wrap:wrap; align-items:center; align-content:flex-start; gap:4px; min-width:0; }
.entity-card-labels .tag { margin:0; white-space:normal; line-height:1.4; overflow-wrap:anywhere; text-align:left; }
.entity-card .entity-image { float:none; width:34px; height:34px; flex:none; margin:0; }
.entity-card h3 { min-height:2.8em; font-size:14px; line-height:1.4; text-align:left; word-break:keep-all; overflow-wrap:anywhere; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
.entity-card p { min-height:3em; margin-top:6px; font-size:11px; line-height:1.5; text-align:left; }
.entity-card .entity-year { margin-top:auto; padding-top:6px; }
.world-card .card-meta { margin-top:auto; }
.world-card .card-summary { margin-bottom:10px; }
.card-heading,.card-title,.entity-card h3,.setting-top h2 { text-wrap:pretty; }
.card-heading,.card-title { word-break:keep-all; overflow-wrap:anywhere; }
.card-author { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.setting-top { align-items:flex-start; gap:10px 16px; margin-bottom:16px; }
.setting-top>.collab-buttons { flex:none; justify-content:flex-end; }
.entity-search-row { gap:8px 12px; margin-bottom:12px; }
.entity-search-meta { gap:7px; }
.entity-result-count { white-space:nowrap; }
.entity-categories { gap:5px; margin-bottom:14px; }
.board-list-row { align-items:baseline; }
.board-list-row>.tag { align-self:start; }
.board-list-row>.author-col { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
@media(max-width:650px) {
 .profile-settings-tabs { gap:2px; margin-bottom:12px; }
 .profile-settings-tabs button { padding:7px 5px; min-height:39px; font-size:11px; }
 .storage-filter-basic,.storage-filter-advanced { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .storage-filter-basic :is(input,select),.storage-filter-advanced :is(input,select) { font-size:16px; }
 .storage-filter-actions .btn { min-height:36px; }
 .entity-grid { grid-template-columns:minmax(0,1fr); }
 .entity-card { padding:12px; }
 .entity-card h3 { font-size:13px; }
 .setting-top { flex-wrap:wrap; }
 .setting-top>.collab-buttons { width:100%; justify-content:flex-start; }
 .entity-search-meta { align-items:center; }
 .entity-result-count { font-size:10px; }
 .entity-search-meta .btn { padding:7px 8px; }
}

/* A canvas-first desk: menus, one contextual option row, tools, canvas, dock. */
body:has(.drawing-studio[data-has-canvas]) #main { max-width:none; padding:12px 18px; }
body:has(.drawing-studio[data-has-canvas]) #footer { display:none; }
.drawing-studio { --desk-chrome:color-mix(in srgb,var(--paper) 88%,var(--ink)); --desk-stage:#d3d6dc; --desk-line:color-mix(in srgb,var(--line) 82%,var(--ink)); display:flex; flex-direction:column; min-width:0; }
.dark .drawing-studio { --desk-stage:#292d34; }
.drawing-studio[data-has-canvas] { height:calc(100dvh - 158px); min-height:560px; border:1px solid var(--desk-line); border-radius:7px; background:var(--paper); overflow:hidden; }
.drawing-studio>.drawing-heading { gap:12px; min-height:40px; padding:5px 12px; margin:0; background:var(--paper); }
.drawing-studio .drawing-heading h1 { font-size:15px; line-height:1.35; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.drawing-studio .drawing-heading .tag { font-size:9px; flex:none; }
.drawing-studio .drawing-room-actions .btn { min-height:30px; padding:5px 9px; font-size:11px; }
.drawing-studio>.drawing-participants { margin:0; padding:3px 12px 5px; min-height:24px; font-size:10px; gap:10px; border-bottom:1px solid var(--desk-line); }
.drawing-studio>.drawing-canvas-tabs { padding:3px 8px 0; min-height:35px; gap:4px; background:var(--desk-chrome); border-bottom:1px solid var(--desk-line); }
.drawing-studio .drawing-canvas-tab { border:1px solid transparent; border-radius:5px 5px 0 0; max-width:270px; }
.drawing-studio .drawing-canvas-tab>a { padding:6px 10px; font-size:11px; }
.drawing-studio .drawing-canvas-tab.active { border-color:var(--desk-line); border-bottom-color:var(--paper); color:var(--ink); background:var(--paper); }
.drawing-studio .drawing-canvas-tabs>.btn { min-height:30px; padding:4px 9px; font-size:11px; flex:none; }
.drawing-studio>.drawing-commandbar { display:flex; flex-wrap:nowrap; justify-content:start; gap:12px; min-height:35px; padding:2px 8px; background:var(--paper); border-bottom:1px solid var(--desk-line); }
.drawing-menu-bar { display:flex; align-items:center; gap:1px; flex:none; }
.drawing-workspace-menu,.drawing-studio .drawing-file-menu { position:relative; margin:0; }
.drawing-workspace-menu>summary,.drawing-studio .drawing-file-menu>summary { display:flex; align-items:center; min-height:30px; padding:4px 9px; font-size:12px; font-weight:500; list-style:none; border:0; background:transparent; border-radius:4px; cursor:pointer; }
.drawing-workspace-menu>summary::-webkit-details-marker,.drawing-file-menu>summary::-webkit-details-marker { display:none; }
.drawing-workspace-menu[open]>summary,.drawing-file-menu[open]>summary { background:var(--accent-soft); }
.drawing-workspace-menu>div { position:absolute; top:calc(100% + 4px); left:0; width:250px; z-index:65; padding:5px; display:grid; gap:1px; border:1px solid var(--line); border-radius:6px; background:var(--paper); box-shadow:0 7px 22px #17233824; }
.drawing-workspace-menu>div button { display:flex; align-items:center; justify-content:space-between; gap:16px; text-align:left; padding:7px 9px; min-height:32px; font-size:11px; border:0; border-radius:4px; }
.drawing-workspace-menu>div button:hover { background:var(--accent-soft); }
.drawing-workspace-menu>div button:disabled { opacity:.42; }
.drawing-workspace-menu kbd { font:10px var(--sans); color:var(--muted); white-space:nowrap; }
.drawing-studio .drawing-file-menu>div { left:0; right:auto; top:calc(100% + 4px); width:290px; z-index:65; padding:8px; gap:5px; }
.drawing-studio .drawing-file-menu>div .btn { min-height:34px; font-size:11px; padding:5px 7px; }
.drawing-studio .drawing-history { flex-wrap:nowrap; gap:4px; }
.drawing-studio .drawing-history .btn { min-height:29px; padding:3px 7px; font-size:10px; }
.drawing-studio .drawing-history [data-history-count] { font-size:10px; }
.drawing-studio .drawing-commandbar>[data-save-status] { margin-left:auto; min-width:0; max-width:45%; font-size:10px; line-height:1.4; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.drawing-options-strip { flex:none; height:43px; min-height:43px; min-width:0; border-bottom:1px solid var(--desk-line); background:var(--desk-chrome); }
.drawing-studio .drawing-tool-options { display:flex; align-items:center; flex-wrap:nowrap; height:42px; min-width:0; gap:12px; padding:4px 10px; border:0; border-radius:0; overflow-x:auto; overflow-y:hidden; scrollbar-width:thin; background:transparent; }
.drawing-option-title { flex:none; font-size:11px; min-width:44px; }
.drawing-studio .drawing-tool-options>label { display:flex; flex:none; gap:5px; height:32px; min-width:0; font-size:10px; white-space:nowrap; }
.drawing-studio .drawing-tool-options select { max-width:150px; min-height:29px; font-size:11px; flex:none; }
.drawing-studio .drawing-tool-options input[type=range] { width:70px; min-width:50px; flex:none; min-height:27px; }
.drawing-studio .drawing-tool-options input[type=color] { width:28px; height:28px; }
.drawing-studio [data-workspace-size] { width:48px; min-width:48px; height:29px; padding:3px 4px; border:1px solid var(--line); border-radius:4px; background:var(--paper); color:var(--ink); font:11px var(--sans); }
.drawing-studio .drawing-tool-options output { min-width:28px; font-size:10px; }
.drawing-studio .drawing-brush-settings { flex:none; position:static; margin:0; }
.drawing-studio .drawing-brush-settings>summary { font-size:11px; min-height:30px; display:flex; align-items:center; }
.drawing-studio .drawing-brush-settings>div { position:fixed; z-index:1250; width:270px; min-width:0!important; max-width:calc(100vw - 20px); max-height:55dvh; overflow:auto; padding:12px!important; gap:10px; }
.drawing-studio .drawing-brush-settings label { font-size:11px; }
.drawing-view-options { display:flex; flex:none; gap:5px; }
.drawing-view-options button { border:1px solid var(--line); min-height:29px; padding:4px 8px; border-radius:4px; font-size:11px; background:var(--paper); }
.drawing-studio .drawing-selection-bar { margin:0; height:42px; padding:4px 8px; border:0; background:transparent; overflow-x:auto; overflow-y:hidden; }
.drawing-studio .selection-tools,.drawing-studio .selection-transform { flex-wrap:nowrap; min-height:32px; width:max-content; }
.drawing-studio .drawing-selection-bar :is(button,select) { flex:none; min-height:30px; font-size:10px; padding:4px 6px; }
.drawing-studio .drawing-selection-bar>small { display:none; }
.drawing-studio .drawing-selection-bar[data-transforming=true] .selection-tools { display:none; }
.drawing-studio .drawing-selection-bar .selection-transform input[type=number] { height:29px; }
.drawing-options-strip [hidden],.map-options-strip [hidden] { display:none!important; }
.drawing-studio :is(.drawing-tool-options,.drawing-selection-bar,.map-options-strip) { scrollbar-width:none; }
.drawing-studio :is(.drawing-tool-options,.drawing-selection-bar,.map-options-strip)::-webkit-scrollbar { display:none; }
.drawing-studio>.drawing-editor { flex:1 1 0; min-height:250px; height:auto; grid-template-columns:46px minmax(0,1fr) 250px; grid-template-rows:minmax(0,1fr); border:0; position:relative; }
.drawing-studio .drawing-tools { grid-row:1; grid-column:1; flex-direction:column; padding:5px; gap:2px; background:var(--desk-chrome); border-right:1px solid var(--desk-line); overflow-x:hidden; overflow-y:auto; }
.drawing-studio .drawing-tools button { flex:0 0 31px; width:34px; min-width:34px; min-height:31px; padding:4px; border-radius:4px; }
.drawing-studio .drawing-tools svg { width:21px; height:21px; }
.drawing-studio .drawing-tools small { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.drawing-studio .drawing-tools [data-tool=brush],.drawing-studio .drawing-tools [data-tool=line],.drawing-studio .drawing-tools [data-tool=hand] { margin-top:5px; }
.drawing-studio .drawing-stage { grid-column:2; grid-row:1; min-width:0; min-height:0; background:var(--desk-stage); }
.drawing-studio .drawing-surface { box-shadow:0 2px 14px #17202d38; }
.drawing-studio .drawing-panels { grid-column:3; grid-row:1; display:flex; flex-direction:column; min-height:0; background:var(--paper); border-left:1px solid var(--desk-line); overflow:auto; }
.drawing-color-dock { flex:none; padding:9px 10px; border-bottom:1px solid var(--line); }
.drawing-color-dock header { font-size:11px; font-weight:600; margin-bottom:7px; }
.drawing-color-pair { display:flex; align-items:center; gap:5px; margin-bottom:8px; }
.drawing-color-pair button { width:26px; height:26px; flex:none; border:1px solid var(--line); border-radius:3px; font-size:11px; }
.drawing-color-pair svg { width:17px; height:17px; vertical-align:middle; }
.drawing-color-swatches { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:3px; }
.drawing-color-swatches button { background:var(--swatch); height:15px; border:1px solid #7a829255; border-radius:2px; }
.drawing-studio .drawing-panel-tabs { flex:none; }
.drawing-studio .drawing-panel-tabs button { min-height:34px; padding:6px 9px; font-size:11px; }
.drawing-studio [data-drawing-panel=layers] { flex:1; min-height:0; display:flex; flex-direction:column; padding:9px; }
.drawing-studio .drawing-layer-settings { gap:6px 9px; margin-bottom:7px; flex:none; }
.drawing-studio .drawing-layer-settings select { min-height:28px; padding:4px 6px; font-size:11px; }
.drawing-studio .drawing-layer-settings label { font-size:10px; min-height:24px; }
.drawing-studio .drawing-layer-settings input[type=range] { width:115px; }
.drawing-studio .drawing-layer-list { min-height:90px; flex:1; max-height:none; margin-bottom:7px; gap:1px; }
.drawing-studio .drawing-layer { min-height:44px; padding:4px; gap:6px; border-radius:3px; }
.drawing-studio .drawing-layer>button { padding:3px; min-width:22px; min-height:28px; }
.drawing-studio .drawing-layer svg { width:16px; height:16px; vertical-align:middle; }
.drawing-layer-preview { flex:none; width:40px; height:32px; border:1px solid var(--line); border-radius:2px; background:repeating-conic-gradient(#e5e7eb 0 25%,white 0 50%) 0/8px 8px; }
.drawing-studio .drawing-layer strong { font-size:11px; line-height:1.3; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.drawing-studio .drawing-layer small { font-size:9px; line-height:1.3; }
.drawing-studio .drawing-layer-actions { gap:4px; margin-bottom:7px; }
.drawing-studio .drawing-layer-actions .btn { min-height:29px; padding:4px 5px; font-size:10px; }
.drawing-studio .drawing-statusbar { min-height:34px; padding:3px 9px; gap:8px; border-top:1px solid var(--desk-line); background:var(--paper); font-size:10px; }
.drawing-studio .drawing-statusbar .btn { min-height:28px; padding:3px 7px; font-size:10px; }
.drawing-studio .drawing-statusbar .drawing-zoom-controls { margin-left:auto; }
.drawing-dock-toggle { width:28px; height:28px; flex:none; }
.drawing-dock-toggle svg { width:17px; height:17px; }
.drawing-studio.drawing-dock-collapsed>.drawing-editor { grid-template-columns:46px minmax(0,1fr); }
.drawing-studio.drawing-dock-collapsed .drawing-panels { display:none; }
.drawing-studio.drawing-focus-mode>.drawing-editor { grid-template-columns:minmax(0,1fr); }
.drawing-studio.drawing-focus-mode :is(.drawing-options-strip,.drawing-tools,.drawing-panels) { display:none; }
.drawing-studio.drawing-focus-mode .drawing-stage { grid-column:1; }
.drawing-studio.drawing-expanded[data-has-canvas] { height:100dvh; min-height:0; border:0; border-radius:0; padding:0; }
.drawing-studio.drawing-expanded .drawing-editor { min-height:0; }
@media(max-width:900px),(max-width:1000px) and (max-height:500px) {
 body:has(.drawing-studio[data-has-canvas]) #music-player { display:none; }
 .drawing-studio[data-has-canvas],.drawing-studio.drawing-expanded[data-has-canvas] { border:0; border-radius:0; padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left); height:100dvh; min-height:0; }
 .drawing-studio>.drawing-heading { min-height:33px; padding:3px 8px; gap:9px; }
 .drawing-studio .drawing-heading h1 { font-size:12px; }
 .drawing-studio>.drawing-participants { min-height:21px; padding:2px 8px; font-size:9px; }
 .drawing-studio>.drawing-canvas-tabs { min-height:33px; padding:1px 5px 0; }
 .drawing-studio .drawing-canvas-tab { max-width:210px; }
 .drawing-studio .drawing-canvas-tab>a { min-height:30px; padding:4px 8px; }
 .drawing-studio .drawing-canvas-tab>button { min-width:30px; min-height:30px; }
 .drawing-studio>.drawing-commandbar { min-height:33px; gap:4px; padding:1px 5px; }
 .drawing-menu-bar { gap:0; }
 .drawing-workspace-menu>summary,.drawing-studio .drawing-file-menu>summary { font-size:11px; min-height:31px; padding:4px 7px; }
 .drawing-studio .drawing-history { gap:2px; margin-left:auto; }
 .drawing-studio .drawing-history .btn { min-height:30px; font-size:0; padding:2px 8px; border:0; }
 .drawing-studio .drawing-history .btn>span { font-size:23px; }
 .drawing-studio .drawing-history [data-history-count] { font-size:9px; }
 .drawing-studio .drawing-commandbar>[data-save-status] { max-width:70px; font-size:9px; margin-left:4px; }
 .drawing-studio .drawing-workspace-menu>div { width:230px; }
 .drawing-studio .drawing-workspace-menu>div button { min-height:39px; font-size:12px; }
 .drawing-studio .drawing-options-strip { height:42px; min-height:42px; }
 .drawing-studio .drawing-tool-options { height:41px; gap:10px; padding:3px 8px; }
 .drawing-studio .drawing-tool-options select { min-height:32px; font-size:12px; max-width:135px; }
 .drawing-studio .drawing-tool-options input[type=range] { width:72px; min-height:32px; }
 .drawing-studio .drawing-tool-options input[type=color] { height:30px; width:30px; }
 .drawing-studio .drawing-tool-options>label { height:33px; }
 .drawing-studio .drawing-brush-settings>summary { min-height:33px; }
 .drawing-studio .drawing-selection-bar { height:41px; padding:3px 7px; }
 .drawing-studio .drawing-selection-bar :is(button,select) { min-height:33px; }
 .drawing-studio>.drawing-editor { min-height:120px; grid-template-columns:41px minmax(0,1fr); grid-template-rows:minmax(0,1fr); }
 .drawing-studio .drawing-tools { padding:4px 3px; grid-column:1; grid-row:1; border-bottom:0; flex-direction:column; overflow-y:auto; overflow-x:hidden; }
 .drawing-studio .drawing-tools button { flex:0 0 36px; min-width:34px; width:34px; min-height:36px; }
 .drawing-studio .drawing-stage { grid-column:2; grid-row:1; }
 .drawing-studio .drawing-panels { display:none; position:absolute; inset:auto 0 0; width:100%; max-height:min(70dvh,100%); z-index:25; border-top:1px solid var(--line); border-left:0; border-radius:10px 10px 0 0; }
 .drawing-studio.drawing-panel-open .drawing-panels { display:flex; }
 .drawing-studio .drawing-color-dock { display:none; }
 .drawing-studio .drawing-panel-tabs button { min-height:40px; font-size:12px; }
 .drawing-studio .drawing-layer-list { flex:none; max-height:160px; }
 .drawing-studio .drawing-layer { min-height:47px; }
 .drawing-studio .drawing-layer-settings label { min-height:30px; }
 .drawing-studio .drawing-layer-settings select { min-height:35px; font-size:14px; }
 .drawing-studio .drawing-layer-actions .btn { min-height:35px; font-size:11px; }
 .drawing-studio .drawing-statusbar { min-height:40px; padding:2px 5px; gap:4px; }
 .drawing-studio .drawing-statusbar .btn { min-height:35px; padding:4px 7px; font-size:10px; }
 .drawing-studio .drawing-panel-toggles { display:flex; gap:2px!important; }
 .drawing-studio .drawing-fullscreen-toggle { min-width:34px; }
 .drawing-studio .drawing-dock-toggle { display:none; }
 .drawing-studio .drawing-touch-hint { font-size:9px; padding:3px 6px; }
 .drawing-studio.drawing-focus-mode .drawing-stage { grid-column:1; }
 .drawing-studio.drawing-focus-mode>.drawing-editor { grid-template-columns:minmax(0,1fr); }
}
@media(max-width:360px) { .drawing-studio .drawing-commandbar>[data-save-status] { max-width:40px; } }

/* The map uses the same one-row, contextual options contract. */
.map-options-strip { display:flex; align-items:center; flex:none; gap:12px; min-width:0; height:43px; padding:4px 10px; overflow-x:auto; overflow-y:hidden; border:1px solid var(--line); border-bottom:0; background:var(--paper); font-size:11px; }
.map-options-strip>strong { flex:none; white-space:nowrap; min-width:40px; }
.map-options-strip>label,.map-options-strip>div:not(.drawing-selection-bar),.map-options-strip .map-option-pair { display:flex; align-items:center; flex:none; gap:10px; width:auto; }
.map-options-strip label { display:flex; align-items:center; flex:none; gap:5px; white-space:nowrap; font-size:10px; }
.map-options-strip input[type=range] { width:100px; min-width:75px; }
.map-options-strip input[type=color] { width:28px; height:28px; padding:2px; border:1px solid var(--line); }
.map-options-strip input[type=number] { width:49px; height:29px; font-size:12px; }
.map-options-strip select { min-height:29px; max-width:170px; font-size:11px; background:var(--paper); color:var(--ink); border:1px solid var(--line); }
.map-options-strip .drawing-selection-bar { border:0; padding:0; height:34px; }
.map-options-strip .selection-tools,.map-options-strip .selection-transform { flex-wrap:nowrap; width:max-content; }
.map-options-strip .drawing-selection-bar>small { display:none; }
.map-options-strip .map-quick-inactive { display:none!important; }
@media(max-width:900px) {
 .map-options-strip { height:42px; min-height:42px; padding:3px 8px; gap:10px; }
 .map-options-strip :is(input,select,button) { min-height:32px; }
 .map-options-strip .drawing-selection-bar :is(button,select) { min-height:33px; }
 .drawing-map-workspace .map-commandbar { padding-inline:2px; }
}
.drawing-studio .map-editor { flex:1 1 0; min-height:240px; height:auto; grid-template-columns:46px minmax(0,1fr) 254px; border-width:0; border-top:1px solid var(--line); border-radius:0; }
.drawing-studio .map-stage { grid-column:2; grid-row:1; }
.drawing-studio .map-panel { grid-column:3; grid-row:1; }
.map-tool-rail { grid-column:1; grid-row:1; flex-direction:column; margin:0; padding:4px; overflow-x:hidden; overflow-y:auto; border-right:1px solid var(--line); background:var(--desk-chrome); gap:2px; }
.drawing-studio .map-tool-rail button { min-width:35px; width:35px; min-height:32px; padding:5px; border-color:transparent; background:transparent; flex:none; border-radius:4px; }
.drawing-studio .map-tool-rail button.active { background:var(--accent-soft); color:var(--accent); border-color:var(--line); }
.map-tool-rail svg { width:22px; height:22px; display:block; }
.map-tool-rail button>span { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
.drawing-studio .map-commandbar { padding:4px 9px; min-height:36px; gap:6px; }
.drawing-studio .map-commandbar button { font-size:11px; min-height:29px; }
.drawing-studio .map-statusbar { min-height:34px; padding:3px 9px; }
.map-options-strip [data-map-text-options] { gap:12px; }
.map-options-strip [data-map-text-options] input:not([type=number]) { width:150px; min-height:29px; border:1px solid var(--line); padding:3px 6px; background:var(--paper); color:var(--ink); }
@media(max-width:900px),(max-width:1000px) and (max-height:500px) {
 .drawing-studio .drawing-tool-options select,.drawing-studio [data-workspace-size],.drawing-studio .drawing-layer-settings select,.map-options-strip input[type=number],.map-options-strip input[type=text],.map-options-strip select,.map-panel input:not([type=range]):not([type=color]):not([type=checkbox]),.map-panel select { font-size:16px; }
 .drawing-studio .map-editor { min-height:120px; grid-template-columns:41px minmax(0,1fr); }
 .map-tool-rail { padding:4px 3px; }
 .drawing-studio .map-tool-rail button { min-height:36px; min-width:34px; width:34px; }
 .drawing-studio .map-panel { grid-column:auto; grid-row:auto; }
 .drawing-studio .map-commandbar { min-height:35px; padding:2px 5px; }
 .drawing-studio .map-commandbar>span { order:0; width:auto; min-width:0; flex:1; font-size:9px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
 .drawing-studio .map-commandbar>div { flex:none; }
 .drawing-studio .map-commandbar button { min-height:31px; font-size:10px; }
 .drawing-studio .map-statusbar { min-height:38px; padding:3px 6px; }
}