/* Optional layouts. Classic styling and existing theme tokens remain available. */
.layout-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:18px}
.layout-option{display:flex;flex-direction:column;align-items:stretch;gap:12px;text-align:left;white-space:normal;padding:18px;background:var(--panel);color:var(--text);border:1px solid var(--border);border-radius:12px;min-width:0}
.layout-option>span:last-child{font-size:13px;color:var(--muted);line-height:1.6}
.layout-option.selected{outline:2px solid var(--forest);outline-offset:1px;background:var(--sage)}
.layout-mini{display:grid;grid-template-columns:22px minmax(0,1fr);gap:7px;height:70px;background:var(--bg);padding:9px;border-radius:7px;border:1px solid var(--border)}
.layout-mini>i{background:var(--sidebar);border-radius:3px}
.layout-mini>span{display:grid;grid-template-columns:1.5fr 1fr;gap:5px}
.layout-mini b{display:block;background:var(--border);border-radius:3px}.layout-mini b:first-child{grid-column:1/-1;height:9px;background:var(--forest)}
.layout-mini-community>span{grid-template-columns:1fr 1fr}.layout-mini-classic>span{grid-template-columns:1fr}.layout-mini-classic b:first-child{grid-column:auto}
.layout-settings .panel-head{padding:0;border:0}.layout-settings{margin-bottom:24px}
.layout-modern{grid-template-columns:210px minmax(0,1fr)}
.layout-modern .sidebar{width:210px;background:var(--sidebar);padding:26px 16px 18px;border-right:1px solid var(--border)}
.layout-modern .workspace{background:var(--bg);min-width:0}
.layout-modern .brand{margin-bottom:30px}.layout-modern .brand-logo{width:42px;height:42px}.layout-modern .brand em{letter-spacing:0;text-transform:none;font-size:12px}
.layout-modern .nav button{display:flex;gap:10px;align-items:center;padding:12px 11px;min-height:44px;white-space:normal;text-align:left}
.layout-modern .nav button.active{background:var(--sage);box-shadow:inset 3px 0 var(--forest);color:var(--text)}
.layout-modern .nav-icon{width:19px;flex-shrink:0;text-align:center;font-size:17px}
.layout-modern .sidebar-bottom{display:grid;gap:12px;align-items:stretch;padding-top:20px}.layout-modern .sidebar-bottom .nav{display:block}
.layout-account{display:flex;align-items:center;gap:8px;font-size:12px;min-width:0}.layout-account>span:nth-child(2){flex:1;overflow-wrap:anywhere}
.layout-modern .topbar{padding:16px 28px;gap:12px;position:relative;z-index:12}.layout-modern .top-right{display:flex;align-items:center;gap:8px}
.layout-modern .content{padding:30px;max-width:1450px;margin:0 auto;width:100%;min-width:0}
.layout-modern .page-head{margin-bottom:26px}.layout-modern .page-head h1{font-family:Georgia,serif;font-size:31px;font-weight:500}.layout-modern .page-head .intro{font-size:14px}
.layout-modern .view-switch{margin:0}.layout-modern .view-switch button{min-width:0}
.layout-management{position:relative}.layout-management>summary{padding:8px 12px;cursor:pointer;border:1px solid var(--border);border-radius:8px;font-size:13px;list-style:none}
.layout-management[open]>div{position:absolute;right:0;top:calc(100% + 9px);background:var(--panel);padding:12px;border:1px solid var(--border);border-radius:10px;box-shadow:var(--forest-shadow);min-width:245px;z-index:30}
.layout-more{margin-top:18px}.layout-more>summary{cursor:pointer;padding:10px 0;color:var(--muted);font-size:13px}.layout-more .nav{margin-top:7px}
.layout-current-page{font-size:12px;color:var(--muted)}.layout-subnav{margin-bottom:22px}
.layout-home-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(240px,1fr);gap:28px}
.layout-home-grid>section,.layout-home-aside{min-width:0}.layout-home-grid .section-head{margin:0 0 14px;align-items:center}.layout-home-grid .section-head h2{font-size:17px}
.layout-event{padding:21px;margin-bottom:14px}.layout-event.layout-own-event{border-top:3px solid var(--forest)}
.layout-event-meta{color:var(--muted);font-size:12px;margin-bottom:8px}.layout-event h3{font-size:17px;margin:0 0 6px}
.layout-event-actions{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:21px}.layout-event-actions>span{font-size:12px;color:var(--muted)}
.layout-home-aside{display:grid;gap:24px;align-content:start}.layout-home-aside>section+section{border-top:1px solid var(--border);padding-top:23px}.layout-home-aside h2{font-size:17px;margin:0 0 13px}.layout-home-aside h3{font-size:15px;margin:0 0 4px}
.layout-guild,.layout-main-character{display:flex;gap:12px;align-items:center;margin:13px 0}.layout-guild>div,.layout-main-character>div{min-width:0;overflow-wrap:anywhere}
.layout-guild-mark{width:42px;height:42px;flex-shrink:0;display:grid;place-items:center;border-radius:9px;background:var(--sage);color:var(--forest);font-family:Georgia,serif;font-size:22px}
.layout-main-character>.custom-emoji{width:30px;height:30px}.layout-discovery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.layout-discovery-grid .layout-event{margin:0 0 20px}
.layout-bottom-nav{display:none}.layout-welcome{margin-bottom:24px}
/* Keep the personal desktop start page within the viewport; lists retain their own scroll space. */
@media(min-width:901px) and (min-height:600px){
 .layout-home-screen{height:100dvh;min-height:0}
 .layout-home-screen .workspace{height:100%;min-height:0;display:flex;flex-direction:column;overflow:hidden}
 .layout-home-screen .topbar{flex:none}
 .layout-home-screen .content{flex:1;min-height:0;display:flex;flex-direction:column;padding:22px 30px 16px;overflow:hidden}
 .layout-home-screen .page-head{flex:none;margin-bottom:18px}
 .layout-home-screen .layout-welcome{flex:none;margin-bottom:18px;padding:16px 20px}
 .layout-home-screen .layout-welcome p{margin:8px 0 12px}
 .layout-home-screen .layout-home-grid{flex:1;min-height:0;gap:24px}
 .layout-home-screen .layout-home-groups,.layout-home-screen .layout-home-aside{min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;padding:4px 8px 5px 4px}
 .layout-home-screen .layout-home-aside{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-content:start}
 .layout-home-screen .layout-home-aside>section+section{border:0;padding-top:0}
 .layout-home-screen .layout-home-aside>section:nth-child(3){grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:14px;border-top:1px solid var(--border);padding-top:16px}
 .layout-home-screen .layout-home-aside>section:nth-child(3)>h2,.layout-home-screen .layout-home-aside>section:nth-child(3)>button{grid-column:1/-1;justify-self:start}
 .layout-home-screen .layout-home-aside h2{font-size:16px;margin-bottom:10px}
 .layout-home-screen .layout-guild,.layout-home-screen .layout-main-character{margin:10px 0}
 .layout-home-screen .layout-guild p,.layout-home-screen .layout-main-character p{margin:4px 0}
 .layout-home-screen .layout-home-aside>.layout-more{grid-column:1/-1;margin-top:0}
 .layout-home-screen .layout-event{padding:14px;margin-bottom:10px}
 .layout-home-screen .layout-event .hint{margin:6px 0}
 .layout-home-screen .layout-event-actions{margin-top:10px}
 .layout-home-screen .footer{flex:none;align-items:center;flex-wrap:wrap;gap:8px 16px;margin-top:14px}
 .layout-home-screen .layout-home-groups:focus-visible,.layout-home-screen .layout-home-aside:focus-visible{outline:2px solid var(--forest);outline-offset:-2px;border-radius:8px}
}
@media(max-width:1100px){.layout-modern{grid-template-columns:185px minmax(0,1fr)}.layout-modern .sidebar{width:185px}.layout-modern .content{padding:24px}.layout-home-grid{grid-template-columns:minmax(0,1.35fr) minmax(220px,1fr);gap:20px}.layout-discovery-grid{grid-template-columns:1fr}.layout-options{gap:11px}.layout-option{padding:14px}}
@media(max-width:900px){.layout-home-grid{grid-template-columns:1fr}.layout-home-aside{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.layout-home-aside>section+section{border-top:0;padding-top:0}.layout-home-aside>.layout-more{grid-column:1/-1}}
@media(max-width:760px){
 .layout-modern{display:block}.layout-modern .topbar{padding:12px 16px}.layout-current-page{display:none}.layout-modern .content{padding:22px 16px 100px}.layout-modern .page-head h1{font-size:27px}
 .layout-modern .sidebar{width:min(320px,calc(100vw - 48px));padding:20px 16px}.layout-modern .sidebar .brand{margin-bottom:20px}.layout-modern .sidebar-bottom{display:grid}.layout-modern .layout-home-aside{grid-template-columns:1fr}
 .layout-modern .layout-bottom-nav{position:fixed;bottom:0;left:0;right:0;z-index:15;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:2px;background:var(--sidebar);border-top:1px solid var(--border);padding:7px 5px calc(7px + env(safe-area-inset-bottom,0px))}
 .layout-bottom-nav button{border:0;background:transparent;color:var(--muted);border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:11px;padding:7px 0;min-width:0;min-height:49px}
 .layout-bottom-nav button.active{background:var(--sage);color:var(--text)}.layout-bottom-nav .nav-icon{font-size:19px;line-height:1.1}
 .layout-options{grid-template-columns:1fr}.layout-option{display:grid;grid-template-columns:90px minmax(0,1fr);gap:8px 15px}.layout-option .layout-mini{grid-row:1/3}.layout-option>strong{align-self:end}.layout-option>span:last-child{grid-column:2}.layout-modern .layout-management .view-switch{display:flex;flex-wrap:wrap}
 .layout-management[open]>div{min-width:220px}.layout-event{padding:18px}.layout-modern .top-right{gap:6px}.layout-modern .preview{display:none}
}