/* =========================================================
   One Memory at a Time© — Version 12.4.6 Bright Brand Refresh
   New visual family: warm sky blue + OMAAT royal blue + cream + restrained gold.
   This file intentionally loads after the legacy v12 critical CSS so the refreshed
   palette can replace the earlier brown-heavy presentation without changing function.
   ========================================================= */
:root{
  --brown:#003A8C;
  --deep:#002B68;
  --gold:#D4A017;
  --cream:#F3FAFF;
  --paper:#FFFFFF;
  --ink:#18344F;
  --muted:#5D6D7C;
  --line:#C9DDEA;
  --navy:#003A8C;
  --soft:#EAF5FC;
  --warn:#FFF8E6;
  --v12-brown:#003A8C;
  --v12-deep:#002B68;
  --v12-gold:#D4A017;
  --v12-gold-soft:#F3D98A;
  --v12-olive:#2F7FAE;
  --v12-blue:#1479B8;
  --v12-cream:#F3FAFF;
  --v12-paper:#FFFFFF;
  --v12-ink:#18344F;
  --omaat-sky:#DFF2FC;
  --omaat-sky-2:#EEF8FD;
  --omaat-blue:#003A8C;
  --omaat-blue-2:#0A67A8;
  --omaat-blue-3:#2F8FC2;
  --omaat-cream:#FFF8E6;
  --omaat-gold:#D4A017;
}

