/* Módulo Gramática — estrutura e navegação isoladas */
.grammar-panel{display:none;width:100%;min-height:100vh;}
.grammar-panel.active{display:block;}
.grammar-shell{width:100%;max-width:920px;margin:0 auto;padding:calc(16px + env(safe-area-inset-top)) 16px calc(26px + env(safe-area-inset-bottom));}
.grammar-header{position:sticky;top:0;z-index:25;display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:10px 0 16px;background:rgba(245,245,247,.94);backdrop-filter:saturate(180%) blur(18px);-webkit-backdrop-filter:saturate(180%) blur(18px);}
.grammar-header h1{margin:0;font-size:clamp(25px,5vw,34px);line-height:1.1;}
.grammar-header p{margin:7px 0 0;color:#6e6e73;font-size:14px;}
.grammar-close{white-space:nowrap;}
.grammar-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:12px 0;}
.grammar-card{appearance:none;-webkit-appearance:none;border:1px solid #e5e5ea;border-radius:20px;background:#fff;color:#1d1d1f;min-height:190px;padding:24px 18px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:10px;cursor:pointer;box-shadow:0 4px 16px rgba(0,0,0,.045);transition:transform .16s ease,box-shadow .22s ease,border-color .22s ease,background-color .22s ease;touch-action:manipulation;}
.grammar-card:active{transform:scale(.975);}
@media(hover:hover) and (pointer:fine){.grammar-card:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(0,0,0,.08);}}
.grammar-card-icon{font-size:48px;line-height:1;}
.grammar-card-title{font-size:21px;font-weight:800;}
.grammar-card-note{font-size:13px;line-height:1.4;color:#6e6e73;max-width:220px;}
.grammar-module-view{padding-top:12px;}
.grammar-module-back{margin-bottom:18px;}
.grammar-placeholder{min-height:320px;border:1px solid #e5e5ea;border-radius:22px;background:#fff;padding:38px 20px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;box-shadow:0 4px 16px rgba(0,0,0,.04);}
.grammar-placeholder-icon{font-size:58px;line-height:1;}
.grammar-placeholder h2{font-size:26px;margin:14px 0 8px;}
.grammar-placeholder p{margin:0;color:#6e6e73;}
body.grammar-page-open{overflow-x:hidden;}
body.grammar-page-open .container{max-width:none;width:100%;padding:0;}
body.manual-dark .grammar-header{background:rgba(0,0,0,.88);}
body.manual-dark .grammar-header p,body.manual-dark .grammar-card-note,body.manual-dark .grammar-placeholder p{color:#aeaeb2;}
body.manual-dark .grammar-card,body.manual-dark .grammar-placeholder{background:#1c1c1e;color:#f5f5f7;border-color:#3a3a3c;}
@media(prefers-color-scheme:dark){
 body:not(.manual-light) .grammar-header{background:rgba(0,0,0,.88);}
 body:not(.manual-light) .grammar-header p,body:not(.manual-light) .grammar-card-note,body:not(.manual-light) .grammar-placeholder p{color:#aeaeb2;}
 body:not(.manual-light) .grammar-card,body:not(.manual-light) .grammar-placeholder{background:#1c1c1e;color:#f5f5f7;border-color:#3a3a3c;}
}
@media(max-width:700px){.grammar-grid{grid-template-columns:1fr;}.grammar-card{min-height:132px;flex-direction:row;text-align:left;justify-content:flex-start;padding:20px;}.grammar-card-icon{font-size:42px}.grammar-card-note{max-width:none}.grammar-card-title,.grammar-card-note{display:block}.grammar-card-title{font-size:20px}}
@media(max-width:430px){.grammar-shell{padding:calc(10px + env(safe-area-inset-top)) 10px calc(18px + env(safe-area-inset-bottom));}.grammar-header{padding-top:6px}.grammar-card{border-radius:17px;min-height:118px;padding:17px 15px}.grammar-card-icon{font-size:38px}.grammar-placeholder{min-height:280px}}

/* Romaji abaixo de todo texto japonês nos cartões da Gramática. */
.grammar-inline-romaji{display:block;margin-top:4px;font-style:normal;font-size:.88rem;line-height:1.25;color:#5b6472;font-weight:500;letter-spacing:.01em}
body.dark .grammar-inline-romaji{color:#b8c1ce}