/* MANABINOWA: CORE layout, four learning colors, full regular functionality. */
:root{--navy:#102b59;--ink:#172e51;--red:#bf263e;--blue:#2874ac;--green:#28714e;--gold:#9b6b10;--line:#dce4ed;--stage:#bf263e;--stage-soft:#fff1f3}
body.core-edition{background:#f4f7fb;color:var(--ink);font-family:system-ui,-apple-system,"Noto Sans JP",sans-serif}
body[data-stage="2"]{--stage:#2874ac;--stage-soft:#edf6fc}body[data-stage="3"]{--stage:#28714e;--stage-soft:#eff8f2}body[data-stage="4"]{--stage:#9b6b10;--stage-soft:#fff8e6}
body.core-edition .top{grid-template-columns:minmax(0,1fr) minmax(360px,440px);padding:28px;border:1px solid var(--line);box-shadow:0 8px 30px #102b5907;background:#fff}
html body.core-edition .logo-mark{width:90px;height:90px;min-width:90px;border-radius:0}
.mn-brand-name{font-size:clamp(20px,2.6vw,30px);font-weight:800;letter-spacing:.045em;line-height:1.2;color:var(--navy)}
.mn-brand-subtitle{font-size:14px;margin:9px 0 3px;color:#5a6d83}
body.core-edition .mn-brand #aboutButton{font-size:12px;min-height:36px;color:#5a6d83;padding:4px 0}
body.core-edition #topControls{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:44px 48px 56px 48px;gap:10px}
.mn-select-wrap{position:relative;min-width:0;height:48px;border-radius:11px}
.mn-select-wrap[data-control=practiceMode]{grid-area:2/1;color:#a92237;background:#fff3f5}
.mn-select-wrap[data-control=headerLevel]{grid-area:2/2;color:#805812;background:#fff9eb}
body.core-edition #topControls .mn-select-wrap select{position:relative;z-index:1;display:block;width:100%;height:48px;color:transparent!important;text-shadow:none!important;background:transparent!important;font-size:16px!important;cursor:pointer}
.mn-select-wrap select option{color:#172e51;background:white;font-size:16px}
.mn-select-label{position:absolute;z-index:2;inset:0 28px 0 12px;display:block;line-height:48px;font-size:15px;font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}
.mn-select-wrap:after{content:"⌄";position:absolute;right:10px;top:12px;pointer-events:none}
body.core-edition #topControls .banner-learning-tools{gap:10px}
body.core-edition .goal-split,body.core-edition .bank-tools-v50{height:56px}
body.core-edition #topControls .goal-split{background:#fff5e1;border-color:#e8d7ac}
body.core-edition #topControls .bank-tools-v50{background:#edf7f0!important;border-color:#cbded1!important}
body.core-edition #topControls #goalsButton,body.core-edition #topControls #wordBankButton{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;gap:3px 5px;font-size:15px!important;line-height:1.25;padding:7px 4px}
body.core-edition #goalsButton>.core-icon{grid-row:1;grid-column:1;color:#906518}
body.core-edition #goalsButton>span:not(.goal-count){grid-row:1;grid-column:2;white-space:nowrap}
body.core-edition #topControls #wordBankButton .bank-label{grid-column:1/3;grid-row:1;gap:4px;min-width:0}
body.core-edition #topControls #goalCount,body.core-edition #topControls #wordBankCount{display:block!important;grid-column:1/3;grid-row:2;font-size:12px;line-height:1;min-height:12px;text-align:center}
body.core-edition #topControls #goalCameraButton,body.core-edition #topControls #ideaTrainerButton{flex:0 0 44px;width:44px;border-left:1px solid #102b5912!important;border-radius:0;min-width:44px}
body.core-edition #topControls #goalCameraButton{color:#906518!important}body.core-edition #topControls #ideaTrainerButton{color:#28714e!important}
body.core-edition #topControls #manabiNoteButton,body.core-edition #topControls #learningNoteButton{background:#eff4fb!important;border-color:#d1deef!important;color:#234f81!important}
body.core-edition #topControls #manabiNoteButton{font-size:16px!important;min-width:0}
body.core-edition .card,body.core-edition .learning-cycle{border:1px solid var(--line);box-shadow:0 5px 22px #102b5905;border-radius:18px}
body.core-edition #main{border-top:4px solid var(--stage)}
body.core-edition .cycle-unit{--tone:#bf263e;--tint:#fff1f3}
body.core-edition .cycle-unit[data-cycle-step="2"]{--tone:#2874ac;--tint:#edf6fc}
body.core-edition .cycle-unit[data-cycle-step="3"]{--tone:#28714e;--tint:#eff8f2}
body.core-edition .cycle-unit[data-cycle-step="4"]{--tone:#9b6b10;--tint:#fff8e6}
body.core-edition .cycle-unit .cycle-stage{border:1px solid color-mix(in srgb,var(--tone) 32%,white);color:var(--tone);background:var(--tint);border-radius:12px;box-shadow:none;min-height:76px;gap:8px}
body.core-edition .cycle-unit .cycle-stage.active{border:2px solid var(--tone);background:var(--tint);box-shadow:0 3px 12px #102b5908}
body.core-edition .cycle-unit .cycle-stage b{font-size:16px;white-space:nowrap;color:var(--tone)}
body.core-edition .cycle-unit .cycle-number,body.core-edition .cycle-unit .core-step-code{color:var(--tone);background:transparent}
body.core-edition .cycle-arrow-1{color:#bf263e}body.core-edition .cycle-arrow-2{color:#2874ac}body.core-edition .cycle-arrow-3{color:#28714e}body.core-edition .cycle-arrow-loop{color:#9b6b10}
body.core-edition .capsule-tools-v55{display:flex;width:fit-content;max-width:100%;margin:18px auto 0;align-items:stretch;gap:0;border:1px solid #d3a451;border-radius:24px;background:#fff3dc;overflow:visible}
body.core-edition .capsule-tools-v55>[data-action=copy-integrated]{width:auto;flex:1 1 auto;min-height:48px;height:auto;padding:8px 18px;font-size:16px;line-height:1.2;white-space:nowrap;background:#fff3dc!important;color:#735016!important;border:0;border-radius:24px 0 0 24px!important;box-shadow:none}
body.core-edition .capsule-tools-v55>.practice-qr-icon{flex:0 0 44px;min-width:44px;width:44px;height:auto;min-height:48px;padding:10px;color:#735016!important;background:#fff3dc!important;border:0;border-left:1px solid #d3a451;border-radius:0}
body.core-edition .capsule-tools-v55>:last-child{border-radius:0 24px 24px 0!important}
body.core-edition .prompt-copy-row .btn.copy,body.core-edition #main>.actions .btn.primary{background:var(--stage);color:white;border-color:var(--stage);box-shadow:0 4px 12px #102b5910}
body.core-edition .step{color:var(--stage);background:var(--stage-soft)}
body.core-edition .edit-status{display:inline!important}
body.core-edition .app-help{margin:7px 0 16px}
body.core-edition .app-help>summary,body.core-edition #main .core-start-help>summary{display:list-item;font-size:13px;min-height:28px;line-height:1.4;padding:4px 0;background:transparent;border:0;color:#65758c;box-shadow:none}
body.core-edition .app-help>summary .core-icon{width:16px;height:16px}
body.core-edition .app-help-content{font-size:14px;line-height:1.7}
body.core-edition .ai-links.ai-card-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
body.core-edition .ai-links.ai-card-grid .ai-card{font-size:14px;min-width:0;min-height:48px;white-space:nowrap}
body.core-edition .btn,body.core-edition .btn-sm,body.core-edition .mp-button{white-space:nowrap;min-height:44px;line-height:1.4}
.actions{flex-wrap:wrap;gap:8px}.actions>*{min-width:0;max-width:100%}
button,select{touch-action:manipulation}button:focus-visible,summary:focus-visible,select:focus-visible{outline:3px solid #2c78b7;outline-offset:3px}
dialog{max-height:calc(var(--visible-height,100dvh) - 28px);overscroll-behavior:contain;scroll-padding:20px;overflow-x:hidden}
.field{max-width:100%;box-sizing:border-box}.field,textarea{scroll-margin-block:32px}textarea{font-size:16px;resize:vertical}
.mn-backup-file{position:relative;overflow:hidden;cursor:pointer}.mn-backup-file input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}
.mn-backup-file:focus-within{outline:3px solid #2c78b7;outline-offset:2px}
#mnBackupDialog{width:min(600px,calc(100% - 28px));border:0;border-radius:18px;padding:24px}
body.core-edition #mobileNav{position:fixed!important;inset:auto 0 0!important;transform:none!important;padding-bottom:max(8px,env(safe-area-inset-bottom));z-index:80;background:#ffffffed;backdrop-filter:blur(16px);border-top:1px solid var(--line)}
body.core-edition #mobileNav button{min-width:0;min-height:58px;gap:3px;font-size:12px;padding:5px 2px;white-space:nowrap;overflow:hidden}
body.core-edition #mobileNav .core-nav-label{font-size:12px;white-space:nowrap}
body.core-edition #mobileNav .core-nav-number{font-size:10px}
body.core-edition #mobileNav button:nth-child(1){color:#bf263e}body.core-edition #mobileNav button:nth-child(2){color:#2874ac}body.core-edition #mobileNav button:nth-child(3){color:#28714e}body.core-edition #mobileNav button:nth-child(4){color:#9b6b10}
body.core-edition #mobileNav button[aria-current=page]{background:var(--stage-soft);border-color:var(--stage)}
html.mobile-input-active body.core-edition #mobileNav{display:none!important}
html[data-theme=soft] body.core-edition{background:#faf8f5}
@media(max-width:1050px){body.core-edition .top{grid-template-columns:1fr;gap:12px}body.core-edition #topControls{max-width:none}body.core-edition .cycle-unit .cycle-stage b{font-size:15px}}
@media(max-width:600px){
 body.core-edition .shell{padding:12px 12px 100px}body.core-edition .top{padding:18px 14px;border-radius:18px}
 html body.core-edition .logo-mark{width:68px;height:68px;min-width:68px}.mn-brand-name{font-size:22px}.mn-brand-subtitle{font-size:12px;margin-top:6px}
 body.core-edition .learning-cycle{padding:16px 12px}body.core-edition .cycle-kicker{font-size:20px}
 body.core-edition .cycle-unit .cycle-stage b{font-size:15px}body.core-edition .cycle-unit .cycle-stage{min-height:72px;padding:8px}
 body.core-edition #topControls{gap:8px}body.core-edition #topControls .banner-learning-tools{gap:8px}
 body.core-edition #topControls #goalsButton,body.core-edition #topControls #wordBankButton{font-size:13px!important;gap:2px}
 body.core-edition #topControls #goalsButton .core-icon,body.core-edition #topControls #wordBankButton .core-icon{width:16px;height:16px}
 .mn-select-label{font-size:14px;inset-inline-start:9px}
 body.core-edition .capsule-tools-v55{width:100%;max-width:390px}body.core-edition .capsule-tools-v55>[data-action=copy-integrated]{font-size:14px;padding-inline:8px;gap:4px}
 body.core-edition .ai-links.ai-card-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 body.core-edition .btn,body.core-edition .btn-sm{font-size:14px;padding-inline:12px}
 body.core-edition .prompt-copy-row .btn.copy{font-size:16px}
 body.core-edition .dialog-head{gap:10px}body.core-edition .dialog-head h2{font-size:20px}
 body.core-edition .core-main-heading h2{font-size:24px}
}
@media(max-width:360px){body.core-edition .shell{padding-inline:8px}body.core-edition .top{padding-inline:10px}.mn-brand-name{font-size:20px}body.core-edition .capsule-tools-v55>[data-action=copy-integrated]{font-size:13px}body.core-edition .capsule-tools-v55>.practice-qr-icon{flex-basis:44px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* Hidden controls must remain hidden even when a component uses flex/grid. */
[hidden]{display:none!important}
.mn-cycle-short{display:none}
body.core-edition .cycle-flow .cycle-unit .cycle-stage.active{border:2px solid var(--tone)!important;background:var(--tint)!important}
body.core-edition .cycle-flow .cycle-unit .cycle-stage{color:var(--tone);background:var(--tint);border-color:color-mix(in srgb,var(--tone) 32%,white)}
body.core-edition .cycle-flow .cycle-stage b{font-size:16px}
@media(max-width:600px){.mn-cycle-full{display:none}.mn-cycle-short{display:inline}body.core-edition .cycle-flow .cycle-stage b{font-size:15px}}