html{background:var(--omaat-sky-2)!important;color:var(--ink)!important}
body{
  background:linear-gradient(180deg,#EAF7FD 0%,#F8FCFF 46%,#FFF9EC 100%)!important;
  color:var(--ink)!important;
}
main{max-width:1180px!important;padding:22px 20px!important}
h1,h2,h3,h4,h5{color:var(--omaat-blue)!important}
a{color:#005BA6}

/* Header / brand */
.app-header.v12-header{
  background:linear-gradient(90deg,#002F76 0%,#003A8C 44%,#0B6AA9 100%)!important;
  border-bottom:3px solid var(--omaat-gold)!important;
  box-shadow:0 5px 20px rgba(0,58,140,.18)!important;
}
.brand-home-button{
  display:flex!important;align-items:center!important;justify-content:center!important;flex:0 0 auto!important;
  width:auto!important;min-width:0!important;padding:6px 10px!important;margin:0!important;
  border:1px solid rgba(212,160,23,.76)!important;background:rgba(255,248,230,.98)!important;
  border-radius:14px!important;box-shadow:0 3px 12px rgba(0,0,0,.16)!important;cursor:pointer!important;
}
.header-brand-logo{display:block;width:auto!important;max-width:220px!important;height:48px;object-fit:contain;object-position:center left}
.volume{color:#FFF3C8!important}
.header-link{color:#fff!important}
.language-toggle.compact{background:rgba(255,255,255,.12)!important;border-color:rgba(255,255,255,.28)!important}
.lang-choice.active{background:var(--omaat-gold)!important;color:#17324d!important}

/* Access / activation entrance */
.access-gate{background:linear-gradient(180deg,#DFF2FC 0%,#F6FBFE 52%,#FFF8E6 100%)!important}
.access-shell{max-width:820px!important}
.bright-access-brand{
  grid-template-columns:minmax(210px,320px) 1fr!important;
  gap:24px!important;align-items:center!important;margin:2px 0 22px!important;
}
.access-brand-logo{display:block;width:100%;height:auto;max-height:270px;object-fit:contain}
.access-welcome-copy h1{font-size:clamp(2rem,5vw,3.35rem)!important;color:var(--omaat-blue)!important}
.access-eyebrow{color:#8B660A!important}
.access-lead{color:#425E73!important}
.access-card{background:rgba(255,255,255,.96)!important;border-color:#BBD7E9!important;box-shadow:0 10px 30px rgba(0,58,140,.09)!important}
.returning-access-priority{border-color:var(--omaat-gold)!important;background:linear-gradient(180deg,#FFFDF6,#F6FBFE)!important}
.returning-kicker{color:#8B660A!important}
.returning-user-panel{background:#F4FAFE!important;border-color:#C8DEEC!important}
.form-row label,.returning-user-panel label{color:var(--omaat-blue)!important}
.form-row input,.form-row select,.returning-user-panel input{border-color:#9EC5DC!important}
.form-row input:focus,.form-row select:focus,.returning-user-panel input:focus{outline:3px solid rgba(212,160,23,.28)!important;border-color:var(--omaat-gold)!important}
.text-link{color:#005EA8!important}
.access-footer{color:#536D80!important}
.access-footer strong{color:var(--omaat-blue)!important}

/* Home / hero */
.v12-home{max-width:1040px!important}
.v12-hero.bright-brand-hero{
  padding:24px clamp(16px,4vw,38px) 26px!important;
  background:
    radial-gradient(circle at 18% 15%,rgba(255,255,255,.95),transparent 32%),
    linear-gradient(135deg,#DDF2FC 0%,#EEF9FE 52%,#FFF8E6 100%)!important;
  border:1px solid #B8D9EB!important;
  box-shadow:0 16px 40px rgba(0,58,140,.09)!important;
}
.v12-hero.bright-brand-hero:after{display:none!important}
.v12-hero .eyebrow{color:#7E5B08!important}
.home-logo-picture{display:block;max-width:960px;margin:5px auto 4px}
.home-brand-logo{display:block;width:100%;height:auto;max-height:340px;object-fit:contain;margin:0 auto}
.v12-hero .lead{color:#31546D!important;margin:.3em auto 0!important}
.home-method{color:var(--omaat-blue)!important}
.home-site{color:#5B7284!important}

/* Main actions — brighter, unified family */
.home-action{border-color:rgba(0,58,140,.18)!important;box-shadow:0 9px 24px rgba(0,58,140,.10)!important}
.home-action.start{background:linear-gradient(135deg,#003A8C,#0A65AC)!important}
.home-action.stories{background:linear-gradient(135deg,#176F9D,#3697C3)!important}
.home-action.library{background:linear-gradient(135deg,#9B720B,#D4A017)!important}
.home-action.share{background:linear-gradient(135deg,#005C91,#1786B5)!important}
.home-action.game{background:linear-gradient(135deg,#002F76 0%,#003A8C 46%,#0B6AA9 100%)!important;border:2px solid rgba(212,160,23,.80)!important;box-shadow:0 11px 28px rgba(0,58,140,.18)!important}
.home-game-action{position:relative!important;margin:0 0 18px!important;min-height:102px!important;grid-template-columns:60px 1fr 24px!important;overflow:hidden!important}
.home-game-action .home-action-icon{display:flex!important;align-items:center!important;justify-content:center!important;font-size:1.8rem!important;width:52px!important;height:52px!important;border-radius:14px!important;background:rgba(255,248,230,.16)!important;border:1px solid rgba(255,248,230,.34)!important;color:#fff!important;filter:none!important;text-shadow:none!important}
.home-game-action strong{font-size:1.34rem!important;color:#fff!important;text-shadow:0 1px 1px rgba(0,0,0,.14)!important}
.home-game-action small{font-size:.92rem!important;line-height:1.35!important;color:rgba(255,255,255,.94)!important;text-shadow:0 1px 1px rgba(0,0,0,.12)!important}
.home-game-action .home-arrow{color:#FFF3C8!important}
.home-game-action::before{content:"";position:absolute;inset:9px;border-radius:14px;border:1px solid rgba(255,248,230,.22)!important;pointer-events:none!important}

.home-action:hover,.home-action:focus{box-shadow:0 13px 28px rgba(0,58,140,.16)!important;outline-color:rgba(212,160,23,.40)!important}
.home-arrow{color:#FFF0B5!important}
.offline-card{background:linear-gradient(135deg,#F3FBFF,#FFF9EA)!important;border-color:#BFD9E8!important;box-shadow:0 8px 22px rgba(0,58,140,.07)!important}
.offline-icon{background:var(--omaat-blue)!important}
.offline-copy strong{color:var(--omaat-blue)!important}
.offline-copy p{color:#4E6474!important}
.offline-status{color:#246F95!important}
.text-action{border-color:#BFD7E6!important;background:#FFFFFF!important;color:var(--omaat-blue)!important}
.text-action:hover,.text-action:focus{border-color:var(--omaat-gold)!important;outline-color:rgba(212,160,23,.24)!important}

/* Buttons / nav / focus */
.primary,.save-note{background:var(--omaat-blue)!important;color:#fff!important;border-color:var(--omaat-blue)!important}
.primary:hover,.save-note:hover{background:#005AA5!important}
.secondary,.back-btn,.clear-note{background:#fff!important;color:var(--omaat-blue)!important;border-color:#9FC7DE!important}
.secondary:hover,.back-btn:hover,.clear-note:hover{background:#EEF8FD!important}
.bottom-nav{background:linear-gradient(90deg,#002F76,#003A8C,#0A67A8)!important;border-top:3px solid var(--omaat-gold)!important;box-shadow:0 -5px 20px rgba(0,58,140,.18)!important}
.bottom-nav button{color:#fff!important}
.bottom-nav .nav-icon{color:#FFE7A0!important}
.bottom-nav .nav-share{background:var(--omaat-gold)!important;color:#17324d!important}
.bottom-nav .nav-share .nav-icon{color:#17324d!important}
.primary:focus,.secondary:focus,.back-btn:focus,.tab:focus,.story-card:focus,.save-note:focus,.clear-note:focus{outline:3px solid rgba(212,160,23,.40)!important;outline-offset:2px!important}

/* General content cards */
.intro-callout,.method-reminder,.note-box,.next-volume{background:#fff!important;border-color:#C9DDEA!important;border-left-color:var(--omaat-gold)!important}
details{background:#fff!important;border-color:#C9DDEA!important;box-shadow:0 5px 16px rgba(0,58,140,.04)!important}
summary{color:var(--omaat-blue)!important;background:linear-gradient(90deg,#E7F5FC,#F8FCFF)!important;border-bottom:1px solid transparent}
details[open] summary{border-bottom-color:#D3E4EF!important}
.story-card,.story-heading,.tab-panel{background:#fff!important;border-color:#C9DDEA!important}
.story-card strong,.story-card .story-num{color:var(--omaat-blue)!important}
.story-card span:last-child{color:#607587!important}
.tabs{background:linear-gradient(#F5FBFE 80%,rgba(245,251,254,0))!important}
.tab{background:#fff!important;color:var(--omaat-blue)!important;border-color:#B9D7E8!important}
.tab.active{background:var(--omaat-blue)!important;color:#fff!important;border-color:var(--omaat-blue)!important}
.memory-moment{background:#EDF8FD!important;border-left-color:var(--omaat-gold)!important}
.gentle-care{background:#FFF8E6!important;border-left-color:var(--omaat-gold)!important}
.pause-line{color:#7D5C08!important}
textarea{border-color:#A9CBDD!important}
.note-status{color:#246F95!important}

/* HOW TO BEGIN: use exactly the same reading measure/rhythm as Final Reflection.
   The text itself is unchanged; only the page layout is unified. */
#reflection,#getting-started{max-width:900px!important;margin:0 auto!important}
#reflection>h1,#getting-started>h1{margin-top:.35em!important}
#reflection .prose,
#getting-started details .prose{
  max-width:820px!important;
  margin:0 auto!important;
  padding:22px 28px 12px!important;
  font-size:1.08rem!important;
  line-height:1.72!important;
  color:var(--ink)!important;
}
#reflection .prose p,
#getting-started details .prose p{margin:0 0 1.12em!important}
#reflection .prose ul,#reflection .prose ol,
#getting-started details .prose ul,#getting-started details .prose ol{padding-left:1.45rem!important;margin:0 0 1.15em!important}
#getting-started details{margin:16px 0!important;border-radius:15px!important}
#getting-started details summary{padding:16px 20px!important;font:700 1.04rem Georgia,serif!important}
#getting-started .intro-callout{max-width:820px;margin:15px auto 20px!important;padding:17px 20px!important}
#reflection .next-volume{max-width:820px;margin:20px auto!important}

/* Memory Game: override legacy inline brown-heavy critical rules */
#memory-moment .memory-game-header{background:linear-gradient(135deg,#E5F5FC,#FFF9EA)!important;border-color:#C4DDEA!important;box-shadow:0 10px 28px rgba(0,58,140,.07)!important}
#memory-moment .memory-game-kicker{color:#8B660A!important}
#memory-moment .memory-game-header h1,#memory-moment .memory-theme-section h2,#memory-moment .memory-moment-card h2{color:var(--omaat-blue)!important}
#memory-moment .memory-theme-section{background:#fff!important;border-color:#C9DDEA!important;box-shadow:0 8px 24px rgba(0,58,140,.05)!important}
#memory-moment button.memory-theme{background:#F4FAFE!important;color:var(--omaat-blue)!important;border-color:#BFD8E7!important;box-shadow:0 5px 15px rgba(0,58,140,.05)!important}
#memory-moment button.memory-theme:hover,#memory-moment button.memory-theme:focus{background:#fff!important;box-shadow:0 9px 20px rgba(0,58,140,.09)!important}
#memory-moment button.memory-theme.surprise{background:var(--omaat-blue)!important;color:#fff!important;border-color:var(--omaat-blue)!important}
#memory-moment .memory-moment-card{background:#fff!important;border-color:#C9DDEA!important;box-shadow:0 14px 34px rgba(0,58,140,.09)!important}
#memory-moment .memory-moment-label{color:#8B660A!important}
#memory-moment .memory-doorway{color:#19344D!important;background:#F2FAFE!important;border-left-color:var(--omaat-gold)!important}
#memory-moment .memory-pause{color:var(--omaat-blue)!important}
#memory-moment .memory-seed{background:#EDF7FC!important;border-color:#C9DDEA!important;color:var(--omaat-blue)!important}
#memory-moment .memory-moment-principle{background:linear-gradient(135deg,#003A8C,#0B6AA9)!important;color:#fff!important;box-shadow:0 8px 22px rgba(0,58,140,.14)!important}
#memory-moment .memory-moment-principle p{color:#E8F6FD!important}

/* Library: replace dark wood shelves with a bright book-gallery treatment */
#library .library-eyebrow{color:#8B660A!important}
#library .book-shelf{
  background:linear-gradient(180deg,#F6FCFF,#EAF6FC)!important;
  border:1px solid #C2DCEB!important;
  box-shadow:0 14px 28px rgba(0,58,140,.08)!important;
}
#library .shelf-sign{background:#FFF8E6!important;border-color:var(--omaat-gold)!important;box-shadow:0 3px 7px rgba(0,58,140,.08)!important}
#library .shelf-sign span{color:var(--omaat-blue)!important}
#library .shelf-sign small{color:#536E81!important}
#library a.book{border-color:#C7DCE9!important;box-shadow:-6px 7px 0 #8DB6CF,0 9px 16px rgba(0,58,140,.14)!important}
#library a.book:hover,#library a.book:focus{box-shadow:-6px 10px 0 #76A9C8,0 18px 26px rgba(0,58,140,.18)!important}
#library a.book>img,#library .book-art-wrap img{background:#F6FBFE!important}
#library .book-title{background:linear-gradient(180deg,rgba(0,58,140,.04),rgba(0,58,140,.95) 34%)!important}
#library .wood-shelf{height:11px!important;background:linear-gradient(#E5B83D,#D4A017)!important;border-top:1px solid #F4D477!important;box-shadow:0 7px 11px rgba(0,58,140,.10)!important}
#library .library-note{background:#F7FCFF!important;border-left-color:var(--omaat-gold)!important}
.media-shelf .shelf-sign{background:#EAF7FD!important;border-color:#79B5D4!important}
.media-shelf .shelf-sign span{color:var(--omaat-blue)!important}

/* Share / Contact / French notice */
.share-card,.share-copy,.share-note,.contact-form,.share-app-graphic{background:#fff!important;border-color:#C9DDEA!important;box-shadow:0 9px 24px rgba(0,58,140,.06)!important}
.share-note{background:#F5FBFE!important;border-left-color:var(--omaat-gold)!important}
.contact-status{color:#246F95!important}
.french-beta-notice{background:rgba(0,42,92,.76)!important}
.french-notice-card{background:linear-gradient(180deg,#F6FCFF,#FFF9EA)!important;border-color:#B9D7E8!important;box-shadow:0 24px 70px rgba(0,42,92,.28)!important}
.french-kicker{color:#8B660A!important}
.french-notice-card h1{color:var(--omaat-blue)!important}

@media(max-width:760px){
  main{padding:16px 14px!important}
  .brand-home-button{padding:6px 9px!important}
  .header-brand-logo{height:42px;max-width:190px!important}
  .bright-access-brand{grid-template-columns:1fr!important;text-align:center!important;gap:8px!important}
  .access-brand-logo{max-width:360px;margin:0 auto;max-height:300px}
  .access-welcome-copy{max-width:560px;margin:0 auto}
  #reflection .prose,#getting-started details .prose{padding:20px 20px 10px!important}
}
@media(max-width:560px){
  main{padding:14px 12px!important}
  .v12-header{padding:8px 10px!important;min-height:58px!important}
  .brand-home-button{padding:5px 8px!important}
  .header-brand-logo{height:38px;max-width:165px!important}
  .v12-hero.bright-brand-hero{padding:18px 13px 22px!important;border-radius:20px!important}
  .home-logo-picture{max-width:440px;margin-top:6px}
  .home-brand-logo{max-height:420px}
  #reflection,#getting-started{max-width:100%!important}
  #reflection .prose,#getting-started details .prose{padding:18px 16px 8px!important;font-size:1.02rem!important;line-height:1.68!important}
  #getting-started details summary{padding:15px 16px!important}
  #getting-started .intro-callout{padding:15px 16px!important}
}


/* v12.5.0 phone-first portable setup */
.omaat-phone-setup{position:fixed;inset:0;z-index:99999;background:rgba(18,30,52,.78);display:flex;align-items:center;justify-content:center;padding:18px;overflow:auto}
.omaat-phone-setup-card{width:min(620px,100%);background:#fffaf0;border:3px solid #d4a017;border-radius:22px;padding:26px;box-shadow:0 18px 60px rgba(0,0,0,.28);color:#18233a}
.omaat-phone-setup-card h2{font-family:Georgia,serif;color:#003a8c;font-size:clamp(26px,7vw,38px);line-height:1.08;margin:8px 0 14px}
.phone-setup-kicker{font-weight:900;letter-spacing:.08em;color:#003a8c;font-size:13px}
.phone-setup-promise{margin:18px 0;padding:15px;border-radius:14px;background:#eef5ff;border-left:5px solid #003a8c;font-size:18px;line-height:1.4}
.phone-browser-note{font-size:15px;background:#fff3cf;border-radius:12px;padding:12px 14px}
.omaat-phone-setup-card .wide{margin-top:12px;width:100%;min-height:52px}
@media (max-width:600px){.omaat-phone-setup{align-items:flex-start;padding:10px}.omaat-phone-setup-card{margin-top:8px;padding:20px 16px;border-radius:18px}}

.device-howto{margin-top:16px;padding:14px 16px;background:#fff8e6;border:1px solid #d4a017;border-radius:10px;line-height:1.55;text-align:left}.offline-help-button{margin-top:10px}

/* v12.5.7 memoir request presentation */
#memoir-request .memoir-request-card{margin:24px auto 40px;text-align:center;max-width:660px}
#memoir-request .memoir-request-card h1,#memoir-request .memoir-request-card p,#memoir-request .memoir-request-card .phone-setup-kicker{text-align:center}
#memoir-request .memoir-request-card .offline-status{max-width:520px;margin:18px auto!important}
#memoir-request .memoir-request-card .primary,#memoir-request .memoir-request-card .secondary{display:block;max-width:520px;margin-left:auto;margin-right:auto}
