/* Menu panels retain a visible, global save action at every viewport size. */
#grim-options-screen{padding:max(8px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));overflow:hidden}
#grim-options-screen .gwo-shell{width:min(1440px,100%);height:min(860px,100%);min-height:0;grid-template-columns:180px minmax(0,1fr) 220px;grid-template-rows:88px minmax(0,1fr) 76px}
#grim-options-screen .gwo-header{grid-column:2/4;padding:16px 76px 0 24px;overflow:visible}
#grim-options-screen .gwo-header h2{font-size:clamp(2rem,3.4vw,3.2rem);line-height:1}
#grim-options-screen .gwo-header small{font-size:.66rem;letter-spacing:.16em}
#grim-options-screen .gwo-title-rule{left:24px;right:76px;bottom:8px}
#grim-options-screen .gwo-nav{min-height:0;overflow:auto;padding:4px 0 8px 8px!important}
#grim-options-screen .gwo-nav button{min-height:44px;flex-shrink:0;padding:0 12px;font-size:.88rem}
#grim-options-screen .gwo-content{margin:8px 12px 12px;scrollbar-color:#777 #0b0b0b;overscroll-behavior:contain}
#grim-options-screen .gwo-pane{min-height:0;padding:12px}
#grim-options-screen .gwo-row{grid-template-columns:minmax(0,1fr) minmax(170px,48%);min-height:48px;gap:12px;padding:6px 4px}
#grim-options-screen .gwo-stepper button{height:40px}
#grim-options-screen .gwo-side{margin:8px 12px 12px 0}
#grim-options-screen .gwo-save-bar{padding:12px 18px;display:flex;gap:12px;min-width:0;background:#080808;letter-spacing:0;grid-row:3}
#gwo-save-status{flex:1;min-width:0;margin:0;color:#ccc;font:400 .8rem/1.3 system-ui,sans-serif}
#gwo-save,#gwo-back,#gwo-unsaved button{min-height:44px;padding:10px 18px;color:#eee;border:1px solid #777;background:#111;font:600 .78rem/1.2 system-ui,sans-serif;letter-spacing:.06em;cursor:pointer}
#gwo-save,#gwo-unsaved [data-settings-save]{border-color:#b63e43;background:#68151a}
#gwo-save:disabled{border-color:#454545;background:#1b1b1b;color:#929292;cursor:default}
#gwo-save:hover:not(:disabled),#gwo-unsaved [data-settings-save]:hover{background:#932229}
#gwo-back:hover,#gwo-unsaved button:hover{border-color:#eee}
#gwo-save:focus-visible,#gwo-back:focus-visible,#gwo-unsaved button:focus-visible{outline:2px solid #eee;outline-offset:3px}
#gwo-unsaved{width:min(540px,calc(100vw - 32px));max-height:calc(100dvh - 32px);padding:28px;border:1px solid #888;color:#eee;background:#090909;box-shadow:0 20px 70px #000;overflow:auto}
#gwo-unsaved::backdrop{background:rgba(0,0,0,.82)}
#gwo-unsaved h2{margin:0 0 14px;padding:0 0 14px;border-bottom:1px solid #777;color:#eee!important;font:400 clamp(1.45rem,4vw,2rem)/1.15 Georgia,serif;text-shadow:none}
#gwo-unsaved::before{border-color:#555}
#gwo-unsaved::after{color:#aaa}
#gwo-unsaved p{font:400 .9rem/1.5 system-ui,sans-serif;color:#ccc}
.gwo-confirm-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.gwo-confirm-actions button{flex:1 1 130px}
#gwo-unsaved .gwo-confirm-status:empty{display:none}
/* Slot titles and actions are separate rows. Only cards scroll on small screens. */
#grim-slot-screen{overflow:hidden;padding:max(12px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}
#grim-slot-screen .gss-shell{width:min(1420px,100%);height:100%;min-height:0;padding:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto;row-gap:16px}
#grim-slot-screen .gss-header{align-items:center;margin:0;padding:8px 0;min-height:0}
#grim-slot-screen .gss-header h2{font-size:clamp(1.8rem,4.2vw,4rem);line-height:1.1;flex-shrink:1;overflow-wrap:anywhere}
#grim-slot-screen .gss-header__line{margin:0}
#grim-slot-screen .gss-cards{overflow:auto;overscroll-behavior:contain;align-items:center;padding:2px 1px;min-height:0;scrollbar-width:thin;gap:22px}
#grim-slot-screen .gss-card{height:min(560px,100%);min-height:0;transform:none}
#grim-slot-screen .gss-card__inner{min-height:0;padding:14px 16px}
#grim-slot-screen .gss-card--filled .gss-card__inner{grid-template-rows:34px minmax(50px,1fr) 68px 12px 32px 48px}
#grim-slot-screen .gss-card--empty .gss-card__inner{grid-template-rows:34px minmax(0,1fr) 48px}
#grim-slot-screen .gss-card__number{font-size:2rem}
#grim-slot-screen .gss-card__chapter{font-size:clamp(.85rem,1.2vw,1.2rem)}
#grim-slot-screen .gss-card__button{height:48px;min-height:44px}
#grim-slot-screen .gss-actions{padding:0;min-height:48px}
#grim-slot-screen .gss-delete,#grim-slot-screen .gss-back{min-height:48px}
@media(max-width:1080px){
 #grim-options-screen .gwo-shell{grid-template-columns:170px minmax(0,1fr)}
 #grim-options-screen .gwo-header{grid-column:2}
 #grim-options-screen .gwo-side{display:none}
 #grim-options-screen .gwo-save-bar{grid-column:1/3}
}
@media(max-width:860px){
 #grim-options-screen .gwo-shell{grid-template-columns:minmax(0,1fr);grid-template-rows:76px 50px minmax(0,1fr) auto}
 #grim-options-screen .gwo-header{grid-column:1;grid-row:1;padding:12px 66px 0 14px}
 #grim-options-screen .gwo-header h2{font-size:2rem}
 #grim-options-screen .gwo-header small{font-size:.54rem;letter-spacing:.1em}
 #grim-options-screen .gwo-title-rule{left:14px;right:66px}
 #grim-options-screen .gwo-nav{grid-column:1;grid-row:2;flex-direction:row;padding:0 6px!important;overflow:auto;border-right:0}
 #grim-options-screen .gwo-nav button{min-width:112px;height:44px}
 #grim-options-screen .gwo-content{grid-column:1;grid-row:3;margin:8px;overflow:auto}
 #grim-options-screen .gwo-row{grid-template-columns:minmax(0,1fr);gap:7px;padding:9px 4px}
 #grim-options-screen .gwo-save-bar{grid-column:1;grid-row:4;padding:10px;gap:8px;flex-wrap:wrap}
 #gwo-save-status{flex-basis:100%;font-size:.74rem}
 #gwo-back{flex:0 0 auto}
 #gwo-save{flex:1}
}
@media(max-width:940px){
 #grim-slot-screen .gss-cards{grid-template-columns:1fr;align-items:start;gap:14px}
 #grim-slot-screen .gss-card{height:390px;min-height:390px}
 #grim-slot-screen .gss-actions{justify-content:space-between}
}
@media(max-height:560px){
 #grim-options-screen .gwo-shell{grid-template-rows:66px minmax(0,1fr) 62px}
 #grim-options-screen .gwo-header{padding-top:8px}
 #grim-options-screen .gwo-header h2{font-size:2rem}
 #grim-options-screen .gwo-header small{margin-bottom:4px}
 #grim-options-screen .gwo-save-bar{padding:8px 12px}
 #grim-slot-screen .gss-shell{row-gap:8px}
 #grim-slot-screen .gss-header{padding:2px 0}
 #grim-slot-screen .gss-header h2{font-size:1.8rem}
 #grim-slot-screen .gss-card--filled .gss-card__inner{grid-template-rows:26px minmax(36px,1fr) 48px 8px 26px 44px}
 #grim-slot-screen .gss-card__inner{padding:8px 12px}
 #grim-slot-screen .gss-card__number{font-size:1.4rem}
 #grim-slot-screen .gss-empty{gap:14px;padding:4px}
 #grim-slot-screen .gss-empty__mark{width:60px;height:60px}
 #grim-slot-screen .gss-empty__label{font-size:1.5rem}
 #grim-slot-screen .gss-back kbd{height:40px;min-width:40px}
}
@media(max-height:560px) and (max-width:860px){
 #grim-options-screen .gwo-shell{grid-template-rows:64px 44px minmax(0,1fr) 62px}
 #gwo-save-status{flex-basis:auto;flex:1;font-size:.7rem}
 #gwo-save,#gwo-back{flex:0 0 auto;padding:8px 10px;font-size:.7rem}
}