/* Zagrados fantasy skin — visually aligned with Pajzscsúszás */
:root{--navy:#061724;--navy2:#0a3047;--ice:#b9e7eb;--sky:#4da9bf;--gold:#d3ad68;--amber:#a66b2d;--cream:#ece6d5;--ink:#dce8e7;--panel:rgba(9,34,48,.96);--line:rgba(211,173,104,.28);--shadow:0 18px 55px rgba(0,8,14,.56)}
html,body{background:#04121d}body{color:var(--ink);background:radial-gradient(circle at 50% -10%,#174f68 0,#071f30 45%,#020b12 100%)}.snow{opacity:.3;mix-blend-mode:screen}
.app-shell{background:linear-gradient(180deg,#102f40 0,#081e2c 42%,#061722 100%);box-shadow:0 0 0 1px #d3ad6845,0 0 100px #000c}.topbar{height:82px;background:linear-gradient(180deg,#102f43,#061a29);border-bottom:1px solid #d3ad6870;box-shadow:0 8px 28px #0008}
.brand-kicker,.welcome-brand span{color:var(--gold);text-shadow:0 1px 0 #000,0 0 14px #c3934755}.brand-title,.welcome-brand strong{text-transform:uppercase;letter-spacing:.07em;text-shadow:0 2px 8px #000}
.avatar,.currency{border-color:#d3ad6888;background:linear-gradient(145deg,#173f55,#071927);border-radius:4px;clip-path:polygon(8% 0,92% 0,100% 18%,100% 82%,92% 100%,8% 100%,0 82%,0 18%)}.currency{clip-path:polygon(7% 0,93% 0,100% 50%,93% 100%,7% 100%,0 50%)}
.quest-scene{border-bottom:1px solid #d3ad6877}.scene-shade{background:linear-gradient(180deg,#03131f55 0%,#06172433 30%,#020b12f2 100%)}
.chapter-badge,.no-download-badge{border:1px solid #d3ad68aa;border-radius:3px;background:linear-gradient(180deg,#17384bcc,#071925ee);color:#ead39b;box-shadow:inset 0 0 0 1px #fff1,0 8px 25px #0008;text-transform:uppercase;letter-spacing:.07em}
.quest-copy h1,.page-intro h1,.section-heading h2,.upgrade-card h2,.story-content h2,.complete-story h2,dialog h2,.welcome-copy h1{font-family:Cormorant Garamond,serif;color:#f1eee3;letter-spacing:.01em}.greeting,.eyebrow,.chapter-number{color:#d3ad68}
.progress-track{height:10px;border-radius:2px;background:#020b12cc;border:1px solid #5d879066}.progress-track span{background:linear-gradient(90deg,#247e9d,#8de7e7);box-shadow:0 0 16px #66e6f2}
.daily-card,.story-card,.parent-panel,.parent-summary div,.village-status,.complete-story{background:linear-gradient(145deg,#123447f7,#081d2af7);border:1px solid #d3ad6855;border-radius:6px;color:var(--ink);box-shadow:inset 0 0 0 1px #ffffff08,var(--shadow)}
.daily-card:before,.story-card:before,.parent-panel:before,.complete-story:before{content:"";display:block;height:2px;background:linear-gradient(90deg,transparent,#d3ad68,transparent);opacity:.65}.daily-card:before,.parent-panel:before{margin:-22px -18px 20px}.parent-panel:before{margin:-20px -20px 20px}.complete-story:before{margin:-26px -22px 25px}
.task{color:#e7eeee;border-color:#d3ad6827}.task small,.story-content p,.upgrade-card p,.complete-empty{color:#a9c0c5}.task-icon{border:1px solid #6e9ca466;border-radius:3px;background:linear-gradient(145deg,#1b4a5c,#0a2938);filter:saturate(.8)}.check{border-radius:3px;border-color:#7c9da1}.task.done .check{background:#287b7b;border-color:#88d5cc}
.reward-pill,.story-trail span{border:1px solid #d3ad6870;border-radius:3px;color:#ead39b;background:#6c4c2266}
.story-button,.read-button,.add-task-form button,.back-to-journal,.primary-entry,.guest-banner button{border:1px solid #d3ad6899;border-radius:3px;background:linear-gradient(180deg,#1b6078,#0a344b);box-shadow:inset 0 0 0 1px #ffffff0c,0 5px 0 #03131f,0 10px 22px #0006;color:#fff;text-transform:uppercase;letter-spacing:.045em}
.pipo-message,.publication-note,.parent-note,.upgrade-card{border-radius:6px;background:linear-gradient(135deg,#123b50,#071a28);border:1px solid #d3ad6870;color:#eef4f2}.pipo-portrait{border-radius:4px;border-color:#d3ad68;clip-path:polygon(7% 0,93% 0,100% 7%,100% 93%,93% 100%,7% 100%,0 93%,0 7%)}
.page-intro,.parent-intro{background:radial-gradient(circle at 75% 10%,#1c5a70 0,#0b2c40 42%,#061724 100%);border-bottom:1px solid #d3ad6860}.page-intro:after{content:"";display:block;width:86px;height:2px;margin-top:20px;background:linear-gradient(90deg,#d3ad68,transparent)}
.village-scene{background:linear-gradient(#061b2b 0,#14536b 53%,#668f98 54%,#b9d2cf 100%);border-bottom:1px solid #d3ad6860}.building strong,.building small{background:#071a28dc;color:#e9eee9;border:1px solid #d3ad6844}.building .building-icon{color:#51351f;background:linear-gradient(#d2b170,#8c582b)}
.locked-art{background:linear-gradient(145deg,#17485e,#071925);color:#9bdce4}.story-requirement{border:1px solid #6c879044;border-radius:3px;background:#071925;color:#9eb1b4}.complete-story p,.complete-story li{color:#d4dedc}.complete-story article+article{border-color:#d3ad6855}
.parent-summary span{color:#95afb5}.parent-note{color:#bed0d2}.add-task-form input,.add-task-form select,.entry-dialog input{border:1px solid #d3ad6855;border-radius:3px;background:#061925;color:#eef4f2}
.bottom-nav{height:82px;background:linear-gradient(180deg,#0d3145f5,#04131ff7);border-top:1px solid #d3ad6877;box-shadow:0 -10px 30px #0007}.nav-item{color:#7fa1aa}.nav-item.active{color:#e0bd78;background:linear-gradient(180deg,#d3ad6814,transparent)}
dialog{border:1px solid #d3ad68;border-radius:6px;color:#dce8e7;background:linear-gradient(145deg,#123447,#061722)}dialog blockquote{background:#d3ad6817;border-color:#d3ad68}.dialog-close{border-radius:3px;background:#d3ad6822;color:#eee}
.welcome-gate{background:#061722;color:#dce8e7}.welcome-shade{background:linear-gradient(180deg,#03111d77 0%,#06172422 30%,#020a11f2 100%)}.welcome-actions{background:linear-gradient(180deg,#102f40,#061722);border-top:1px solid #d3ad6866}.account-entry{border-radius:4px;background:#0c2938;color:#dce8e7}.account-entry small,.trust-row{color:#96afb4}.studio-sign{color:#d3ad68}.guest-banner{color:#dfcfaa;background:#332817f2;border-color:#d3ad6866}
.zkg-controls{border-color:#d3ad6866;border-radius:4px;background:#061925e8}.zkg-controls button{border-radius:2px}.zkg-controls button.active{background:#d3ad68;color:#102432}
@media(min-width:700px){.app-shell{border-radius:4px}.bottom-nav{border-radius:0 0 4px 4px}.welcome-art,.welcome-actions{box-shadow:0 0 0 1px #d3ad6833,0 25px 80px #000b}}

/* 2.3.1 — slightly lighter, softer and rounder; brightness lift stays under 15% */
:root{--navy:#0a2130;--navy2:#103b52;--ink:#e3eceb;--panel:rgba(15,45,60,.96);--line:rgba(211,173,104,.25);--shadow:0 16px 46px rgba(0,10,17,.46)}
html,body{background:#071925}body{background:radial-gradient(circle at 50% -10%,#1b5b73 0,#0b2a3c 46%,#05141f 100%)}
.app-shell{background:linear-gradient(180deg,#174156 0,#0e2b3b 42%,#0a2230 100%);box-shadow:0 0 0 1px #d3ad683d,0 0 82px #000a}
.topbar{background:linear-gradient(180deg,#19465d,#0c2a3b);box-shadow:0 7px 24px #0006}
.avatar,.currency{background:linear-gradient(145deg,#20516a,#0c2b3e);border-radius:9px}.currency{border-radius:14px;clip-path:none}
.scene-shade{background:linear-gradient(180deg,#08253644 0%,#0a2b3b22 30%,#071a27e8 100%)}
.chapter-badge,.no-download-badge{border-radius:10px;background:linear-gradient(180deg,#20495dcc,#0c2b3bee)}
.progress-track{border-radius:7px;background:#061722b8}
.daily-card,.story-card,.parent-panel,.parent-summary div,.village-status,.complete-story{background:linear-gradient(145deg,#19475bf5,#0d2c3cf5);border-radius:13px}
.task-icon,.check,.reward-pill,.story-trail span,.story-requirement{border-radius:9px}.task-icon{background:linear-gradient(145deg,#24566a,#103748)}
.story-button,.read-button,.add-task-form button,.back-to-journal,.primary-entry,.guest-banner button{border-radius:10px;background:linear-gradient(180deg,#24718a,#0f465f);box-shadow:inset 0 0 0 1px #ffffff0d,0 4px 0 #082231,0 9px 19px #0004}
.pipo-message,.publication-note,.parent-note,.upgrade-card{border-radius:13px;background:linear-gradient(135deg,#194b60,#0c2939)}.pipo-portrait{border-radius:10px;clip-path:none}
.page-intro,.parent-intro{background:radial-gradient(circle at 75% 10%,#22677d 0,#10394d 42%,#0a2332 100%)}
.locked-art{background:linear-gradient(145deg,#20576d,#0d2c3d)}.add-task-form input,.add-task-form select,.entry-dialog input{border-radius:9px;background:#0b2938}
.bottom-nav{background:linear-gradient(180deg,#154156f2,#082230f7)}dialog{border-radius:13px;background:linear-gradient(145deg,#19475b,#0a2230)}.dialog-close{border-radius:9px}
.welcome-gate{background:#0a2230}.welcome-actions{background:linear-gradient(180deg,#174156,#0a2230)}.account-entry{border-radius:11px;background:#123749}.guest-banner{background:#40351ff0}
.zkg-controls{border-radius:11px;background:#0b2939e8}.zkg-controls button{border-radius:8px}
@media(min-width:700px){.app-shell{border-radius:14px}.bottom-nav{border-radius:0 0 14px 14px}}

/* 2.4.0 — clearer, brighter and friendlier for young readers */
html,body{background:#0d3042}body{background:#0d3042}
.app-shell{background:#123b4e}
.view{background:#123b4e}
.scene-shade,.welcome-shade{background:transparent}
.quest-scene,.welcome-art{isolation:isolate}
.quest-copy,.scene-progress,.welcome-copy{filter:drop-shadow(0 2px 5px rgba(0,12,20,.8))}
.welcome-copy p,.quest-copy>p:last-child{font-weight:700;text-shadow:0 2px 6px #001723}
.daily-card,.story-card,.parent-panel,.parent-summary div,.village-status,.complete-story{background:#1b5064}
.pipo-message,.publication-note,.parent-note,.upgrade-card{background:#17475b}
.page-intro,.parent-intro{background:#1a5369}
.welcome-gate{background:#123b4e}.welcome-actions{background:#17475b}
.crystal-mini,.crystal-big{color:#b58cff!important;text-shadow:0 0 8px #7543d9,0 0 16px #b58cff}
.currency{color:#d9c6ff;border-color:#a886e6}.reward-pill{color:#eadfff;background:#694a8e;border-color:#b997ef}.progress-track span{background:linear-gradient(90deg,#8156cc,#c29cff);box-shadow:0 0 14px #ac82ff}
.shield-mark{color:#d6baff}.story-button span{color:#d8baff}.nav-item.active span{color:#c8a1ff;filter:drop-shadow(0 0 8px #9a65ec)}
.task{min-height:68px}.task-title{font-size:17px}.task small{font-size:13px;line-height:1.35}.task-icon{width:48px;height:48px;font-size:24px}.check{width:30px;height:30px}
.story-button,.read-button,.add-task-form button,.back-to-journal,.primary-entry,.guest-banner button{min-height:48px;font-size:16px;text-transform:none;letter-spacing:.01em}
.nav-item small{font-size:12px}.nav-item span{font-size:27px}.bottom-nav{height:86px}
.story-content p,.publication-note p,.parent-note p{font-size:16px;line-height:1.65;color:#e0ebeb}.story-content h2{font-size:32px}
.complete-story{padding:28px 24px}.complete-story p,.complete-story li,#storyDialogContent p,#storyDialogContent li{font-family:Nunito,system-ui,sans-serif;font-size:18px;line-height:1.75;font-weight:600;color:#f0f5f4;letter-spacing:0}.complete-story h2,#storyDialogContent h2{line-height:1.15}.complete-story article+article{margin-top:38px;padding-top:34px}
.story-card img{filter:none;opacity:1}.pipo-portrait{filter:none}
.account-entry{background:#1c5063}.add-task-form input,.add-task-form select,.entry-dialog input{background:#123b4e;font-size:16px}
@media(max-width:380px){.complete-story p,.complete-story li,#storyDialogContent p,#storyDialogContent li{font-size:17px}.task-title{font-size:16px}}

/* 2.4.3: navigation flush with the viewport bottom, including safe areas. */
.app-shell .bottom-nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,580px);height:calc(86px + env(safe-area-inset-bottom,0px));padding:8px 10px calc(8px + env(safe-area-inset-bottom,0px));border-radius:14px 14px 0 0}
.app-shell .view{padding-bottom:calc(110px + env(safe-area-inset-bottom,0px))}
html{scroll-padding-bottom:calc(110px + env(safe-area-inset-bottom,0px))}

/* 2.4.4: compact controls integrated into existing headers. */
.zkg-header-left{display:flex;flex-direction:column;align-items:flex-start;gap:3px;flex:none}
.zkg-header-left .avatar{width:30px;height:30px;font-size:11px}
.zkg-header-left > .zkg-controls,.zkg-welcome-header > .zkg-controls{position:static;inset:auto;transform:none;box-shadow:none;flex:none;padding:2px;gap:1px}
.zkg-header-left .zkg-controls button,.zkg-welcome-header .zkg-controls button{min-width:30px;height:30px;padding:0 5px}
.topbar{gap:8px;padding-left:12px;padding-right:12px}
.topbar .brand{min-width:0;flex:1}
.topbar .brand-title{font-size:clamp(15px,3.5vw,22px);line-height:1.15;overflow-wrap:anywhere}
.topbar .currency{padding:7px 8px;flex:none}
.zkg-welcome-header{position:relative;z-index:2;display:flex;align-items:center;gap:14px}
.zkg-welcome-header .welcome-brand{flex:1;min-width:0}
.zkg-welcome-header .welcome-brand strong{font-size:clamp(18px,4.5vw,28px);overflow-wrap:anywhere}

/* 2.4.5 — official Zagrados world logo + updated Pipó tip portrait */
.world-logo{display:block;object-fit:contain;pointer-events:none;user-select:none;filter:drop-shadow(0 3px 7px rgba(0,0,0,.58))}
.welcome-brand{padding-top:46px}
.world-logo-welcome{width:min(250px,68vw);height:auto;margin:0 auto 5px}
.welcome-brand strong{margin-top:0;font-size:25px;letter-spacing:.08em}
.brand{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:122px}
.world-logo-topbar{width:112px;height:34px;margin:0 auto;object-fit:contain}
.brand-title{margin-top:1px!important;font-size:16px!important;line-height:1!important;letter-spacing:.06em}
.pipo-portrait{background-image:url('images/pipo-tip.jpg')!important;background-position:center!important;background-size:cover!important;background-repeat:no-repeat!important}
@media(max-width:420px){
  .welcome-brand{padding-top:50px}
  .world-logo-welcome{width:min(218px,62vw)}
  .welcome-brand strong{font-size:23px}
  .brand{min-width:104px}
  .world-logo-topbar{width:98px;height:31px}
  .brand-title{font-size:14px!important}
}

/* 2.4.6 — larger in-game Zagrados logo and child-friendly reading sizes */
/* The entry screen stays as-is; these changes apply after entering the adventure. */
#app .topbar{
  height:124px;
  position:sticky;
  padding:8px 12px 8px;
  align-items:flex-end;
  justify-content:space-between;
}
#app .brand{
  position:absolute;
  top:7px;
  left:50%;
  transform:translateX(-50%);
  width:min(220px,68vw);
  min-width:0;
  z-index:1;
}
#app .world-logo-topbar{
  width:min(210px,66vw);
  height:62px;
  margin:0 auto;
}
#app .brand-title{
  margin-top:0!important;
  font-size:17px!important;
  line-height:1.05!important;
}
#app .zkg-header-left{
  position:relative;
  z-index:2;
  flex-direction:row;
  align-items:center;
  gap:5px;
}
#app .topbar .currency{
  position:relative;
  z-index:2;
  margin-bottom:1px;
}
#app .guest-banner{top:124px}

/* Larger, easier-to-read in-game typography for young readers. */
#app{font-size:17px}
#app .guest-banner{font-size:13px;line-height:1.4}
#app .guest-banner button{font-size:13px;min-height:36px}
#app .chapter-badge{font-size:14px;line-height:1.25}
#app .greeting{font-size:17px;line-height:1.4}
#app .quest-copy>p:last-child{font-size:18px;line-height:1.55}
#app .progress-label{font-size:15px}
#app .eyebrow{font-size:13px;line-height:1.3}
#app .section-heading h2,#app .upgrade-card h2{font-size:28px;line-height:1.15}
#app .reward-pill{font-size:15px;line-height:1.2}
#app .task{min-height:76px}
#app .task-title{font-size:19px;line-height:1.28}
#app .task small{font-size:15px;line-height:1.45}
#app .story-button,#app .read-button,#app .add-task-form button,#app .back-to-journal{font-size:17px;line-height:1.25;min-height:52px}
#app .pipo-message p{font-size:17px;line-height:1.6}
#app .page-intro p{font-size:17px;line-height:1.6}
#app .building{font-size:15px;line-height:1.25}
#app .building small{font-size:13px;line-height:1.3}
#app .village-status{font-size:16px}
#app .upgrade-card p{font-size:16px;line-height:1.55}
#app .chapter-number{font-size:13px}
#app .story-content p,#app .publication-note p,#app .parent-note p{font-size:17px;line-height:1.65}
#app .story-content h2{font-size:33px;line-height:1.12}
#app .parent-summary span{font-size:13px;line-height:1.3}
#app .parent-summary strong{font-size:20px}
#app .parent-task{font-size:16px;line-height:1.4}
#app .add-task-form input,#app .add-task-form select{font-size:17px}
#app .nav-item small{font-size:13px;line-height:1.2}
#app .nav-item span{font-size:29px}
#app .complete-story p,#app .complete-story li,#app #storyDialogContent p,#app #storyDialogContent li{font-size:19px;line-height:1.78}

@media(max-width:420px){
  #app .topbar{height:120px}
  #app .brand{width:min(195px,61vw)}
  #app .world-logo-topbar{width:min(188px,59vw);height:58px}
  #app .brand-title{font-size:16px!important}
  #app .guest-banner{top:120px}
  #app .task-title{font-size:18px}
  #app .task small{font-size:14px}
  #app .story-content p,#app .publication-note p,#app .parent-note p{font-size:16.5px}
  #app .complete-story p,#app .complete-story li,#app #storyDialogContent p,#app #storyDialogContent li{font-size:18px}
}


/* 2.5.0 — Zagrados Kalandklub: warmer, clearer child-friendly interaction */
/* Keep the fantasy atmosphere, but make every important action easy to see, read and tap. */
.welcome-brand strong,#app .brand-title{letter-spacing:.08em}
.welcome-copy h1{line-height:.98;max-width:520px}
.welcome-copy p{font-size:19px;line-height:1.58;max-width:520px}
.primary-entry{min-height:60px;font-size:19px;border-radius:16px;padding:17px 20px}
.account-entry{min-height:68px;border-radius:16px}
.account-entry strong{font-size:16px}.account-entry small{font-size:13px;line-height:1.35}
.trust-row{font-size:13px;line-height:1.35}

#app{font-size:18px}
#app .quest-copy h1{line-height:1.02}
#app .quest-copy>p:last-child{font-size:19px;line-height:1.6}
#app .greeting{font-size:18px}
#app .chapter-badge{font-size:14px;padding:9px 13px;border-radius:12px}
#app .progress-label{font-size:16px;font-weight:800}
#app .progress-track{height:14px}

#app .daily-card{padding:24px 18px 20px;border-radius:20px}
#app .daily-card:before{margin:-24px -18px 20px}
#app .section-heading h2,#app .upgrade-card h2{font-size:30px}
#app .eyebrow{font-size:14px;letter-spacing:.11em}
#app .reward-pill{font-size:16px;padding:8px 11px;border-radius:12px}

#app .task-list{display:grid;gap:9px;margin:16px 0 18px}
#app .task{
  min-height:82px;
  margin:0;
  padding:13px 12px;
  border:1px solid rgba(185,231,235,.22);
  border-radius:16px;
  background:rgba(8,35,48,.48);
  grid-template-columns:52px 1fr 34px;
  transition:transform .14s ease,background .14s ease,border-color .14s ease;
}
#app .task:first-child{border-top:1px solid rgba(185,231,235,.22)}
#app .task:active{transform:scale(.985)}
#app .task.done{background:rgba(73,116,94,.36);border-color:rgba(168,230,194,.5)}
#app .task.done .task-title{text-decoration:none;color:#eef8f2}
#app .task.done .task-icon{transform:scale(1.04)}
#app .task-icon{width:50px;height:50px;border-radius:14px;font-size:25px}
#app .task-title{font-size:20px;line-height:1.3}
#app .task small{font-size:15.5px;line-height:1.45;color:#c5d8da}
#app .check{width:32px;height:32px;border-radius:10px;font-size:19px}

#app .story-button,#app .read-button,#app .add-task-form button,#app .back-to-journal{
  min-height:56px;
  font-size:18px;
  border-radius:14px;
  font-weight:900;
}
#app .story-button:disabled{opacity:.56;filter:saturate(.65)}
#app .story-button:not(:disabled){box-shadow:inset 0 0 0 1px #ffffff12,0 4px 0 #082231,0 0 24px rgba(181,140,255,.22)}

#app .pipo-message{grid-template-columns:92px 1fr;gap:17px;padding:18px;border-radius:18px}
#app .pipo-portrait{width:90px;height:90px;border-radius:14px}
#app .pipo-message p{font-size:18.5px;line-height:1.62;margin-top:6px}

#app .page-intro{padding:40px 24px 30px}
#app .page-intro h1{line-height:1.02}
#app .page-intro p{font-size:18px;line-height:1.65}
#app .story-content p,#app .publication-note p,#app .parent-note p{font-size:18px;line-height:1.72}
#app .story-requirement{display:block;margin-top:12px;padding:11px 12px;font-size:15px;line-height:1.45;border-radius:11px}
#app .read-button{padding-left:20px;padding-right:20px}

#app .building{font-size:16px}
#app .building small{font-size:13.5px}
#app .village-status{font-size:17px;border-radius:17px}
#app .upgrade-card{border-radius:17px;padding:19px}
#app .upgrade-card p{font-size:17px;line-height:1.6}

#app .bottom-nav{height:calc(92px + env(safe-area-inset-bottom,0px));padding-top:8px}
#app .nav-item{min-width:0;border-radius:13px}
#app .nav-item span{font-size:30px}
#app .nav-item small{font-size:14px;line-height:1.15;font-weight:900}
#app .nav-item.active{background:rgba(181,140,255,.11)}
#app .view{padding-bottom:calc(118px + env(safe-area-inset-bottom,0px))}
html{scroll-padding-bottom:calc(118px + env(safe-area-inset-bottom,0px))}

button:focus-visible,input:focus-visible,select:focus-visible{
  outline:3px solid #d3b4ff!important;
  outline-offset:3px;
}
.toast{max-width:calc(100vw - 28px);white-space:normal;text-align:center;font-size:15px;line-height:1.35}

@media(max-width:420px){
  .welcome-copy p{font-size:18px}
  .primary-entry{font-size:18px}
  #app{font-size:17.5px}
  #app .quest-copy>p:last-child{font-size:18px}
  #app .task{grid-template-columns:48px 1fr 32px;padding:12px 10px;min-height:78px}
  #app .task-icon{width:46px;height:46px}
  #app .task-title{font-size:18.5px}
  #app .task small{font-size:14.5px}
  #app .pipo-message{grid-template-columns:78px 1fr;gap:13px;padding:15px}
  #app .pipo-portrait{width:76px;height:76px}
  #app .pipo-message p{font-size:17.5px}
  #app .nav-item small{font-size:13px}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* 2.6.0 — interaktív könyv / hangoskönyv frissítés */
#app .story-card.open > img{
  display:block;
  width:100%;
  height:auto!important;
  max-height:none!important;
  object-fit:contain!important;
  object-position:center;
  background:#0b2b3d;
}

#app .experience-intro{
  margin:18px 14px;
  padding:22px 18px;
  border:1px solid #d3ad6870;
  border-radius:20px;
  background:linear-gradient(145deg,#1b5064,#0e3042);
  color:#eef6f5;
  box-shadow:var(--shadow);
}
#app .experience-heading h2,#app .season-goal-copy h2{
  margin:5px 0 9px;
  font:700 30px/1.08 Cormorant Garamond,serif;
  color:#f3efe4;
}
#app .experience-heading>p{
  margin:0;
  font-size:18px;
  line-height:1.65;
  color:#e0ebeb;
}
#app .experience-grid{
  display:grid;
  gap:12px;
  margin-top:18px;
}
#app .experience-grid article{
  display:grid;
  grid-template-columns:54px 1fr;
  gap:13px;
  align-items:start;
  padding:15px;
  border:1px solid #d3ad6840;
  border-radius:15px;
  background:#0b2f41b8;
}
#app .experience-icon{
  width:50px;
  height:50px;
  display:grid;
  place-items:center;
  border-radius:14px;
  background:#173f53;
  border:1px solid #d3ad6855;
  font-size:25px;
}
#app .experience-grid strong{
  display:block;
  margin:1px 0 5px;
  color:#fff4d3;
  font-size:18px;
  line-height:1.25;
}
#app .experience-grid p{
  margin:0;
  color:#dbe9e8;
  font-size:16.5px;
  line-height:1.58;
}

#app .season-goal-card{
  display:grid;
  grid-template-columns:68px 1fr;
  gap:16px;
  margin:18px 14px;
  padding:20px 18px;
  border:1px solid #b58cff88;
  border-radius:20px;
  background:linear-gradient(145deg,#273a62,#132b42 55%,#0b2637);
  box-shadow:var(--shadow),0 0 28px rgba(181,140,255,.12);
  color:#eff5f4;
}
#app .season-goal-icon{
  width:64px;
  height:76px;
  display:grid;
  place-items:center;
  border-radius:13px;
  background:linear-gradient(160deg,#44336a,#1a4660);
  border:1px solid #d7bdff77;
  font-size:32px;
  box-shadow:inset 0 0 0 2px #ffffff0a;
}
#app .season-goal-copy>p{
  margin:0 0 14px;
  color:#e1ebea;
  font-size:17px;
  line-height:1.62;
}
#app .story-season-progress{
  display:grid;
  gap:8px;
  margin-top:8px;
}
#app .story-season-progress .progress-track{
  height:13px;
  border:1px solid #d1bbff44;
  background:#071a2a;
}
#app .story-season-progress .progress-track span{
  background:linear-gradient(90deg,#8e6bd7,#d6b6ff);
  box-shadow:0 0 14px #a879ff88;
}
#app #storyProgressLabel{
  font-size:14.5px;
  color:#e9ddff;
}
#app .card-goal-status{
  margin:12px 0 0!important;
  padding:10px 12px;
  border-radius:12px;
  background:#071c2b99;
  color:#f4e5b1!important;
  font-size:15.5px!important;
  line-height:1.5!important;
}
#app .publication-note{
  margin-top:18px;
}
#app .publication-note strong{
  display:block;
  margin-bottom:5px;
  color:#f2d491;
  font-size:16px;
}

#storyDialog{
  width:min(92vw,680px);
  max-height:90vh;
  padding:18px 18px 28px;
  overflow:auto;
}
#storyDialog .story-dialog-toolbar{
  position:sticky;
  top:-18px;
  z-index:3;
  display:flex;
  justify-content:flex-start;
  margin:-18px 42px 18px -18px;
  padding:12px 12px 10px 18px;
  background:linear-gradient(180deg,#19475b 72%,transparent);
}
#storyDialog .story-audio-button{
  min-height:48px;
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:10px 15px;
  border:1px solid #d3ad6888;
  border-radius:13px;
  background:linear-gradient(180deg,#24718a,#0f465f);
  color:#fff;
  font:900 16px/1 Nunito,system-ui,sans-serif;
  box-shadow:0 4px 0 #082231;
  cursor:pointer;
}
#storyDialog .story-audio-button.is-speaking{
  background:linear-gradient(180deg,#69529a,#43356a);
  border-color:#d6baff;
}
#storyDialog .audio-icon{
  font-size:21px;
  line-height:1;
}
#storyDialog .story-dialog-image{
  display:block;
  width:calc(100% + 36px);
  height:auto;
  max-height:none;
  object-fit:contain;
  margin:-2px -18px 22px;
  background:#082331;
}
#storyDialogContent .eyebrow{
  display:block;
  margin-bottom:5px;
}
#storyDialogContent h2{
  margin-top:4px;
  font-size:34px;
}
#storyDialogContent blockquote{
  margin:22px 0;
  padding:16px 18px;
  border-left:4px solid #d3ad68;
  border-radius:0 12px 12px 0;
}
.account-subscription-copy{
  margin-top:12px;
  padding:12px 14px;
  border-radius:12px;
  background:#0c3041;
  color:#e8f0ef;
}
#app .subscription-note{border-color:#b58cff66}

@media(max-width:520px){
  #app .experience-intro{padding:19px 15px}
  #app .experience-grid article{grid-template-columns:48px 1fr;padding:13px}
  #app .experience-icon{width:45px;height:45px;font-size:22px}
  #app .experience-grid strong{font-size:17.5px}
  #app .experience-grid p{font-size:16px}
  #app .season-goal-card{grid-template-columns:1fr;gap:12px;padding:18px 16px}
  #app .season-goal-icon{width:58px;height:68px}
  #storyDialog{width:96vw;padding-left:15px;padding-right:15px}
  #storyDialog .story-dialog-toolbar{margin-left:-15px;margin-right:40px}
  #storyDialog .story-dialog-image{width:calc(100% + 30px);margin-left:-15px;margin-right:-15px}
}

/* 2.6.1 – Kalandnapló lenyíló blokkok */
#app .journal-fold > summary{
  list-style:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:12px;
  min-height:58px;
  padding:0;
  user-select:none;
}
#app .journal-fold > summary::-webkit-details-marker{display:none}
#app .journal-fold > summary .eyebrow{
  flex:1;
  color:#f2d491;
  font-size:14px;
  letter-spacing:.12em;
}
#app .journal-fold .fold-arrow{
  flex:0 0 auto;
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border-radius:50%;
  border:1px solid #d3ad6866;
  background:#071c2b88;
  color:#f4d891;
  font-size:25px;
  line-height:1;
  transition:transform .2s ease;
}
#app .journal-fold[open] .fold-arrow{transform:rotate(180deg)}
#app .journal-fold .journal-fold-content{padding-top:4px}
#app details.season-goal-card{
  display:block;
}
#app details.season-goal-card > summary{
  display:grid;
  grid-template-columns:54px 1fr 36px;
  gap:13px;
  align-items:center;
}
#app details.season-goal-card .season-goal-icon{
  width:50px;
  height:58px;
  font-size:26px;
}
#app details.season-goal-card .season-goal-copy{
  padding-top:10px;
}
#app .publication-note{
  margin:22px 14px 18px;
}

/* 2.6.2 – mobilon a Kalandklub felirat alatti vezérlők lejjebb kerülnek */
@media(max-width:420px){
  #app .topbar{height:130px}
  #app .zkg-header-left,#app .topbar .currency{transform:translateY(7px)}
  #app .guest-banner{top:130px}
}

/* 2.6.3 – a narráció elkészültéig a hangoskönyv gomb látható, de inaktív */
#zagrados-kalandkuldetes .story-audio-button:disabled {
  opacity: .52;
  cursor: not-allowed;
  filter: saturate(.65);
}

/* 2.6.4 – a játék jutalomnyelve egységesen kristálygyűjtésre váltott; a történet jelzőfénye változatlan. */
