/* Original composition remains the default until a user customizes it. */
.official-layout-bar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:0 20px 10px;font:11px var(--mono);color:var(--muted)}
.official-layout-bar button,.official-card-tools button{font:inherit;color:var(--muted);background:var(--panel);border:1px solid var(--border);border-radius:4px;padding:4px 7px;cursor:pointer}
.official-layout-bar button:hover,.official-card-tools button:hover{color:var(--accent);border-color:var(--accent)}
.official-layout-bar button:disabled{opacity:.45;cursor:default}
[data-official-card]{position:relative}
.official-card-tools{display:none;position:absolute;z-index:25;right:6px;top:5px;gap:3px;background:var(--panel);border-radius:5px;padding:2px}
.official-layout-edit .official-card-tools{display:flex}
.official-card-tools button{touch-action:none;font-size:12px}
.official-custom-grid{display:grid!important;grid-template-columns:repeat(12,minmax(0,1fr))!important;grid-template-areas:none!important;grid-template-rows:none!important;gap:12px!important}
.official-custom-grid > :not(.official-custom-card){grid-column:1/-1}
.official-custom-grid > .official-custom-card{grid-area:auto!important;grid-column:span var(--official-width)!important;height:var(--official-height)!important;min-height:0!important;max-height:none!important;order:var(--official-order);overflow:auto!important;min-width:0}
.official-detached .official-detached-path{display:block!important;width:100%!important;padding:0!important}
.official-detached .official-detached-path > :not(.official-detached-path):not(.official-detached-target):not(script):not(link){display:none!important}
.official-detached .official-detached-target{display:block!important;width:100%!important;max-width:none!important;min-height:70vh;height:auto!important}
.official-detached .official-return{min-height:0;padding:12px;font:12px var(--mono);color:var(--accent)}
@media(max-width:700px){.official-custom-grid > .official-custom-card{grid-column:1/-1!important}.official-layout-bar{padding:0 10px 10px}}
body.official-detached > :not(.official-detached-path):not(.official-detached-target):not(script):not(link){display:none!important}
.official-layout-bar a{color:var(--muted);text-decoration:none;padding:4px}
.official-layout-bar a:hover{color:var(--accent)}