/* Scoped additions; the original NH stylesheet owns the shared design. */
.favorite-three{display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)) 62px; gap: 10px; margin-top: 18px; align-items: stretch;}
.favorite-three .favorite-link{display: flex; align-items: center; justify-content: center; gap: 6px; min-width: 0px; min-height: 58px; width: 100%; border: 1px solid transparent; border-radius: 16px; padding: 10px 8px; text-decoration: none; font-style: inherit; font-variant: inherit; font-stretch: inherit; font-size: inherit; line-height: inherit; font-family: inherit; font-optical-sizing: inherit; font-size-adjust: inherit; font-kerning: inherit; font-feature-settings: inherit; font-variation-settings: inherit; font-weight: 700; cursor: pointer;}
.favorite-three .fav-0{background: #eaf6fc; color: #205777; border-color: #eaf6fc;}
.favorite-three .fav-1{background: #edf8f4; color: #18384b; border-color: #9bafbc;}
.favorite-three .fav-2{background: #f3f4f5; color: #435c6b; border-color: #9bafbc;}
.favorite-name{overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0px;}
.favorite-three .favorite-link:hover{filter: brightness(0.96);}
.fav-editor{margin: 14px 0px; display: grid; gap: 8px;}
.fav-editor h4{margin: 0px;}
.mp-tabs button[aria-pressed="true"]{background: var(--navy); color: white;}
.my-mode .learning-cycle{display: none !important;}
#mpDialog{width: min(720px, 94vw); max-height: 90vh; overflow: auto;}
#mpDialog video{max-height: 260px; width: 100%; object-fit: contain; background: rgb(17, 17, 17);}
#mpDialog canvas{display: block; max-width: 100%; height: auto; margin: 16px auto; image-rendering: pixelated;}
#mpDialog textarea{white-space: pre-wrap;}
#mpError{color: var(--red); white-space: pre-wrap;}
@media (max-width: 480px){.favorite-three{gap: 6px;}
.favorite-three .favorite-link{font-size: 12px; padding: 9px 5px; border-radius: 12px;}
#mpDialog .actions .btn{flex: 1 1 auto;}
.my-mode .actions{gap: 8px;}}
.favorite-three .favorite-link > span:first-child{color: inherit;}
.mp-icon{width: 20px; height: 20px; flex: 0 0 20px; vertical-align: middle;}
.mp-button{display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 46px; line-height: 1.5;}
.mp-button > span{min-width: 0px;}
.btn.mp-tone-primary{background: var(--navy); color: rgb(255, 255, 255); border-color: var(--navy);}
.btn.mp-tone-blue{background: #eaf6fc; color: #205777; border-color: #eaf6fc;}
.btn.mp-tone-green{background: #edf8f4; color: #18384b; border-color: #9bafbc;}
.btn.mp-tone-danger{background: #fff3ee; color: #a54537; border-color: #fff8df;}
.btn.mp-tone-purple{background: #f3f4f5; color: #435c6b; border-color: #eaf6fc;}
.btn.mp-tone-neutral{background: #f3f4f5; color: var(--navy); border-color: var(--line);}
.btn.mp-button:hover{filter: brightness(0.96);}
.btn.mp-tone-primary:hover{background: var(--navy-dark); color: white;}
.actions.mp-create,.actions.mp-manage{justify-content: flex-start; gap: 10px;}
.mp-create{margin-bottom: 24px;}
.actions.mp-tabs{display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 5px; background: var(--sky); border: 1px solid var(--line); border-radius: 15px; padding: 5px; margin: 20px 0px;}
.mp-tabs .mp-button{width: 100%; border: 0px; background: transparent; color: var(--navy); padding: 11px 8px;}
.mp-tabs .mp-button[aria-pressed="true"]{background: var(--navy); color: white; box-shadow: rgba(22, 57, 92, 0.094) 0px 2px 5px;}
.mp-count{display: inline-block; min-width: 24px; padding: 1px 7px; border-radius: 20px; margin-left: 5px; background: #eaf6fc; font-size: 13px; color: var(--navy);}
.mp-tabs [aria-pressed="true"] .mp-count{background: rgba(255, 255, 255, 0.18); color: white;}
.mp-manage [data-mp="delete"]{margin-left: auto;}
.mp-achieved{display: flex; align-items: center; gap: 7px; color: #18384b; margin-top: 12px;}
.mp-choices{display: grid; grid-template-columns: 1fr 1fr; gap: 12px;}
#main fieldset label.mp-choice{display: flex; align-items: flex-start; gap: 10px; margin: 0px; padding: 15px; border: 1px solid var(--line); border-radius: 12px; background: white; cursor: pointer;}
#main fieldset label.mp-choice.is-selected{background: var(--sky); border-color: var(--navy); box-shadow: 0 0 0 1px var(--navy);}
.mp-choice input{flex: 0 0 auto; margin-top: 5px; accent-color: var(--navy);}
.mp-choice strong,.mp-choice small{display: block;}
.mp-choice small{font-size: 13px; font-weight: 400; line-height: 1.7; color: var(--muted); margin-top: 5px;}
.mp-use legend{padding: 0px 6px; font-weight: 700; color: var(--navy);}
.mp-choice:focus-within{outline: #a54537 solid 3px; outline-offset: 3px;}
.mp-output{gap: 12px;}
.mp-exports{display: flex; gap: 10px; flex-wrap: wrap;}
@media (max-width: 600px){.mp-choices{grid-template-columns: 1fr;}
.mp-create .mp-button{flex: 1 1 auto;}
.mp-output > [data-mp="copy"]{width: 100%;}
.mp-exports{display: grid; grid-template-columns: minmax(0px, 2fr) minmax(0px, 1fr); width: 100%; gap: 8px;}
.mp-exports .mp-button{width: 100%; min-width: 0px; white-space: normal; padding: 11px 7px;}
.mp-exports .mp-button > span{overflow-wrap: anywhere;}
.mp-tabs .mp-button{font-size: 14px; gap: 5px;}
.mp-tabs .mp-icon{width: 17px; height: 17px; flex-basis: 17px;}
.mp-count{margin-left: 2px; padding: 1px 5px;}
.mp-manage .mp-button{font-size: 14px; padding: 10px;}
.mp-manage [data-mp="edit"]{flex: 1 1 auto;}
.mp-manage [data-mp="delete"]{margin-left: 0px;}}
@media (max-width: 360px){.mp-tabs .mp-button{flex-direction: column; gap: 4px;}
.mp-create{flex-direction: column; align-items: stretch;}}
.favorite-three .favorite-link{height: 60px; min-height: 60px; font-size: 16px;}
.favorite-three .aichan-link{display: flex; align-items: center; justify-content: center; box-sizing: border-box; min-width: 0px; width: 62px; height: 60px; border: 2px solid #eaf6fc; border-radius: 20px; background: #eaf6fc; text-decoration: none; overflow: hidden;}
.favorite-three .aichan-link img{display: block; width: 48px; height: 48px; object-fit: contain;}
.favorite-three .aichan-link:hover{background: #eaf6fc;}
@media (max-width: 600px){.favorite-three{grid-template-columns: repeat(3, minmax(0px, 1fr)) 46px; gap: 6px; margin-top: 12px;}
.favorite-three .favorite-link{height: 48px; min-height: 48px; padding: 8px 4px; font-size: 12px; gap: 3px; border-radius: 12px;}
.favorite-three .favorite-link > span:not(.favorite-name){display: none;}
.favorite-three .aichan-link{width: 46px; height: 48px; border-radius: 15px;}
.favorite-three .aichan-link img{width: 36px; height: 36px;}}
#main fieldset label.preparation-toggle{display: flex; flex-direction: row; align-items: center; gap: 10px; margin: 0px; min-height: 44px;}
.mp-exports .mp-button{white-space: nowrap; min-width: max-content;}
.mp-exports .mp-button > span{overflow-wrap: normal; white-space: nowrap;}
@media (max-width: 600px){.mp-exports{display: flex; flex-wrap: wrap; align-items: stretch;}
.mp-exports .mp-button{width: auto; flex: 1 0 auto;}
.mp-exports [data-mp="text"]{flex-basis: 100%;}
.mp-exports [data-mp="qr"]{flex-basis: 100%;}}
#mpDialog [hidden]{display: none !important;}
.mp-register-methods{display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 12px; margin: 16px 0px;}
#mpDialog .mp-register-method{display: flex; flex-direction: column; align-items: flex-start; gap: 10px; text-align: left; padding: 16px 12px; min-width: 0px; height: auto; border: 2px solid transparent; border-radius: 14px; line-height: 1.5;}
.mp-register-method .mp-icon{width: 28px; height: 28px; flex-basis: 28px;}
.mp-register-method strong,.mp-register-method small{display: block;}
.mp-register-method strong{font-size: 16px;}
.mp-register-method small{font-size: 14px; font-weight: 400; margin-top: 5px;}
#mpDialog .mp-register-camera{background: #eaf6fc; color: #205777; border-color: #eaf6fc;}
#mpDialog .mp-register-image{background: #edf8f4; color: #18384b; border-color: #9bafbc;}
#mpDialog .mp-register-manual{background: #fff8df; color: #873529; border-color: #fff8df;}
#mpDialog .mp-register-method[aria-pressed="true"]{border-color: currentcolor; box-shadow: currentcolor 0px 0px 0px 1px;}
#mpDialog .mp-register-method:focus-visible{outline: #a54537 solid 3px; outline-offset: 3px;}
#mpDialog .mp-register-method > span{min-width: 0px;}
#mpDialog #mpForm{margin-top: 20px;}
@media (max-width: 600px){.mp-register-methods{grid-template-columns: minmax(0px, 1fr); gap: 10px;}
#mpDialog .mp-register-method{flex-direction: row; align-items: center; padding: 14px; gap: 12px;}
.mp-register-method .mp-icon{flex: 0 0 28px;}}
#main .mp-create .mp-button.mp-tone-primary{background: #143e59; color: rgb(255, 255, 255); border-color: #143e59;}
#main .mp-create .mp-button.mp-tone-primary:hover{background: #143e59; color: rgb(255, 255, 255);}
#main .mp-tabs .mp-button[aria-pressed="true"]{background: #143e59; color: rgb(255, 255, 255); border-color: #143e59;}
#main .mp-tabs .mp-button[aria-pressed="true"]:hover{background: #143e59; color: rgb(255, 255, 255);}
#main .mp-tabs [aria-pressed="true"] .mp-count{background: rgba(255, 255, 255, 0.18); color: inherit;}
#main .mp-prompt-picker{margin: 22px 0px; padding: 22px; background: #fff8df; border-width: 2px 2px 2px 6px; border-style: solid; border-color: #a54537; border-image: initial; border-radius: 18px; box-shadow: rgba(117, 71, 17, 0.05) 0px 5px 16px; gap: 16px;}
#main .mp-prompt-picker h3{display: flex; align-items: center; gap: 9px; margin: 0px; color: #205777; font-size: 20px; line-height: 1.5;}
#main .mp-prompt-picker h3 .mp-icon{width: 24px; height: 24px; flex-basis: 24px;}
#main .mp-prompt-picker label{color: #873529; font-weight: 700; margin: 0px;}
#main .mp-prompt-picker select.field{background: rgb(255, 255, 255); color: #205777; border: 2px solid #a54537; min-height: 54px; font-weight: 700; margin-top: 8px;}
#main .mp-prompt-picker select.field:focus{outline: #2477a4 solid 3px; outline-offset: 3px; border-color: #2477a4; box-shadow: none;}
#main .mp-prompt-picker select.field:disabled{background: #f3f4f5; color: #435c6b; -webkit-text-fill-color: #435c6b; opacity: 1; border-color: #9bafbc; cursor: not-allowed;}
@media (max-width: 600px){#main .mp-prompt-picker{padding: 18px 14px; border-left-width: 5px; gap: 14px;}
#main .mp-prompt-picker h3{font-size: 19px;}}
#main .mp-prompt-picker .mp-manage{margin: 0px; display: flex; flex-wrap: nowrap; gap: 10px;}
#main .mp-prompt-picker .mp-manage .mp-button{min-width: 0px;}
#main .mp-prompt-picker .mp-manage [data-mp="delete"]{margin-left: auto;}
#main .mp-output-layout{display: grid; grid-template-columns: auto minmax(0px, 1fr); grid-template-areas: "copy exports" "preview preview"; align-items: center; gap: 10px; margin: 10px 0px 20px;}
#main .mp-output-layout > [data-mp="copy"]{grid-area: copy;}
#main .mp-output-layout > .mp-full-preview{grid-area: preview; margin: 0px; min-width: 0px;}
#main .mp-output-layout > .mp-exports{grid-area: exports; justify-content: flex-end; min-width: 0px;}
@media (max-width: 600px){#main .mp-prompt-picker .mp-manage{display: grid; grid-template-columns: minmax(0px, 1fr) auto auto; gap: 8px;}
#main .mp-prompt-picker .mp-manage .mp-button{padding: 9px 7px; font-size: 13px; gap: 5px; width: 100%; margin: 0px; min-height: 46px;}
#main .mp-prompt-picker .mp-manage .mp-icon{width: 16px; height: 16px; flex-basis: 16px;}
#main .mp-output-layout{grid-template-columns: minmax(0px, 1fr); grid-template-areas: "copy" "preview" "exports"; gap: 8px;}
#main .mp-output-layout > [data-mp="copy"]{width: 100%;}
#main .mp-output-layout > .mp-exports{display: grid; grid-template-columns: minmax(0px, 1.8fr) minmax(0px, 1fr); width: 100%; gap: 8px;}
#main .mp-output-layout .mp-exports .mp-button{min-width: 0px; width: 100%; padding: 10px 6px; font-size: 13px; gap: 5px; white-space: normal;}
#main .mp-output-layout .mp-exports .mp-button > span{white-space: normal; overflow-wrap: anywhere;}
#main .mp-output-layout .mp-exports .mp-icon{width: 16px; height: 16px; flex-basis: 16px;}}
#goalsDialog #goalsList .goal-item{background: #fff8df; border-width: 2px 2px 2px 6px; border-style: solid; border-color: #d78574 #d78574 #d78574 #d78574; border-image: initial; color: #18384b;}
#wordBankDialog .bank-list{display: grid; gap: 12px; padding: 0px; list-style: none;}
#wordBankDialog .bank-list li.bank-card{background: rgb(255, 255, 255); border: 3px solid #2477a4; border-radius: 16px; padding: 14px; margin: 10px 0px; min-height: 68px; color: #143e59; gap: 12px; flex-wrap: wrap;}
#wordBankDialog .bank-list li.bank-card.completed{border-color: #eaf6fc;}
#wordBankDialog .bank-list li > span{min-width: 0px; flex: 1 1 160px; overflow-wrap: anywhere;}
#wordBankDialog .bank-list li small{color: #435c6b;}
#wordBankDialog [hidden]{display: none !important;}
#bankRegistrationPage{background: #f3f4f5; border: 1px solid #edf8f4; border-radius: 16px; padding: 18px; margin: 16px 0px;}
#bankRegistrationPage #bankForm{margin-top: 18px;}
#bankListPage h3{margin-top: 22px;}
@media (max-width: 600px){#bankRegistrationPage{padding: 14px;}
#wordBankDialog .bank-list li{padding: 14px;}
#wordBankDialog .bank-list li > div{display: flex; gap: 8px; flex-wrap: wrap;}}
.mp-register-methods{grid-template-columns: repeat(2, minmax(0px, 1fr));}
#mpDialog .mp-register-capsule{background: #fff3ee; color: #873529; border-color: #9bafbc;}
#mpDialog .mp-capsule-template{display: inline-flex; align-items: center; gap: 8px; background: #fff3ee; color: #873529; border-color: #9bafbc; white-space: normal; text-decoration: none;}
@media (max-width: 600px){.mp-register-methods{grid-template-columns: minmax(0px, 1fr);}}
.feedback-heading{display: flex; align-items: center; gap: 8px; margin-bottom: 10px;}
.feedback-heading h3{margin: 0px; flex: 0 1 auto;}
.feedback-info{flex: 0 0 44px; min-width: 44px; min-height: 44px; border: 1px solid var(--line); border-radius: 50%; background: rgb(255, 255, 255); color: var(--navy); font-size: 25px; line-height: 1; cursor: pointer;}
.feedback-info[aria-expanded="true"]{background: var(--navy); color: rgb(255, 255, 255);}
#visualHelp[hidden],#qrHelp[hidden]{display: none !important;}
.app-help{margin: 10px 0px 16px; border: 1px solid var(--line); border-radius: 12px; background: var(--sky); color: var(--navy);}
.app-help > summary{min-height: 44px; box-sizing: border-box; display: flex; align-items: center; gap: 9px; padding: 10px 14px; cursor: pointer; font-weight: 700; list-style: none;}
.app-help > summary::-webkit-details-marker{display: none;}
.app-help > summary::before{content: "▸"; flex: 0 0 auto;}
.app-help[open] > summary::before{content: "▾";}
.app-help-content{padding: 4px 14px 14px; color: var(--muted); line-height: 1.8;}
.app-help-content > p:last-child{margin-bottom: 0px;}
.app-help-content .section{margin: 8px 0px;}
.app-help{background: #f3f4f5; border-color: #edf8f4; color: #435c6b;}
.app-help-content{color: #435c6b;}
.help-bullets{list-style: none; padding: 0px; margin: 0px; display: grid; gap: 12px;}
.help-bullets > li{position: relative; padding-left: 1.1em; font-weight: 400;}
.help-bullets > li::before{content: "・"; position: absolute; left: 0px; color: currentcolor;}
#mpDialog .mp-chat-action{margin: 12px 0px 16px;}
#mpDialog .mp-chat-action .mp-tone-red{background: #a54537; color: rgb(255, 255, 255); border-color: #a54537; font-weight: 700;}
#mpDialog .mp-chat-action .mp-tone-red:hover{background: #873529; color: rgb(255, 255, 255);}
#mpDialog .mp-chat-action .mp-tone-red:focus-visible{outline: #d78574 solid 3px; outline-offset: 3px;}
#mpDialog .mp-extract-preview{margin: 12px 0px 0px;}
#mpDialog .mp-extract-preview > summary{font-weight: 600; color: #143e59; cursor: pointer;}
#mpDialog .mp-extract-preview label{display: block; margin-top: 12px;}
#mpDialog .mp-extract-text{display: block; width: 100%; box-sizing: border-box; min-height: 160px; max-height: 320px; resize: vertical; margin-top: 8px; font-size: 14px; line-height: 1.6;}
.prompt-copy-row{display: flex; align-items: center; gap: 12px 20px; flex-wrap: wrap;}
.prompt-copy-row .mission-option{display: inline-flex; align-items: center; gap: 8px; min-height: 44px; cursor: pointer; font-weight: 700; color: #143e59; margin: 0px;}
.mission-option input[type="checkbox"]{width: 22px; height: 22px; flex: 0 0 22px; accent-color: #205777; margin: 0px;}
.mission-option:focus-within{outline: #2477a4 solid 2px; outline-offset: 3px; border-radius: 4px;}
#wordBankDialog .bank-bulk-section > .actions{display: grid; grid-template-columns: 1fr; gap: 12px;}
#wordBankDialog .bank-bulk-section > .actions > .btn{width: 100%; box-sizing: border-box;}
#bankReview table{width: 100%; border-collapse: collapse; table-layout: fixed; background: rgb(255, 255, 255);}
#bankReview th,#bankReview td{text-align: left; vertical-align: top; padding: 10px 8px; border-bottom: 1px solid #eaf6fc; overflow-wrap: anywhere;}
#bankReview th{background: #f3f4f5; color: #205777;}
#bankReview h4:focus{outline: #6ca3d4 solid 2px; outline-offset: 4px;}
@media (min-width: 600px){#wordBankDialog .bank-bulk-section > .actions{grid-template-columns: 1fr 1fr;}}
@media (max-width: 599px){#wordBankDialog .bank-bulk-section,#bankReview{padding: 12px;}}