/* ╔══════════════════════════════════════════════════════════════╗
   ║  FAIRYNESS · APP CHROME · שלד המיני-אפליקציה                   ║
   ║  נשען על core/fairyness.css (טוקנים, רכיבי .fy-*)              ║
   ╚══════════════════════════════════════════════════════════════╝ */

:root{
  --safe-top:    max(env(safe-area-inset-top, 0px), var(--tg-content-safe-area-inset-top, 0px));
  --safe-bottom: max(env(safe-area-inset-bottom, 0px), var(--tg-safe-area-inset-bottom, 0px));
  --topbar-h: 56px;
  --nav-h: 64px;
  --appw: 600px;
}

/* רקע עשיר גם לעולם הלילה (fairyness.css נותן עושר רק ל-day) */
[data-theme="night"] body, [data-theme="aurora"] body{
  background:
    radial-gradient(ellipse 120% 70% at 50% -8%, rgba(124,72,158,.40), transparent 60%),
    radial-gradient(ellipse 90% 60% at 100% 12%, rgba(228,135,174,.22), transparent 58%),
    radial-gradient(ellipse 80% 55% at 0% 70%, rgba(80,50,120,.34), transparent 60%),
    var(--bg);
  background-attachment: fixed;
}

/* ═══════════ ערכות-נושא נפתחות (קוסמטיקה) ═══════════ */
[data-theme="aurora"]{
  --bg:#0e0a1c; --bg-2:#1a1030; --surface:rgba(60,38,92,.42); --surface-2:rgba(70,44,110,.55); --surface-glass:rgba(60,38,92,.40);
  --brand:#e6a8f0; --brand-strong:#c97ae0; --brand-soft:#f3d4f9;
  --gold:#bfa8f0; --champagne:#e2d4f5;
  --text:#f6effb; --text-soft:#d8c6e6; --text-dim:#b0a0c2; --on-brand:#0e0a1c;
  --line:rgba(214,168,240,.26); --line-gold:rgba(200,180,245,.30);
  --glow:0 0 30px rgba(214,168,240,.22), 0 0 80px rgba(124,72,200,.16);
  --grad-shimmer:linear-gradient(110deg,#f3d4f9 12%,#c97ae0 36%,#bfa8f0 56%,#f3d4f9 82%);
  --grad-gold:linear-gradient(135deg,#bfa8f0,#e6a8f0);
  color-scheme:dark;
}
[data-theme="pearl"]{
  --bg:#FFFBFA; --bg-2:#FBEFF4; --surface:rgba(255,255,255,.62); --surface-2:rgba(255,248,251,.78); --surface-glass:rgba(255,253,252,.66);
  --brand:#E8A8C2; --brand-strong:#C97A9A; --brand-soft:#F8D6E6;
  --gold:#E0C088; --champagne:#F6E8CC;
  --text:#5A3346; --text-soft:#84566E; --text-dim:#A87E92; --on-brand:#FFFBFA;
  --line:rgba(201,122,154,.20); --line-gold:rgba(224,192,136,.40);
  --glow:0 18px 50px rgba(201,122,154,.16), 0 0 44px rgba(232,168,194,.22);
  --grad-shimmer:linear-gradient(105deg,#D8C0E8 0%,#FFF 18%,#FFE0EC 36%,#E0C088 52%,#D8C8F2 72%,#FFEAF4 88%,#D8C0E8 100%);
  --grad-gold:linear-gradient(135deg,#C8A860,#E8C888 45%,#F8EAC8 68%,#E8C888 100%);
  color-scheme:light;
}
[data-theme="pearl"] body, [data-theme="rosegold"] body{
  background:
    radial-gradient(ellipse 120% 70% at 50% -5%, rgba(248,214,230,.6) 0%, transparent 60%),
    radial-gradient(ellipse 80% 50% at 110% 60%, rgba(232,168,194,.30) 0%, transparent 55%),
    var(--bg);
  background-attachment:fixed;
}
[data-theme="rosegold"]{
  --bg:#FFF8F5; --bg-2:#FBE6DD; --surface:rgba(255,255,255,.58); --surface-2:rgba(255,244,238,.78); --surface-glass:rgba(255,251,248,.64);
  --brand:#E0A28E; --brand-strong:#C47A6A; --brand-soft:#F6D4C6;
  --gold:#D9A982; --champagne:#F4E3C2;
  --text:#5C3A30; --text-soft:#86574A; --text-dim:#AC7E70; --on-brand:#FFF8F5;
  --line:rgba(196,122,106,.22); --line-gold:rgba(217,169,130,.42);
  --glow:0 18px 50px rgba(196,122,106,.16), 0 0 44px rgba(224,162,142,.22);
  --grad-shimmer:linear-gradient(105deg,#EBC9B8 0%,#FFF 18%,#FBD9C8 36%,#D9A982 52%,#EBD0C0 72%,#FFE9DE 88%,#EBC9B8 100%);
  --grad-gold:linear-gradient(135deg,#C8975C,#E0B47C 45%,#F7E0B8 68%,#E0B47C 100%);
  color-scheme:light;
}

/* ═══════════ שלד ═══════════ */
.app{
  position:relative; z-index:2; max-width:var(--appw); margin:0 auto;
  padding: calc(var(--topbar-h) + var(--safe-top) + 12px) 16px calc(var(--nav-h) + var(--safe-bottom) + 22px);
  min-height:100dvh;
}
.app.no-chrome{ padding-top: calc(var(--safe-top) + 16px); padding-bottom: calc(var(--safe-bottom) + 24px); }

/* ═══════════ סרגל עליון ═══════════ */
.topbar{
  position:fixed; top:0; inset-inline:0; z-index:50;
  height:calc(var(--topbar-h) + var(--safe-top)); padding-top:var(--safe-top);
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  padding-inline:14px;
  background:linear-gradient(180deg, color-mix(in srgb, var(--bg) 86%, transparent), transparent);
  backdrop-filter:blur(8px);
}
.topbar[hidden]{ display:none; }
.tb-side{ display:inline-flex; align-items:center; gap:7px; padding:7px 13px; border-radius:99px;
  background:var(--surface); border:1px solid var(--line); backdrop-filter:blur(10px); min-height:38px;
  transition:transform .2s var(--ease-spring); }
.tb-side:active{ transform:scale(.94); }
.tb-level .tb-lv-num{ display:grid; place-items:center; width:22px; height:22px; border-radius:50%;
  background:var(--grad-gold); color:var(--on-brand); font-weight:800; font-size:.78rem; box-shadow:0 0 10px rgba(238,217,180,.5); }
.tb-level .tb-lv-title{ font-size:.78rem; font-weight:700; color:var(--champagne); }
.tb-spark{ }
.tb-spark .tb-sp-ico{ font-size:.95rem; filter:drop-shadow(0 0 6px rgba(242,179,205,.8)); }
.tb-spark .tb-sp-num{ font-weight:800; color:var(--brand-soft); font-size:.95rem; min-width:14px; text-align:center;
  text-shadow:0 0 12px rgba(242,179,205,.6); transition:transform .25s var(--ease-spring); }
.tb-spark.bump .tb-sp-num{ transform:scale(1.5); color:var(--gold); }
.tb-greet{ flex:1; text-align:center; overflow:hidden; }
.tb-greet .tb-hi{ font-family:var(--font-accent); font-size:.95rem; color:var(--text-soft); white-space:nowrap; }

/* ═══════════ ניווט תחתון ═══════════ */
.bottomnav{
  position:fixed; bottom:0; inset-inline:0; z-index:50;
  height:calc(var(--nav-h) + var(--safe-bottom)); padding-bottom:var(--safe-bottom);
  display:flex; align-items:stretch; justify-content:space-around;
  background:linear-gradient(0deg, color-mix(in srgb, var(--bg) 92%, transparent) 60%, transparent);
  backdrop-filter:blur(14px); border-top:1px solid var(--line);
}
.bottomnav[hidden]{ display:none; }
.bn-item{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px;
  color:var(--text-dim); font-size:.66rem; font-weight:600; position:relative; transition:color .25s; }
.bn-item .bn-i{ font-size:1.32rem; transition:transform .3s var(--ease-spring); filter:grayscale(.3) opacity(.8); }
.bn-item.active{ color:var(--brand-soft); }
.bn-item.active .bn-i{ transform:translateY(-3px) scale(1.18); filter:none; }
.bn-item.active::before{ content:""; position:absolute; top:6px; width:34px; height:34px; border-radius:50%;
  background:radial-gradient(circle, rgba(242,179,205,.30), transparent 70%); }
.bn-item .bn-t{ position:relative; }

/* ═══════════ הפיה נסיה (rig) ═══════════ */
.nesya{position:fixed;top:0;left:0;width:42px;height:auto;z-index:48;pointer-events:none;will-change:transform;
  filter:drop-shadow(0 0 12px rgba(255,236,246,.9)) drop-shadow(0 0 26px rgba(236,184,214,.55)) drop-shadow(0 0 46px rgba(206,166,228,.35));
  opacity:0;transition:opacity 1.2s ease;}
.nesya.awake{opacity:.97;}
.nesya svg{width:100%;height:auto;display:block;overflow:visible;}
.nesya svg *{transform-box:fill-box;}
.nesya-aura{animation:nesyaAura 3.6s ease-in-out infinite;transform-origin:center;}
@keyframes nesyaAura{0%,100%{opacity:.65;transform:scale(.95)}50%{opacity:.95;transform:scale(1.12)}}
.nesya-core{animation:nesyaCore 2.2s ease-in-out infinite;transform-origin:center;}
@keyframes nesyaCore{0%,100%{opacity:.6;transform:scale(.94)}50%{opacity:.95;transform:scale(1.06)}}
.nw-up{transform-origin:50% 88%;animation:nFlapUp var(--flap,.5s) ease-in-out infinite;}
.nw-lo{transform-origin:50% 12%;animation:nFlapLo var(--flap,.5s) ease-in-out infinite;}
@keyframes nFlapUp{0%,100%{transform:scaleX(1) rotate(0)}50%{transform:scaleX(.8) rotate(0)}}
@keyframes nFlapLo{0%,100%{transform:scaleX(1) rotate(0)}50%{transform:scaleX(.86) rotate(0)}}
.n-armwand{transform-origin:2% 88%;animation:nArmW 2.6s ease-in-out infinite;}
@keyframes nArmW{0%,100%{transform:rotate(0)}50%{transform:rotate(-7deg)}}
.n-armback{transform-origin:94% 6%;animation:nArmB 3s ease-in-out infinite;}
@keyframes nArmB{0%,100%{transform:rotate(0)}50%{transform:rotate(8deg)}}
.n-hair{transform-origin:50% 6%;animation:nHairSway 3.2s ease-in-out infinite;}
@keyframes nHairSway{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(2.5deg)}}
.n-legs{transform-origin:50% 4%;animation:nLegsSway 3.4s ease-in-out infinite;}
@keyframes nLegsSway{0%,100%{transform:rotate(-2deg)}50%{transform:rotate(2.5deg)}}
.n-skirt{transform-origin:50% 10%;animation:nSkirt 2.4s ease-in-out infinite;}
@keyframes nSkirt{0%,100%{transform:scaleX(1) skewX(0)}50%{transform:scaleX(1.04) skewX(-2deg)}}
.n-torso{transform-origin:50% 100%;animation:nBreathe 2.8s ease-in-out infinite;}
@keyframes nBreathe{0%,100%{transform:scaleY(1)}50%{transform:scaleY(1.02)}}
.nstar{transform-origin:center;animation:nStarTwinkle 1.8s ease-in-out infinite;}
.nsparkle{transform-origin:center;animation:nStarTwinkle 2.4s ease-in-out infinite;}
.nsparkle.b{animation-delay:1.1s;}
@keyframes nStarTwinkle{0%,100%{transform:scale(.8) rotate(0);opacity:.7}50%{transform:scale(1.2) rotate(45deg);opacity:1}}
.nesya-trail{position:fixed;inset:0;z-index:47;pointer-events:none;overflow:hidden;}
.ntrail{position:fixed;width:7px;height:7px;border-radius:50%;pointer-events:none;animation:ntFall 1.6s ease-out forwards;will-change:transform,opacity;}
@keyframes ntFall{0%{opacity:0;transform:translate(-50%,-50%) scale(.4)}18%{opacity:.95}100%{opacity:0;transform:translate(-50%,calc(-50% + 26px)) scale(1.1)}}
.nesya.hidden{ display:none; }

/* ═══════════ כותרות חדר ═══════════ */
.room-head{ text-align:center; margin: 6px 0 22px; }
.room-eyebrow{ font-family:var(--font-display); letter-spacing:.28em; font-size:.78rem; font-weight:700; color:var(--champagne); }
.room-title{ font-family:var(--font-display); font-weight:900; font-size:clamp(1.7rem,6.6vw,2.3rem); color:var(--brand-soft); line-height:1.18; margin-top:6px; }
.room-sub{ color:var(--text-soft); font-size:.98rem; margin-top:8px; }
.script-name{ font-family:var(--font-script); direction:ltr; color:var(--brand); font-size:1.7rem; display:inline-block; text-shadow:0 0 18px rgba(242,179,205,.45); }

/* ═══════════ מפת העולמות (פורטל) ═══════════ */
.worlds{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:6px; }
.world{ position:relative; border-radius:var(--radius); padding:20px 16px 18px; min-height:130px; overflow:hidden;
  background:var(--surface-glass); border:1px solid var(--line); backdrop-filter:blur(12px);
  display:flex; flex-direction:column; align-items:flex-start; gap:6px; text-align:right;
  box-shadow:var(--glow); transition:transform .3s var(--ease-spring), border-color .3s; }
.world:active{ transform:scale(.96); }
.world.wide{ grid-column:1 / -1; min-height:96px; flex-direction:row; align-items:center; gap:14px; }
.world .w-ico{ font-size:2rem; filter:drop-shadow(0 4px 10px rgba(0,0,0,.25)); }
.world .w-title{ font-family:var(--font-display); font-weight:800; font-size:1.12rem; color:var(--brand-soft); }
.world .w-desc{ font-size:.8rem; color:var(--text-soft); line-height:1.5; }
.world .w-badge{ position:absolute; top:10px; inset-inline-start:10px; font-size:.62rem; font-weight:800; letter-spacing:.08em;
  padding:3px 9px; border-radius:99px; background:var(--grad-gold); color:var(--on-brand); box-shadow:0 0 12px rgba(238,217,180,.5); }
.world::after{ content:""; position:absolute; inset:0; border-radius:inherit; opacity:0; pointer-events:none; transition:opacity .3s;
  background:radial-gradient(220px circle at 30% 0%, rgba(242,179,205,.16), transparent 70%); }
.world:hover::after{ opacity:1; }

/* ═══════════ כפתורים / שבבים נוספים ═══════════ */
.btn-row{ display:flex; gap:10px; flex-wrap:wrap; justify-content:center; margin-top:18px; }
.fy-btn.full, .fy-btn-ghost.full{ width:100%; justify-content:center; }
.mini-pill{ display:inline-flex; align-items:center; gap:6px; padding:6px 14px; border-radius:99px; font-size:.8rem; font-weight:700;
  background:var(--surface); border:1px solid var(--line); color:var(--text-soft); }
.lock-pill{ display:inline-flex; align-items:center; gap:6px; padding:5px 12px; border-radius:99px; font-size:.72rem; font-weight:800;
  background:rgba(238,217,180,.14); border:1px solid var(--line-gold); color:var(--champagne); }

/* ═══════════ סגמנט / טאבים ═══════════ */
.seg{ display:flex; gap:6px; padding:5px; border-radius:99px; background:var(--surface); border:1px solid var(--line); }
.seg button{ flex:1; padding:9px 6px; border-radius:99px; font-weight:700; font-size:.82rem; color:var(--text-dim); transition:.25s; }
.seg button.on{ background:var(--grad-gold); color:var(--on-brand); box-shadow:0 0 16px rgba(238,217,180,.4); }

/* ═══════════ פופ-אפ תגמול ═══════════ */
.reward{ position:fixed; inset:0; z-index:80; display:grid; place-items:center; padding:24px;
  background:radial-gradient(circle at 50% 40%, color-mix(in srgb, var(--bg) 40%, transparent), color-mix(in srgb, var(--bg) 84%, transparent));
  backdrop-filter:blur(6px); opacity:0; pointer-events:none; transition:opacity .4s; }
.reward.show{ opacity:1; pointer-events:auto; }
.reward-card{ text-align:center; max-width:340px; transform:scale(.86) translateY(10px); transition:transform .5s var(--ease-spring); }
.reward.show .reward-card{ transform:none; }
.reward-ico{ font-size:3.6rem; filter:drop-shadow(0 0 24px rgba(242,179,205,.7)); animation:fy-floaty 4s ease-in-out infinite; }
.reward-amt{ font-family:var(--font-display); font-weight:900; font-size:2.4rem; margin-top:8px;
  background:var(--grad-gold); -webkit-background-clip:text; background-clip:text; color:transparent; }
.reward-msg{ color:var(--text); font-size:1.08rem; margin-top:10px; line-height:1.6; }
.reward-tap{ color:var(--text-dim); font-size:.8rem; margin-top:22px; }

/* ═══════════ Toast ═══════════ */
.toast{ position:fixed; left:50%; transform:translateX(-50%) translateY(-20px); z-index:90;
  bottom:calc(var(--nav-h) + var(--safe-bottom) + 18px);
  background:var(--surface-2); border:1px solid var(--line-gold); color:var(--text); padding:11px 20px; border-radius:99px;
  font-weight:700; font-size:.9rem; box-shadow:var(--shadow-card); opacity:0; pointer-events:none; transition:.4s var(--ease-spring); white-space:nowrap; }
.toast.show{ opacity:1; transform:translateX(-50%) translateY(0); }

/* ═══════════ Bottom sheet / מודאל ═══════════ */
.sheet-back{ position:fixed; inset:0; z-index:70; background:rgba(10,6,16,.5); backdrop-filter:blur(4px); opacity:0; pointer-events:none; transition:opacity .35s; }
.sheet-back.show{ opacity:1; pointer-events:auto; }
.sheet{ position:fixed; inset-inline:0; bottom:0; z-index:71; max-width:var(--appw); margin:0 auto;
  background:var(--bg-2); border-radius:var(--radius-lg) var(--radius-lg) 0 0; border:1px solid var(--line); border-bottom:none;
  padding:18px 20px calc(var(--safe-bottom) + 24px); box-shadow:0 -20px 60px rgba(0,0,0,.5);
  transform:translateY(102%); transition:transform .45s var(--ease-spring); max-height:88dvh; overflow-y:auto; }
.sheet.show{ transform:none; }
.sheet-grip{ width:46px; height:5px; border-radius:99px; background:var(--line); margin:0 auto 14px; }

/* ═══════════ עזרי טקסט ═══════════ */
.center{ text-align:center; } .muted{ color:var(--text-dim); } .soft{ color:var(--text-soft); }
.mt8{margin-top:8px}.mt16{margin-top:16px}.mt24{margin-top:24px}
.empty{ text-align:center; color:var(--text-dim); padding:30px 16px; font-size:.92rem; }
.spin-load{ width:30px;height:30px;border-radius:50%;border:3px solid var(--line);border-top-color:var(--brand);animation:fy-rot .8s linear infinite;margin:30px auto; }
@keyframes fy-rot{to{transform:rotate(360deg)}}
textarea, input[type=text]{ width:100%; font-family:var(--font-body); font-size:1rem; color:var(--text);
  background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-sm); padding:13px 15px; resize:vertical; }
textarea:focus, input:focus{ outline:none; border-color:var(--brand); }
textarea::placeholder, input::placeholder{ color:var(--text-dim); }

@media (min-width:560px){ .worlds{ gap:16px; } }
@media (prefers-reduced-motion:reduce){ .nesya{ display:none; } }
