:root {
  --bg: #fff2fa;
  --card: #ffffff;
  --text: #2c1830;
  --muted: #8d7a92;
  --line: #f6def0;
  --brand: #b6178f;
  --brand-dark: #870f6c;
  --brand-soft: #fce8f8;
  --pink: #ff8fc7;
  --pink-soft: #ffe1f0;
  --lav: #b98cf2;
  --gold: #ffc95c;
  --green: #2bc48a;
  --amber: #ef9f2e;
  --shadow: 0 14px 40px rgba(148, 3, 130, .10);
  --radius-xl: 30px;
  --radius-lg: 24px;
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --ease-bounce: cubic-bezier(.34, 1.56, .64, 1);
  --ease-soft: cubic-bezier(.22, .7, .32, 1);
}

* { box-sizing: border-box; }
html { background: var(--bg); }
body {
  margin: 0;
  min-height: 100vh;
  background:
    radial-gradient(circle at 92% -8%, rgba(255, 143, 199, .22), transparent 38%),
    radial-gradient(circle at -8% 18%, rgba(185, 140, 242, .16), transparent 34%),
    radial-gradient(circle at 50% 100%, rgba(255, 201, 92, .10), transparent 40%),
    var(--bg);
  background-attachment: fixed;
  color: var(--text);
  font-family: "Quicksand", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  font-weight: 600;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
button, input, textarea { font: inherit; }
button { cursor: pointer; }
.hidden { display: none !important; }

h1, h2, h3 {
  font-family: "Baloo 2", "Quicksand", ui-sans-serif, sans-serif;
  font-weight: 700;
}

.app-shell {
  width: min(100%, 620px);
  min-height: 100vh;
  margin: 0 auto;
  padding: max(18px, env(safe-area-inset-top)) 18px calc(112px + var(--safe-bottom));
  position: relative;
}

.topbar { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:10px; margin:2px 2px 22px; animation: dropIn .6s var(--ease-bounce) both; }
.topbar h1, .section-heading h2, .section-heading h3 { margin:0; }
.brand-block { display:flex; align-items:center; justify-content:center; gap:10px; min-width:0; }
.brand-logo { width:40px; height:40px; border-radius:14px; object-fit:cover; box-shadow:0 8px 18px rgba(148,3,130,.28); flex:none; }
.brand-text { min-width:0; text-align:center; }
.brand-wordmark { font-family:"Pacifico", "Baloo 2", cursive; font-weight:400; }
.topbar h1.brand-wordmark { font-size:22px; letter-spacing:0; line-height:1.1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.brand-eyebrow { margin:2px 0 0; font-size:9px; letter-spacing:1.6px; font-weight:800; color:var(--pink); font-family:"Baloo 2", sans-serif; }
.gradient-text { background:linear-gradient(120deg, var(--brand-dark), var(--pink) 70%); -webkit-background-clip:text; background-clip:text; color:transparent; }
.eyebrow, .tiny-label { margin:0 0 4px; font-size:11px; letter-spacing:1.6px; font-weight:800; color:var(--brand); font-family:"Baloo 2", sans-serif; }
.top-actions { display:flex; gap:8px; justify-self:end; }
.icon-button, .ghost-small {
  border:1px solid var(--line); background:rgba(255,255,255,.9); color:var(--brand-dark);
  border-radius:999px; min-width:42px; height:42px; padding:0 14px; font-weight:800;
  box-shadow:0 6px 18px rgba(148,3,130,.08);
  transition: transform .2s var(--ease-bounce), box-shadow .2s ease, background .2s ease;
}
.icon-button:hover, .ghost-small:hover { transform: translateY(-2px) scale(1.04); box-shadow:0 10px 22px rgba(148,3,130,.14); background:#fff; }
.icon-button:active, .ghost-small:active { transform: translateY(0) scale(.94); }


/* Functional app menu */
.app-menu {
  position:absolute; top:68px; left:18px; width:min(310px, calc(100% - 36px)); z-index:45;
  padding:9px; border:1px solid var(--line); border-radius:22px; background:rgba(255,255,255,.97);
  backdrop-filter:blur(18px); box-shadow:0 20px 54px rgba(148,3,130,.18); animation:menuPop .22s var(--ease-bounce) both;
}
.app-menu-item {
  width:100%; border:0; background:transparent; border-radius:15px; padding:11px 12px; display:grid;
  grid-template-columns:34px 1fr; gap:10px; align-items:center; text-align:left; color:var(--text);
  transition:background .16s ease, transform .16s ease;
}
.app-menu-item:hover { background:var(--brand-soft); transform:translateX(2px); }
.app-menu-item:active { transform:scale(.98); }
.app-menu-item:disabled { opacity:.45; cursor:not-allowed; transform:none; }
.app-menu-item > span { width:34px; height:34px; display:grid; place-items:center; border-radius:11px; background:var(--pink-soft); color:var(--brand-dark); font-size:17px; }
.app-menu-item strong, .app-menu-item small { display:block; }
.app-menu-item strong { font-size:12px; color:var(--brand-dark); }
.app-menu-item small { margin-top:2px; color:var(--muted); font-size:9px; line-height:1.35; }
.app-menu-item.danger > span { background:#fff0f4; color:#d43868; }
.app-menu-item.danger strong { color:#b62d58; }
@keyframes menuPop { from { opacity:0; transform:translateY(-6px) scale(.97); } to { opacity:1; transform:translateY(0) scale(1); } }

.form-error {
  margin:0; padding:10px 12px; border:1px solid #ffd0df; border-radius:13px; background:#fff4f7;
  color:#c92e60; font-size:11px; line-height:1.45; font-weight:750;
}

/* Login */
.auth-loading { position:fixed;inset:0;z-index:2000;overflow:auto;min-height:100%;display:grid;place-items:center;padding:calc(24px + env(safe-area-inset-top)) 20px calc(24px + env(safe-area-inset-bottom));background:radial-gradient(ellipse at 4% 28%,#fff9f7,transparent 50%),radial-gradient(ellipse at 100% 70%,#cec7ee,transparent 55%),linear-gradient(140deg,#eee4ee,#f5dfe9 54%,#e1e2f1);isolation:isolate }
.auth-loading-card {
  width:min(100%,390px);padding:24px 12px;border:0;background:transparent;box-shadow:none;text-align:center;animation:none;position:relative;
}
.auth-loading::before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(56deg,transparent 28%,#ffffff55 28.3%,#ffffff18 44%,#ffffff80 44.3%,transparent 45%,transparent 65%,#ffffff50 65.3%,transparent 78%)}
.splash-halo{width:182px;height:182px;margin:auto;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle,#fff7,transparent 70%);animation:splashBreathe 3.8s ease-in-out infinite}
.splash-logo{width:110px;height:110px;border:0;background:transparent;box-shadow:none;transform:none;overflow:visible}
.splash-logo img{display:block;width:100%;height:100%;border-radius:31px;object-fit:contain;filter:drop-shadow(0 13px 20px rgba(112,72,126,.16))}
.auth-loading-card h2{letter-spacing:-.6px}
.auth-loading-card .splash-tagline{color:#7a6384;margin:8px 0 0;font-size:13px}
.splash-friends{display:flex;gap:15px;align-items:center;justify-content:center;margin:30px 0 26px;font-size:27px}
.splash-heart{color:#cb5c9d;animation:splashBreathe 3.8s ease-in-out infinite}
.splash-pill{display:inline-flex;align-items:center;gap:10px;border:1px solid #ffffffa6;border-radius:99px;padding:12px 17px;background:linear-gradient(135deg,#ffffff60,#ffffff24);box-shadow:inset 0 1px 1px #fff8;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);font-size:13px;color:#74547e}
.splash-pill i{flex:0 0 6px;height:6px;border-radius:50%;background:#cb5c9d;animation:splashBreathe 2s ease-in-out infinite}
.splash-retry{margin:14px auto 0;min-height:42px;padding:9px 18px;border:1px solid #ffffffb8;border-radius:999px;background:#ffffff50;color:#684070;font:inherit;font-size:12px;font-weight:800;box-shadow:inset 0 1px 1px #fff8;cursor:pointer}.splash-retry:active{transform:scale(.97)}
.auth-loading-card .splash-footer{margin:64px 0 0;font-size:10px;letter-spacing:2px;color:#846e8f}
@keyframes splashBreathe{0%,100%{opacity:.65}50%{opacity:1}}
@media(prefers-reduced-motion:reduce){.splash-halo,.splash-heart,.splash-pill i{animation:none}}
.loading-couple { display:flex; justify-content:center; align-items:center; gap:12px; font-size:32px; }
.loading-couple b { color:var(--pink); font-size:26px; animation:heartPulse 1.4s ease-in-out infinite; }
.loading-heart { margin:15px auto 8px; font-size:38px; filter:drop-shadow(0 8px 12px rgba(182,23,143,.2)); animation:heartPulse 1.25s ease-in-out infinite; }
.auth-loading-card h2 { margin:0; color:var(--brand-dark); font-size:23px; }
.auth-loading-card p { margin:4px 0 15px; color:var(--muted); font-size:12px; }
.loading-dots { display:flex; justify-content:center; gap:7px; }
.loading-dots i { width:8px; height:8px; border-radius:50%; background:var(--pink); animation:loadingDot 1s ease-in-out infinite; }
.loading-dots i:nth-child(2) { animation-delay:.14s; }
.loading-dots i:nth-child(3) { animation-delay:.28s; }
@keyframes loadingDot { 0%,100% { opacity:.3; transform:translateY(0); } 50% { opacity:1; transform:translateY(-5px); } }

.auth-wrap { min-height:68vh; display:grid; place-items:center; }
.auth-card {
  position:relative; width:100%; background:rgba(255,255,255,.94); border:1px solid var(--line);
  border-radius:34px; padding:30px 26px; box-shadow:0 26px 64px rgba(148,3,130,.16); text-align:center; overflow:hidden;
  animation: popIn .65s var(--ease-bounce) both;
}
.cute-auth-card::before {
  content:""; position:absolute; width:240px; height:240px; border-radius:50%;
  background:radial-gradient(circle, rgba(255,143,199,.16), transparent 70%); right:-100px; top:-100px;
  animation: blobDrift 7s ease-in-out infinite;
}
.cute-auth-card::after {
  content:""; position:absolute; width:200px; height:200px; border-radius:50%;
  background:radial-gradient(circle, rgba(185,140,242,.14), transparent 70%); left:-90px; bottom:-90px;
  animation: blobDrift 8s ease-in-out infinite reverse;
}

.float-heart { position:absolute; font-size:16px; opacity:0; animation: heartRise 6s ease-in infinite; pointer-events:none; filter:drop-shadow(0 2px 4px rgba(148,3,130,.15)); }
.heart-a { left:14%; animation-delay:.2s; }
.heart-b { left:52%; animation-delay:2.1s; font-size:13px; }
.heart-c { left:78%; animation-delay:3.8s; font-size:18px; }

.cat-stage { position:relative; min-height:150px; display:grid; place-items:end center; margin-bottom:6px; z-index:1; }
.cat-character {
  font-size:76px; filter:drop-shadow(0 16px 14px rgba(140,20,110,.14));
  animation: catFloat 2.8s var(--ease-soft) infinite;
  transform-origin: bottom center;
}
.cat-paws { position:absolute; bottom:-2px; right:calc(50% - 64px); font-size:19px; transform:rotate(10deg); animation: pawWiggle 2.8s ease-in-out infinite; }
.paw-trail { position:absolute; bottom:-6px; left:8%; display:flex; gap:22px; z-index:0; }
.paw-trail span { font-size:14px; opacity:0; color:var(--pink); animation: pawStep 3.6s ease-in-out infinite; }
.paw-trail span:nth-child(1) { animation-delay:0s; transform:rotate(-15deg); }
.paw-trail span:nth-child(2) { animation-delay:.4s; transform:translateY(-8px) rotate(8deg); }
.paw-trail span:nth-child(3) { animation-delay:.8s; transform:rotate(-6deg); }

.cat-speech {
  position:relative; z-index:2; top:3px; left:50%; transform:translateX(-50%); min-width:225px; margin-bottom: 2px;
  background:#fff; border:1px solid var(--line); border-radius:22px 22px 22px 8px; padding:12px 17px;
  box-shadow:0 12px 32px rgba(148,3,130,.10); color:var(--muted); font-size:12px;
  animation: speechPop .7s .3s var(--ease-bounce) both;
}
.cat-speech span, .cat-speech strong { display:block; }
.cat-speech strong { color:var(--brand); margin-top:3px; font-size:15px; font-family:"Baloo 2", sans-serif; }
.login-kicker { margin:10px 0 5px; color:var(--brand); font-size:10px; font-weight:800; letter-spacing:1.8px; font-family:"Baloo 2", sans-serif; }
.auth-card h2 { margin:0 0 8px; font-size:26px; background:linear-gradient(120deg, var(--brand-dark), var(--pink) 70%); -webkit-background-clip:text; background-clip:text; color:transparent; }
.login-subtitle { line-height:1.6; max-width:430px; margin:0 auto; }
.login-sparkle { position:absolute; color:var(--pink); animation: sparkle 2.4s ease-in-out infinite; }
.sparkle-one { top:28px; left:28px; } .sparkle-two{top:68px;right:28px;animation-delay:.6s;color:var(--lav)} .sparkle-three{bottom:30px;left:25px;animation-delay:1.2s;color:var(--gold)}
.stack { display:grid; gap:15px; margin-top:22px; text-align:left; }
label { display:grid; gap:7px; font-weight:750; font-size:13px; }
input, textarea {
  width:100%; border:2px solid var(--line); background:#fff; color:var(--text); border-radius:16px; padding:14px 15px; outline:none;
  transition:border .2s var(--ease-soft), box-shadow .2s var(--ease-soft), transform .15s ease;
}
input:focus, textarea:focus { border-color:var(--pink); box-shadow:0 0 0 5px rgba(255,143,199,.18); transform: translateY(-1px); }
.password-field{position:relative;display:block}.password-field input{padding-right:52px}
.password-toggle{position:absolute;right:7px;top:50%;transform:translateY(-50%);width:40px;height:40px;border:0;border-radius:12px;background:transparent;display:grid;place-items:center;font-size:18px;line-height:1;cursor:pointer;color:var(--brand);transition:background .18s ease,transform .18s ease}
.password-toggle:hover{background:var(--brand-soft)}.password-toggle:active{transform:translateY(-50%) scale(.88)}
.password-toggle:focus-visible{outline:2px solid rgba(148,3,130,.35);outline-offset:1px}
textarea { resize:vertical; }
.primary-btn,.secondary-btn,.ghost-btn { border:0; border-radius:17px; padding:15px 18px; font-weight:800; font-family:"Baloo 2", sans-serif; letter-spacing:.2px; }
.primary-btn {
  position:relative; overflow:hidden;
  background:linear-gradient(120deg, var(--brand), var(--pink)); color:#fff; box-shadow:0 12px 26px rgba(182,23,143,.28);
  transition: transform .18s var(--ease-bounce), box-shadow .18s ease;
}
.primary-btn::after {
  content:""; position:absolute; inset:0; background:linear-gradient(115deg, transparent 30%, rgba(255,255,255,.4) 50%, transparent 70%);
  transform: translateX(-120%); animation: shimmer 3.2s ease-in-out infinite;
}
.primary-btn:hover { transform: translateY(-2px) scale(1.015); box-shadow:0 16px 32px rgba(182,23,143,.34); }
.primary-btn:active { transform: translateY(0) scale(.97); }
.secondary-btn { background:var(--brand-soft); color:var(--brand-dark); transition: transform .18s var(--ease-bounce), background .2s ease; }
.secondary-btn:hover { transform: translateY(-2px); background:#f8d9f2; }
.secondary-btn:active { transform: scale(.97); }
.ghost-btn{background:#f9f2f7;color:var(--text); transition: transform .18s var(--ease-bounce);}
.ghost-btn:hover { transform: translateY(-2px); }
.demo-login{display:grid;gap:10px;margin-top:22px}
.error-text{color:#e0316f;font-size:13px;min-height:18px;margin:13px 0 0; font-weight:700;}
.muted{color:var(--muted);margin:0}

/* Time pair */
.time-pair-card {
  display:grid; grid-template-columns:1fr auto 1fr; gap:14px; align-items:center;
  background:rgba(255,255,255,.92); border:1px solid var(--line); border-radius:24px; padding:17px;
  box-shadow:0 10px 32px rgba(148,3,130,.07);
  animation: popIn .5s var(--ease-bounce) both;
}
.time-person strong { display:block; font-size:19px; font-family:"Baloo 2", sans-serif; color:var(--brand-dark); }
.time-person span{display:block;margin-top:3px;color:var(--muted);font-size:11px}
.time-person.right{text-align:right}
.time-heart{width:40px;height:40px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(135deg, var(--pink-soft), var(--brand-soft));font-size:18px;animation:heartPulse 1.9s ease-in-out infinite; box-shadow: 0 6px 16px rgba(255,143,199,.35);}

.section-block { margin-top:28px; }
.section-heading{display:flex;align-items:center;justify-content:space-between;margin:0 2px 14px}
.section-heading h2{font-size:24px;letter-spacing:-.4px; color:var(--brand-dark);}
.section-heading h3{font-size:21px;letter-spacing:-.2px; color:var(--brand-dark);}
.pair-heading{margin-top:26px}
.pair-chip,.date-chip{background:#fff;border:1px solid var(--line);padding:8px 12px;border-radius:999px;font-size:13px;font-weight:750;color:var(--muted); box-shadow:0 4px 14px rgba(148,3,130,.06);}
.pair-chip { animation: gentleSway 3s ease-in-out infinite; }

/* Dual status cards */
.pair-status-grid { position:relative; display:grid; grid-template-columns:1fr 1fr; gap:14px; padding-top:19px; }
.person-status-card {
  position:relative; overflow:visible; min-height:290px; border-radius:29px; padding:20px;
  color:#fff; background:linear-gradient(150deg,#d94fc4 0%,#b6178f 55%, #870f6c 100%);
  box-shadow:0 20px 46px rgba(148,3,130,.24);
  transition:transform .28s var(--ease-bounce), box-shadow .28s ease;
  animation: popIn .6s var(--ease-bounce) both;
}
.person-status-card:hover { transform: translateY(-4px) rotate(-.4deg); box-shadow:0 26px 54px rgba(148,3,130,.30); }
.partner-card:hover { transform: translateY(12px) rotate(.4deg); }
.person-status-card::after{content:"♥";position:absolute;right:2px;bottom:-28px;font-size:126px;line-height:1;color:rgba(255,255,255,.09);transform:rotate(-12deg);pointer-events:none;overflow:hidden}
.person-status-card.free{background:linear-gradient(150deg,#4fe0a6,#1fae76 60%,#0f8f5f)}
.person-status-card.limited{background:linear-gradient(150deg,#ffcf7a,#ef9f2e 60%,#c97c14)}
.person-status-card.missing{background:linear-gradient(150deg,#c9b3ce,#96849b 60%,#75647a)}
.partner-card{transform:translateY(17px); animation-delay: .1s;}
.card-peek { position:absolute; top:-32px; z-index:5; font-size:37px; filter:drop-shadow(0 8px 10px rgba(120,10,95,.16)); animation:peekBob 2.6s var(--ease-soft) infinite; }
.owner-peek{left:18px}
.partner-peek{right:20px;animation-delay:.7s}
.person-card-top{position:relative;z-index:2;display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.person-identity{margin:0 0 5px;font-size:10px;font-weight:800;letter-spacing:1.1px;color:rgba(255,255,255,.82); font-family:"Baloo 2", sans-serif;}
.person-status-label{font-size:11px;font-weight:800;letter-spacing:1px; padding:3px 9px; border-radius:999px; background:rgba(255,255,255,.20); display:inline-block; animation: labelGlow 2.4s ease-in-out infinite;}
.person-updated{font-size:10px;color:rgba(255,255,255,.75);white-space:nowrap}
.person-activity{position:relative;z-index:2;display:flex;align-items:center;gap:12px;margin-top:24px}
.person-emoji{width:50px;height:50px;display:grid;place-items:center;border-radius:17px;background:rgba(255,255,255,.18);font-size:26px; animation: emojiBounce 2.4s ease-in-out infinite;}
.person-now-label{margin:0;color:rgba(255,255,255,.75);font-size:11px}
.person-activity h3{margin:3px 0 0;font-size:22px;line-height:1.1;letter-spacing:-.4px; font-family:"Baloo 2", sans-serif;}
.person-message{position:relative;z-index:2;margin:19px 0 0;font-size:13px;line-height:1.55;color:#fff;min-height:40px}
.person-until{position:relative;z-index:2;margin-top:15px;padding-top:13px;border-top:1px dashed rgba(255,255,255,.28);display:grid;grid-template-columns:auto 1fr;gap:3px 9px;align-items:baseline;font-size:10px;color:rgba(255,255,255,.8)}
.person-until strong{font-size:16px;color:#fff; font-family:"Baloo 2", sans-serif;}
.person-until small{grid-column:1/-1;color:rgba(255,255,255,.72);font-size:9px}
.person-until b{position:absolute;right:0;top:13px;color:#fff;font-size:10px}

.flying-butterfly{position:absolute;z-index:8;left:47%;top:-10px;font-size:23px;filter:drop-shadow(0 6px 5px rgba(120,10,95,.14));animation:butterflyFlight 9s ease-in-out infinite;pointer-events:none}
.tiny-sparkle{position:absolute;color:var(--pink);z-index:7}
.pair-sparkle-one{left:-4px;top:48%;animation:sparkle 2.5s ease-in-out infinite}
.pair-sparkle-two{right:0;top:22%;animation:sparkle 2.5s .8s ease-in-out infinite; color:var(--lav);}
.pair-sparkle-three{left:20%;top:-6px;font-size:13px;animation:sparkle 3s 1.3s ease-in-out infinite;}
.pair-sparkle-four{right:16%;bottom:-6px;font-size:12px;color:var(--gold);animation:sparkle 2.8s .4s ease-in-out infinite;}

/* Schedules */
.day-panels{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.day-panel{background:rgba(255,255,255,.85);border:1px solid var(--line);border-radius:24px;padding:14px;min-width:0; box-shadow:0 8px 24px rgba(148,3,130,.05); transition: transform .2s var(--ease-bounce); animation: popIn .5s var(--ease-bounce) both;}
.day-panel:hover { transform: translateY(-3px); }
.day-panel-head>div{display:flex;align-items:center;gap:10px}
.day-avatar{width:41px;height:41px;display:grid;place-items:center;background:linear-gradient(135deg, var(--brand-soft), var(--pink-soft));border-radius:14px;font-size:21px; animation: gentleSway 4s ease-in-out infinite;}
.day-panel-head strong{display:block;font-size:14px; font-family:"Baloo 2", sans-serif; color:var(--brand-dark);}
.day-panel-head small{display:block;color:var(--muted);font-size:10px;margin-top:2px}
.schedule-list{display:grid;gap:8px;margin-top:12px}
.schedule-item{display:grid;grid-template-columns:38px minmax(0,1fr);gap:9px;align-items:center;padding:10px;border:1px solid var(--line);border-radius:17px;background:#fff; transition: transform .15s ease, box-shadow .15s ease;}
.schedule-item:hover{ transform: translateX(2px); }
.schedule-item.active{border-color:var(--pink);box-shadow:0 8px 20px rgba(255,143,199,.18)}
.schedule-emoji{width:36px;height:36px;display:grid;place-items:center;border-radius:13px;background:var(--pink-soft);font-size:18px}
.schedule-info strong{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.schedule-info span{display:block;color:var(--muted);font-size:9px;margin-top:2px}
.schedule-description{grid-column:2;margin:0;color:var(--text);font-size:10px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}
.schedule-once-badge{grid-column:2;width:max-content;padding:3px 7px;border-radius:999px;background:var(--brand-soft);color:var(--brand);font-size:8px;font-weight:850}
.schedule-time{grid-column:1/-1;padding-left:47px;color:var(--muted);font-size:10px;line-height:1.5}
.schedule-time b{color:var(--text);font-size:10px}
.schedule-time small{display:block;color:var(--muted);font-size:9px}
.empty-card{border:2px dashed #f3c9e8;border-radius:18px;padding:20px;text-align:center;color:var(--muted);background:rgba(255,255,255,.6)}
.empty-card.compact{margin-top:12px;padding:16px}
.empty-card span{font-size:25px; display:inline-block; animation: gentleSway 3s ease-in-out infinite;}
.empty-card p{margin:6px 0 0;font-size:11px}
.together-card{display:flex;align-items:center;gap:13px;margin-top:16px;padding:16px;border:1px solid var(--line);border-radius:21px;background:#fff; box-shadow:0 8px 24px rgba(148,3,130,.05); animation: popIn .55s var(--ease-bounce) both;}
.together-card>div{flex:1}
.together-card strong{font-size:13px; font-family:"Baloo 2", sans-serif; color:var(--brand-dark);}
.together-animal{width:46px;height:46px;display:grid;place-items:center;background:linear-gradient(135deg, var(--pink-soft), var(--brand-soft));border-radius:15px;font-size:23px; animation: catFloat 3.4s var(--ease-soft) infinite;}
.together-card > span[aria-hidden] { animation: sparkle 2.2s ease-in-out infinite; color: var(--gold); }
.sync-state{
  width:max-content;max-width:100%;margin:24px auto 0;padding:8px 12px;border-radius:999px;
  text-align:center;font-size:11px;font-weight:800;transition:.2s ease;
}
.sync-state.online{color:#16895d;background:#eafaf3;border:1px solid #c8f0df}
.sync-state.connecting{color:#8b5a14;background:#fff8e8;border:1px solid #f4dfad}
.sync-state.offline{color:#9a5a17;background:#fff4e5;border:1px solid #f1d2a8}
.sync-state.error{color:#b5315d;background:#fff0f5;border:1px solid #f4c8d8}

/* Editor */
.admin-heading{margin-top:4px}
.editor-zone-hint{margin:5px 0 0;color:var(--muted);font-size:11px}
.quick-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.quick-grid button{min-height:82px;display:grid;place-items:center;gap:5px;border:2px solid var(--line);background:#fff;border-radius:20px;font-size:23px; transition: transform .18s var(--ease-bounce), border-color .2s ease, background .2s ease;}
.quick-grid button:hover { transform: translateY(-3px) scale(1.03); }
.quick-grid button:active { transform: scale(.95); }
.quick-grid button span{font-size:10px;font-weight:800;color:var(--muted)}
.quick-grid button.selected{border-color:var(--brand);background:var(--brand-soft); box-shadow: 0 8px 20px rgba(182,23,143,.15);}
.edit-card{background:#fff;border:1px solid var(--line);border-radius:24px;padding:19px;margin-top:18px; box-shadow:0 8px 24px rgba(148,3,130,.05);}
.toggle-row{grid-template-columns:auto 1fr;align-items:center;gap:11px}
.toggle-row input{width:21px;height:21px;accent-color:var(--brand)}
.toggle-row strong{display:block;font-size:13px}
.toggle-row small,.timezone-hint{display:block;color:var(--muted);font-weight:500;font-size:10px}
.schedule-editor-section{padding-bottom:10px}
.schedule-editor{display:grid;gap:10px}
.editor-row{display:grid;grid-template-columns:46px minmax(0,1fr) auto;gap:10px;align-items:center;padding:11px;border-radius:17px;background:#fff;border:1px solid var(--line)}
.editor-row-emoji{width:44px;height:44px;display:grid;place-items:center;border-radius:14px;background:var(--pink-soft);font-size:21px}
.editor-row-copy{min-width:0}.editor-row-copy strong{display:block;color:var(--brand-dark);font-size:13px}.editor-row-copy span{display:block;margin-top:2px;color:var(--muted);font-size:10px}.editor-row-copy p{margin:5px 0 0;color:var(--text);font-size:10px;line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere}
.repeat-badge{display:inline-block!important;width:max-content;margin-top:5px!important;padding:3px 7px;border-radius:999px;font-size:8px!important;font-weight:850}.repeat-badge.weekly{background:#e7f8ef;color:#14815a!important}.repeat-badge.once{background:var(--brand-soft);color:var(--brand)!important}
.editor-row-actions{display:flex;align-items:center;gap:6px}.edit-row{min-height:32px;padding:0 10px;border:0;border-radius:11px;background:var(--brand-soft);color:var(--brand);font-size:10px;font-weight:850}
.delete-row{width:32px;height:32px;border-radius:11px;border:0;background:var(--brand-soft);color:var(--brand); transition: transform .15s var(--ease-bounce);}
.delete-row:hover { transform: scale(1.08) rotate(-6deg); }
.full{width:100%;margin-top:12px}

.bottom-nav{
  position:fixed;left:50%;bottom:calc(14px + var(--safe-bottom));transform:translateX(-50%);
  width:min(calc(100% - 36px),584px);display:grid;grid-template-columns:repeat(3, 1fr);padding:8px;
  border:1px solid rgba(246,222,240,.9);border-radius:24px;background:rgba(255,255,255,.92);
  backdrop-filter:blur(18px);box-shadow:0 14px 38px rgba(148,3,130,.16);z-index:20;
  animation: floatUp .5s var(--ease-bounce) both;
}
.nav-item{border:0;background:transparent;border-radius:17px;min-height:55px;color:var(--muted);display:grid;place-items:center;gap:2px; transition: transform .2s var(--ease-bounce), background .2s ease, color .2s ease;}
.nav-item span{font-size:20px;line-height:1}
.nav-item small{font-size:10px;font-weight:800}
.nav-item.active{background:linear-gradient(135deg, var(--brand-soft), var(--pink-soft));color:var(--brand); transform: translateY(-2px);}
.nav-item:active { transform: scale(.94); }
.toast{position:fixed;left:50%;bottom:calc(94px + var(--safe-bottom));transform:translateX(-50%);z-index:50;background:#2c1830;color:#fff;border-radius:999px;padding:12px 17px;font-size:12px;box-shadow:0 12px 34px rgba(0,0,0,.20); font-weight:700; animation: toastPop .35s var(--ease-bounce) both;}
.install-hint{position:fixed;z-index:60;left:18px;right:18px;bottom:calc(18px + var(--safe-bottom));max-width:524px;margin:auto;border-radius:22px;padding:19px;background:#fff;border:1px solid var(--line);box-shadow:0 20px 54px rgba(148,3,130,.20); animation: floatUp .4s var(--ease-bounce) both;}
.install-hint strong { font-family:"Baloo 2", sans-serif; color:var(--brand-dark); }
.install-hint p{margin:7px 0 12px;color:var(--muted);font-size:13px;line-height:1.5}

/* ===== Keyframes ===== */
@keyframes catFloat{
  0%,100%{transform:translateY(0) rotate(-2deg) scale(1)}
  45%{transform:translateY(-7px) rotate(2deg) scale(1.02)}
  50%{transform:translateY(-8px) rotate(2deg) scale(1.03)}
  75%{transform:translateY(-3px) rotate(-1deg) scale(1.01)}
}
@keyframes pawWiggle{0%,100%{transform:rotate(10deg)}50%{transform:rotate(-6deg) translateY(-2px)}}
@keyframes pawStep{
  0%{opacity:0; transform:translateY(4px) scale(.8) rotate(-15deg);}
  15%{opacity:.55;}
  35%{opacity:.55;}
  55%{opacity:0; transform:translateY(-6px) scale(1) rotate(-15deg);}
  100%{opacity:0;}
}
@keyframes peekBob{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-6px) rotate(-4deg)}}
@keyframes sparkle{0%,100%{opacity:.3;transform:scale(.8) rotate(0deg)}50%{opacity:1;transform:scale(1.2) rotate(12deg)}}
@keyframes heartPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.12)}}
@keyframes butterflyFlight{
  0%{transform:translate(-80px,14px) rotate(-12deg)}
  25%{transform:translate(-10px,-16px) rotate(8deg)}
  50%{transform:translate(75px,8px) rotate(-8deg)}
  75%{transform:translate(15px,23px) rotate(10deg)}
  100%{transform:translate(-80px,14px) rotate(-12deg)}
}
@keyframes popIn{
  0%{opacity:0; transform: translateY(14px) scale(.96);}
  100%{opacity:1; transform: translateY(0) scale(1);}
}
@keyframes dropIn{
  0%{opacity:0; transform: translateY(-10px);}
  100%{opacity:1; transform: translateY(0);}
}
@keyframes floatUp{
  0%{opacity:0; transform: translate(-50%, 18px);}
  100%{opacity:1; transform: translate(-50%, 0);}
}
@keyframes toastPop{
  0%{opacity:0; transform: translate(-50%, 10px) scale(.9);}
  100%{opacity:1; transform: translate(-50%, 0) scale(1);}
}
@keyframes blobDrift{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-12px,10px) scale(1.08)}}
@keyframes heartRise{
  0%{opacity:0; transform: translateY(0) scale(.7) rotate(-6deg);}
  12%{opacity:.85;}
  80%{opacity:.6;}
  100%{opacity:0; transform: translateY(-160px) scale(1.05) rotate(8deg);}
}
@keyframes speechPop{
  0%{opacity:0; transform: translateX(-50%) translateY(8px) scale(.9);}
  100%{opacity:1; transform: translateX(-50%) translateY(0) scale(1);}
}
@keyframes gentleSway{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}
@keyframes labelGlow{0%,100%{box-shadow:0 0 0 rgba(255,255,255,0)}50%{box-shadow:0 0 0 6px rgba(255,255,255,.10)}}
@keyframes emojiBounce{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-3px) rotate(-4deg)}}
@keyframes shimmer{0%{transform:translateX(-120%)}45%{transform:translateX(120%)}100%{transform:translateX(120%)}}

.card-pulse { animation: cardPulse .7s var(--ease-bounce); }
@keyframes cardPulse { 0%{transform:scale(1);} 35%{transform:scale(1.04);} 100%{transform:scale(1);} }
.partner-card.card-pulse { animation-name: cardPulsePartner; }
@keyframes cardPulsePartner { 0%{transform:translateY(17px) scale(1);} 35%{transform:translateY(17px) scale(1.04);} 100%{transform:translateY(17px) scale(1);} }

.heart-burst { position:fixed; z-index:80; pointer-events:none; font-size:20px; left:50%; bottom:110px; transform:translate(-50%,-50%); animation: burstUp 1.15s ease-out forwards; }
@keyframes burstUp {
  0%{opacity:0; transform: translate(-50%,-50%) scale(.5) rotate(0deg);}
  15%{opacity:1;}
  100%{opacity:0; transform: translate(calc(-50% + var(--tx, 0px)), calc(-50% - 150px)) scale(1.15) rotate(var(--r, 10deg));}
}

/* ===== Ambient app-wide decoration ===== */
.ambient-layer { position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden; }
.ambient-heart { position:absolute; color:var(--pink); opacity:.16; font-size:22px; animation: ambientDrift 14s ease-in-out infinite; }
.amb-1 { top:8%; left:6%; animation-duration:16s; }
.amb-2 { top:64%; right:5%; color:var(--lav); font-size:26px; animation-duration:19s; animation-delay:2s; }
.amb-3 { bottom:10%; left:12%; color:var(--gold); font-size:18px; animation-duration:13s; animation-delay:4s; }
@keyframes ambientDrift {
  0%,100% { transform: translate(0,0) rotate(0deg); opacity:.12; }
  50% { transform: translate(10px,-18px) rotate(14deg); opacity:.22; }
}
.app-shell, .bottom-nav, .toast, .install-hint { position:relative; z-index:1; }

/* ===== Login field patch (cute centered fields) ===== */
.login-field { display:block; text-align:center; }
.field-title {
  display:block; margin:0 0 7px; text-align:center; font-size:11px; line-height:1.2;
  font-weight:800; letter-spacing:.6px; color:var(--brand); font-family:"Baloo 2", sans-serif;
}
.login-field > input, .password-field input { text-align:center; }
.login-field > input::placeholder, .password-field input::placeholder { text-align:center; color:#b9a7c0; }

/* ===== Password mascot hint ===== */
.password-hint {
  display:block; margin-top:7px; text-align:center; font-size:11px; font-weight:700; color:var(--muted);
  opacity:0; height:0; overflow:hidden; transition: opacity .2s ease;
}
.password-hint.show { opacity:1; height:auto; animation: hintPop .3s var(--ease-bounce) both; }
.password-hint.warn { color:#e0316f; }
@keyframes hintPop { 0%{opacity:0; transform:translateY(-4px);} 100%{opacity:1; transform:translateY(0);} }
.auth-card.shake { animation: shakeX .5s ease; }
@keyframes shakeX {
  10%,90%{transform:translateX(-2px)} 20%,80%{transform:translateX(3px)}
  30%,50%,70%{transform:translateX(-6px)} 40%,60%{transform:translateX(6px)}
}

/* ===== Fairy-tale visitors on status cards ===== */
.card-fairy {
  position:absolute; z-index:4; display:block; font-size:26px; line-height:1; pointer-events:none; user-select:none;
  filter: drop-shadow(0 5px 8px rgba(74,15,79,.18)); will-change:transform, opacity;
}
.fairy-owner { right:-8px; bottom:26px; animation: fairyVisitOwner 10s cubic-bezier(.45,.05,.25,1) infinite; }
.fairy-partner { left:-8px; top:46%; animation: fairyVisitPartner 11.5s cubic-bezier(.45,.05,.25,1) 2.4s infinite; }
@keyframes fairyVisitOwner {
  0%,8% { transform: translate(0,8px) rotate(8deg) scale(.78); opacity:0; }
  15% { transform: translate(-24px,0) rotate(-5deg) scale(.95); opacity:1; }
  24% { transform: translate(-40px,-10px) rotate(3deg) scale(1); opacity:1; }
  34%,47% { transform: translate(-50px,-16px) rotate(-2deg) scale(1.02); opacity:1; }
  56% { transform: translate(-38px,-6px) rotate(5deg) scale(.98); opacity:1; }
  67% { transform: translate(-16px,4px) rotate(9deg) scale(.9); opacity:.9; }
  76%,100% { transform: translate(8px,14px) rotate(14deg) scale(.75); opacity:0; }
}
@keyframes fairyVisitPartner {
  0%,10% { transform: translate(0,10px) rotate(-9deg) scale(.78); opacity:0; }
  18% { transform: translate(24px,0) rotate(5deg) scale(.95); opacity:1; }
  28% { transform: translate(38px,-8px) rotate(-3deg) scale(1); opacity:1; }
  38%,53% { transform: translate(52px,-13px) rotate(2deg) scale(1.02); opacity:1; }
  62% { transform: translate(40px,-3px) rotate(-5deg) scale(.98); opacity:1; }
  72% { transform: translate(18px,6px) rotate(-9deg) scale(.9); opacity:.9; }
  81%,100% { transform: translate(-8px,14px) rotate(-14deg) scale(.75); opacity:0; }
}
.butterfly-two {
  position:absolute; top:58%; left:50%; z-index:8; font-size:20px; opacity:.9; pointer-events:none;
  filter: drop-shadow(0 5px 7px rgba(77,22,82,.16)); animation: butterflyPathTwo 10.5s ease-in-out 1.6s infinite;
}
@keyframes butterflyPathTwo {
  0% { transform: translate(8px,10px) rotate(8deg) scale(.82); opacity:.45; }
  20% { transform: translate(-42px,-12px) rotate(-8deg) scale(.96); opacity:1; }
  42% { transform: translate(-64px,24px) rotate(7deg) scale(1); opacity:1; }
  62% { transform: translate(-20px,40px) rotate(-5deg) scale(.92); opacity:.9; }
  80% { transform: translate(30px,16px) rotate(9deg) scale(1); opacity:1; }
  100% { transform: translate(8px,10px) rotate(8deg) scale(.82); opacity:.45; }
}

@media (prefers-reduced-motion:reduce){
  .card-fairy, .butterfly-two, .ambient-heart { animation:none !important; }
  .card-fairy { opacity:.8; }
}

@media (max-width:520px){
  .app-menu{left:14px;width:calc(100% - 28px);top:64px}
  .brand-logo{width:34px;height:34px;border-radius:12px}
  .topbar h1.brand-wordmark{font-size:19px}
  .brand-eyebrow{font-size:8px}
  .app-shell{padding-left:14px;padding-right:14px}
  .pair-status-grid{grid-template-columns:1fr}
  .partner-card{transform:none;margin-top:18px}
  .person-status-card{min-height:250px}
  .day-panels{grid-template-columns:1fr}
  .day-panel{padding:15px}
  .flying-butterfly{left:auto;right:14px;top:45%}
  .editor-row{grid-template-columns:43px minmax(0,1fr);gap:8px;padding:9px}
  .editor-row-actions{grid-column:1/-1;justify-content:flex-end;border-top:1px solid var(--line);padding-top:8px}
  .cat-stage{min-height:140px}
  .auth-card{padding:24px 18px}
  .time-pair-card{gap:9px}
  .time-heart{width:34px;height:34px}
  .time-person strong{font-size:17px}
}

@media (prefers-reduced-motion:reduce){
  *, *::before, *::after { animation: none !important; transition: none !important; }
}


/* =========================================================
   FAIRY-TALE V2 — approved Pwy ♡ Ywp visual direction
   ========================================================= */
:root {
  --bg:#fff8fd;
  --card:#ffffff;
  --text:#39223d;
  --muted:#8d7894;
  --line:#f4d8eb;
  --brand:#c21a91;
  --brand-dark:#781284;
  --brand-soft:#fde7f6;
  --pink:#ff65ad;
  --pink-soft:#ffe4f2;
  --lav:#aa62da;
  --gold:#ffd776;
  --green:#2ecb8f;
  --amber:#f2ad3e;
  --shadow:0 18px 50px rgba(162,42,142,.12);
}

html { background:var(--bg); }
body {
  background:
    radial-gradient(circle at 12% 7%, rgba(255,101,173,.15), transparent 25%),
    radial-gradient(circle at 88% 12%, rgba(170,98,218,.13), transparent 29%),
    radial-gradient(circle at 50% 92%, rgba(255,215,118,.10), transparent 30%),
    linear-gradient(180deg,#fffafd 0%,#fff6fc 48%,#fff9fd 100%);
}

/* App-wide fairy dust */
.ambient-layer{z-index:0}
.ambient-heart{opacity:.19}
.ambient-butterfly,.ambient-star{
  position:absolute;pointer-events:none;user-select:none;opacity:.22;
  filter:drop-shadow(0 5px 8px rgba(130,34,123,.10));
}
.ambient-butterfly{font-size:23px;animation:fairyAmbient 18s ease-in-out infinite}
.amb-b1{top:20%;right:7%;animation-delay:1s}
.amb-b2{bottom:21%;left:6%;font-size:18px;animation-delay:5s}
.ambient-star{color:var(--pink);animation:sparkle 3.4s ease-in-out infinite}
.amb-s1{top:34%;left:3%}.amb-s2{bottom:13%;right:4%;color:var(--lav);animation-delay:1.2s}
@keyframes fairyAmbient{
  0%,100%{transform:translate(0,0) rotate(-7deg);opacity:.14}
  35%{transform:translate(10px,-18px) rotate(8deg);opacity:.32}
  70%{transform:translate(-7px,8px) rotate(-4deg);opacity:.22}
}

/* Header = cleaner, lighter, closer to approved concept */
.topbar{
  position:relative;
  margin:0 0 20px;
  padding:4px 2px;
}
.brand-block{gap:9px}
.brand-logo{
  width:42px;height:42px;border-radius:14px;
  box-shadow:0 8px 24px rgba(188,29,143,.23),0 0 0 3px rgba(255,255,255,.82);
}
.topbar h1.brand-wordmark{
  font-size:23px;
  background:linear-gradient(110deg,#7b1587 4%,#bd1a91 48%,#ff68ae 72%,#9d4cd0 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.brand-eyebrow{color:#b32a91;letter-spacing:2px}
.icon-button{
  background:rgba(255,255,255,.88);
  border-color:#f4d9ea;
  box-shadow:0 7px 20px rgba(174,38,145,.10);
}

/* Login fairy-tale card */
.auth-wrap{min-height:72vh}
.auth-card{
  border:1px solid rgba(241,193,225,.9);
  background:
    linear-gradient(180deg,rgba(255,255,255,.96),rgba(255,249,253,.94));
  box-shadow:
    0 30px 80px rgba(174,43,147,.15),
    inset 0 0 52px rgba(255,188,225,.09);
  padding:32px 28px 30px;
}
.cute-auth-card::before{
  width:300px;height:300px;right:-120px;top:-120px;
  background:radial-gradient(circle,rgba(255,106,177,.18),transparent 70%);
}
.cute-auth-card::after{
  width:260px;height:260px;left:-120px;bottom:-120px;
  background:radial-gradient(circle,rgba(171,99,219,.12),transparent 70%);
}
.fairytale-castle{
  position:absolute;left:-6px;top:82px;z-index:0;
  font-size:92px;opacity:.055;filter:saturate(.55) hue-rotate(280deg);
  transform:rotate(-2deg);pointer-events:none;
}
.fairytale-cloud{
  position:absolute;z-index:0;font-size:70px;opacity:.07;filter:grayscale(1);
  pointer-events:none;
}
.cloud-a{left:-20px;bottom:38px}.cloud-b{right:-16px;bottom:82px;font-size:56px}
.login-butterfly{
  position:absolute;z-index:1;font-size:17px;opacity:.58;
  filter:drop-shadow(0 4px 5px rgba(125,29,115,.14));
  animation:loginButterfly 8s ease-in-out infinite;
}
.login-butterfly-a{left:13%;top:17%}
.login-butterfly-b{right:9%;bottom:11%;animation-delay:2.3s;font-size:15px}
@keyframes loginButterfly{
  0%,100%{transform:translate(0,0) rotate(-8deg)}
  45%{transform:translate(10px,-13px) rotate(8deg)}
  70%{transform:translate(-4px,-6px) rotate(-3deg)}
}

.cat-stage{min-height:158px;margin-bottom:2px}
.cat-character{
  font-size:82px;
  filter:drop-shadow(0 15px 16px rgba(132,34,115,.13));
}
.login-character{display:block;width:126px;height:118px;object-fit:contain;font-size:0;transform-origin:bottom center;animation:loginMascotFloat 2.8s var(--ease-soft) infinite;transition:filter .2s ease}
.login-character.partner-mascot{width:142px;height:126px}
.login-character.mascot-typing{animation:loginMascotTyping .75s ease-in-out infinite alternate;filter:drop-shadow(0 15px 16px rgba(132,34,115,.16)) brightness(.96)}
.login-character.mascot-caps{animation:loginMascotCaps .38s ease-in-out infinite alternate;filter:drop-shadow(0 0 15px rgba(239,159,46,.35))}
.login-character.mascot-error{animation:loginMascotError .42s ease-in-out 2;filter:drop-shadow(0 0 16px rgba(224,49,111,.3))}
.login-character.closed-eye-mascot{object-fit:contain;object-position:center;mix-blend-mode:normal;border-radius:0;animation:loginMascotTyping .75s ease-in-out infinite alternate}
.login-character.partner-mascot.closed-eye-mascot{object-position:center}
@keyframes loginMascotFloat{0%,100%{transform:translateY(2px) rotate(-1deg)}50%{transform:translateY(-7px) rotate(1deg)}}
@keyframes loginMascotTyping{from{transform:translateY(1px) scale(.98)}to{transform:translateY(-5px) scale(1.02)}}
@keyframes loginMascotCaps{from{transform:rotate(-3deg)}to{transform:rotate(3deg)}}
@keyframes loginMascotError{0%,100%{transform:translateX(0)}35%{transform:translateX(-7px) rotate(-2deg)}70%{transform:translateX(7px) rotate(2deg)}}
.cat-paws{right:calc(50% - 67px)}
.cat-speech{
  min-width:238px;
  border-color:#f1cfe5;
  box-shadow:0 12px 34px rgba(175,46,149,.11);
  background:rgba(255,255,255,.96);
}
.cat-speech strong{color:#c21991}
.login-kicker{
  position:relative;z-index:2;margin-top:7px;
  color:#ad2a92;letter-spacing:2.1px
}
.login-wordmark-art{
  position:relative;z-index:2;
  display:block;width:min(310px,88%);height:auto;
  margin:2px auto 8px;
  filter:drop-shadow(0 8px 16px rgba(129,29,121,.07));
}
.login-subtitle{
  position:relative;z-index:2;
  max-width:440px;color:#79677f;font-size:13px;line-height:1.7
}
.auth-panel{position:relative;z-index:2;gap:14px;margin-top:20px}
.login-field{display:grid;text-align:left;gap:7px}
.field-title{
  text-align:left;color:#4c3a52;font-family:"Quicksand",sans-serif;
  font-size:12px;letter-spacing:.1px;
}
.login-field > input,.password-field input,
.login-field > input::placeholder,.password-field input::placeholder{text-align:left}
input,textarea{
  border:1.5px solid #f1d3e6;
  border-radius:18px;
  background:rgba(255,255,255,.96);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7);
}
input:focus,textarea:focus{
  border-color:#ff78b7;
  box-shadow:0 0 0 5px rgba(255,101,173,.12),0 8px 18px rgba(192,28,145,.07)
}
.primary-btn{
  border-radius:18px;
  background:linear-gradient(100deg,#bd0d94 0%,#e82f9d 48%,#ff6bae 100%);
  box-shadow:0 16px 32px rgba(201,21,143,.26);
}
.primary-btn::before{
  content:"✦";position:absolute;left:18px;top:50%;transform:translateY(-50%);
  font-size:11px;color:rgba(255,255,255,.84);
}
.primary-btn:hover{box-shadow:0 18px 38px rgba(201,21,143,.31)}

/* Time-zone glass card */
.time-pair-card{
  border-color:#f3d8ea;
  background:rgba(255,255,255,.90);
  box-shadow:0 14px 38px rgba(161,37,140,.09);
  backdrop-filter:blur(14px);
}
.time-heart{
  width:44px;height:44px;
  background:radial-gradient(circle at 35% 30%,#fff 0 12%,#f9a0cf 30%,#c94fe0 70%,#9e38ca 100%);
  box-shadow:0 0 0 8px rgba(255,113,183,.08),0 10px 24px rgba(184,63,194,.22);
}

/* Headings */
.section-heading h2,.section-heading h3{color:#7b177e}
.eyebrow,.tiny-label{color:#b4258f}
.pair-chip,.date-chip{
  border-color:#f3d6e9;
  background:rgba(255,255,255,.92);
}

/* Status cards — approved green + fairy purple combination */
.pair-status-grid{gap:15px;padding-top:22px}
.person-status-card{
  min-height:286px;
  border-radius:28px;
  border:1px solid rgba(255,255,255,.45);
  box-shadow:0 22px 48px rgba(132,31,123,.19);
}
.person-status-card.free{
  background:linear-gradient(145deg,#48dca6 0%,#25c68e 52%,#19ad7c 100%);
}
.partner-card.free{
  background:linear-gradient(145deg,#d553c7 0%,#b33cbd 48%,#8d2cb0 100%);
}
.partner-card.limited{
  background:linear-gradient(145deg,#de72cc,#b448bd 54%,#8631a8);
}
.person-status-card::before{
  content:"✦";position:absolute;right:16px;top:48%;z-index:1;
  color:rgba(255,255,255,.42);font-size:14px;animation:sparkle 2.7s ease-in-out infinite;
}
.person-status-card::after{opacity:.95}
.card-peek{top:-31px;font-size:38px}
.owner-peek{left:16px}.partner-peek{right:18px}
.person-emoji{
  background:rgba(255,255,255,.19);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);
}
.person-message{font-size:13px}
.card-fairy{font-size:32px;filter:drop-shadow(0 8px 10px rgba(76,19,84,.20))}
.fairy-owner{left:-19px;right:auto;bottom:16px;animation:fairyFloatLeft 5.2s ease-in-out infinite}
.fairy-partner{right:-19px;left:auto;top:45%;animation:fairyFloatRight 5.6s ease-in-out .8s infinite}
@keyframes fairyFloatLeft{
  0%,100%{transform:translate(0,4px) rotate(-6deg);opacity:.92}
  50%{transform:translate(7px,-10px) rotate(5deg);opacity:1}
}
@keyframes fairyFloatRight{
  0%,100%{transform:translate(0,5px) rotate(6deg);opacity:.92}
  50%{transform:translate(-7px,-10px) rotate(-5deg);opacity:1}
}
.flying-butterfly{font-size:22px}
.butterfly-two{font-size:18px}

/* Together card */
.together-card{
  border-color:#f3d8ea;
  background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(255,246,252,.93));
  box-shadow:0 10px 30px rgba(161,37,140,.07);
}
.together-animal{
  background:linear-gradient(135deg,#ffe5f2,#f1defd);
}

/* Schedule cards */
.day-panel{
  border-color:#f2d9e9;
  background:rgba(255,255,255,.91);
  box-shadow:0 10px 28px rgba(156,39,136,.07);
}
.day-avatar{
  background:linear-gradient(135deg,#ffe6f2,#ecdafb);
}
.schedule-item{
  border-color:#f3d7e9;
  box-shadow:0 5px 14px rgba(153,34,131,.04);
}
.schedule-item.active{
  border-color:#ff7ab8;
  box-shadow:0 10px 24px rgba(255,101,173,.16);
}
.schedule-emoji{background:linear-gradient(135deg,#ffe3f1,#f1dcfb)}

/* Editor */
.edit-card,.schedule-editor-section{
  background:rgba(255,255,255,.88)
}
.quick-grid button.selected{
  border-color:#ff6daf!important;
  box-shadow:0 10px 24px rgba(255,101,173,.14)!important;
}

/* Floating nav */
.bottom-nav{
  border-color:rgba(244,211,233,.95);
  background:rgba(255,255,255,.90);
  box-shadow:0 16px 42px rgba(159,39,137,.14);
}
.nav-item.active{
  background:linear-gradient(135deg,#ffe3f1,#f4e2fb);
  color:#c01c91;
}

/* Menu */
.app-menu{
  border-color:#f1d6e8;
  background:rgba(255,255,255,.96);
  box-shadow:0 22px 55px rgba(145,31,127,.18);
}

/* Better tiny-screen behaviour */
@media (max-width:520px){
  .auth-card{padding:26px 18px 25px}
  .login-wordmark-art{width:min(280px,90%)}
  .fairytale-castle{font-size:74px;top:86px;left:-12px}
  .cat-stage{min-height:145px}
  .cat-character{font-size:75px}
  .cat-speech{min-width:215px}
  .brand-logo{width:36px;height:36px}
  .pair-status-grid{gap:12px}
  .person-status-card{min-height:252px}
  .card-fairy{font-size:29px}
  .fairy-owner{left:-11px}.fairy-partner{right:-11px}
}

@media (prefers-reduced-motion:reduce){
  .ambient-butterfly,.ambient-star,.login-butterfly,.card-fairy{animation:none!important}
}

/* ===== UI spacing polish v2.1 ===== */
/* Keep the login CTA intentionally narrower than the input fields. */
.auth-panel > .primary-btn{
  width:min(72%,340px);
  justify-self:center;
  padding-left:28px;
  padding-right:28px;
}

/* Reserve more scroll space so the fixed bottom nav never hugs/overlaps the last card. */
.app-shell{
  padding-bottom:calc(154px + var(--safe-bottom));
}

.bottom-nav{
  bottom:calc(20px + var(--safe-bottom));
}

#scheduleView,#adminView,#homeView{
  padding-bottom:22px;
}

@media (max-width:520px){
  .auth-panel > .primary-btn{
    width:min(78%,310px);
  }
  .app-shell{
    padding-bottom:calc(150px + var(--safe-bottom));
  }
  .bottom-nav{
    bottom:calc(18px + var(--safe-bottom));
  }
}


/* ===== Bottom navigation definitive fix v2.2 ===== */
/* A previous generic z-index rule changed .bottom-nav back to position:relative.
   Force the navigation to stay detached from content and above the page. */
.bottom-nav{
  position:fixed !important;
  left:50%;
  right:auto;
  bottom:calc(18px + var(--safe-bottom));
  transform:translateX(-50%);
  margin:0;
  width:min(calc(100% - 36px),584px);
  z-index:100;
}

/* Keep the end of every view safely above the floating navigation. */
.app-shell{
  padding-bottom:calc(176px + var(--safe-bottom));
}

#scheduleView,
#adminView,
#homeView{
  padding-bottom:44px;
}

/* Extra breathing room below the last schedule/admin block. */
#scheduleView .day-panels,
#adminView .schedule-editor-section{
  margin-bottom:28px;
}

@media (max-width:520px){
  .bottom-nav{
    width:calc(100% - 28px);
    bottom:calc(14px + var(--safe-bottom));
  }
  .app-shell{
    padding-bottom:calc(168px + var(--safe-bottom));
  }
  #scheduleView,
  #adminView,
  #homeView{
    padding-bottom:40px;
  }
}


/* ===== Status & Schedule UX polish v2.4 ===== */
.schedule-heading-actions,
.editor-heading-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
}

.compact-action{
  min-width:auto;
  padding:0 12px;
}

.field-label-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.message-count{
  color:var(--muted);
  font-size:10px;
  font-weight:800;
  white-space:nowrap;
  transition:color .2s ease;
}

.message-count.near-limit{
  color:#d83275;
}

.conditional-field{
  animation:conditionalFieldIn .25s var(--ease-soft) both;
}

@keyframes conditionalFieldIn{
  from{opacity:0;transform:translateY(-5px)}
  to{opacity:1;transform:translateY(0)}
}

.editor-heading-actions .subtle-danger{
  color:#b94873;
  background:#fff5f9;
  border-color:#f2d9e5;
}

.editor-heading-actions .subtle-danger:hover{
  background:#ffeaf2;
}

.schedule-editor-empty{
  margin-top:10px;
  padding:22px 16px;
  text-align:center;
  border:1.5px dashed #efcce2;
  border-radius:20px;
  background:linear-gradient(145deg,rgba(255,255,255,.86),rgba(255,245,251,.9));
  color:var(--muted);
}

.schedule-editor-empty > span{
  display:block;
  font-size:26px;
  margin-bottom:5px;
}

.schedule-editor-empty p{
  margin:0 0 12px;
  font-size:11px;
}

#scheduleView .compact-action{
  height:36px;
  font-size:11px;
}

@media (max-width:520px){
  #scheduleView .section-heading{
    align-items:flex-start;
    gap:10px;
  }

  .schedule-heading-actions{
    max-width:160px;
  }

  .schedule-heading-actions .date-chip{
    font-size:10px;
    padding:7px 9px;
  }

  #scheduleView .compact-action{
    height:34px;
  }

  .editor-heading-actions{
    gap:6px;
  }

  .editor-heading-actions .ghost-small{
    height:36px;
    min-width:auto;
    padding:0 11px;
    font-size:11px;
  }
}


/* ===== Daily-use polish v2.5 ===== */
.duration-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:3px}
.duration-chips button{border:1px solid #efd5e7;background:#fff7fb;color:var(--brand-dark);border-radius:999px;padding:7px 10px;font-size:10px;font-weight:800;transition:transform .16s var(--ease-bounce),background .16s ease,border-color .16s ease}
.duration-chips button:hover{transform:translateY(-1px);background:var(--pink-soft);border-color:#efb8d8}
.duration-chips button:active{transform:scale(.95)}
.admin-top-actions{display:flex;align-items:center;gap:8px;flex:none}
.unsaved-badge{display:inline-flex;align-items:center;gap:5px;padding:6px 9px;border-radius:999px;background:#fff4df;border:1px solid #f2d5a2;color:#a66a16;font-size:9px;font-weight:900;box-shadow:0 4px 12px rgba(166,106,22,.08)}
.unsaved-badge::before{content:'•';font-size:17px;line-height:0;color:#ef9f2e}
.person-status-card.self-editable{cursor:pointer;outline:none}
.person-status-card.self-editable::before{content:none}
.person-status-card.self-editable:focus-visible{box-shadow:0 0 0 4px rgba(255,255,255,.72),0 22px 50px rgba(148,3,130,.28)}
.card-edit-status{position:relative;z-index:7;margin:14px 0 0 auto;min-height:38px;padding:8px 13px;border:1px solid rgba(255,255,255,.34);border-radius:999px;background:rgba(255,255,255,.18);color:#fff;font-size:10px;font-weight:900;box-shadow:0 6px 16px rgba(73,0,58,.12);backdrop-filter:blur(8px);transition:transform .18s var(--ease-bounce),background .18s ease}
.card-edit-status:hover{background:rgba(255,255,255,.28);transform:translateY(-2px)}
.card-edit-status:active{transform:scale(.96)}
.card-edit-status:focus-visible{outline:3px solid rgba(255,255,255,.75);outline-offset:2px}
@media (max-width:520px){.duration-chips{gap:6px}.duration-chips button{padding:7px 9px}.unsaved-badge{font-size:8px;padding:5px 7px}.card-edit-status{width:100%;min-height:44px;margin-top:12px;font-size:11px}}


/* ===== Free Push Notifications (Cloudflare Worker) ===== */
.push-menu-item{
  position:relative;
  padding-right:38px!important;
}
.push-menu-icon{
  display:grid;
  place-items:center;
}
.push-menu-dot{
  position:absolute;
  right:15px;
  top:50%;
  width:8px;
  height:8px;
  border-radius:999px;
  background:#d7c8d5;
  transform:translateY(-50%);
  box-shadow:0 0 0 4px rgba(215,200,213,.16);
}
.push-menu-dot.active{
  background:#28bd84;
  box-shadow:0 0 0 4px rgba(40,189,132,.14);
}
.push-menu-dot.warning{
  background:#e9a43a;
  box-shadow:0 0 0 4px rgba(233,164,58,.14);
}
.push-menu-item[data-push-state="on"] small{
  color:#19865f;
  font-weight:700;
}
.push-menu-item[data-push-state="blocked"] small{
  color:#b84b67;
}
.push-menu-item[data-push-state="setup"] small{
  color:#9a6b17;
}


/* ===== v2.6.2 — 3D Fairy Tale Characters ===== */

/* Real transparent PNG character assets replace flat emoji visitors. */
.card-fairy{
  width:104px;
  height:auto;
  max-width:none;
  font-size:0;
  object-fit:contain;
  z-index:6;
  pointer-events:none;
  user-select:none;
  filter:drop-shadow(0 13px 15px rgba(99,32,115,.24));
  will-change:transform;
}

/* The same 3D fairy is art-directed differently on each card. */
.fairy-owner{
  left:-47px;
  right:auto;
  top:auto;
  bottom:-2px;
  transform-origin:55% 55%;
  animation:fairy3dOwner 5.2s ease-in-out infinite;
}
.fairy-partner{
  right:-47px;
  left:auto;
  top:37%;
  bottom:auto;
  transform-origin:45% 55%;
  animation:fairy3dPartner 5.6s ease-in-out .7s infinite;
}

@keyframes fairy3dOwner{
  0%,100%{transform:translate3d(0,5px,0) rotate(-5deg) scale(.96);opacity:.97}
  50%{transform:translate3d(7px,-9px,0) rotate(3deg) scale(1.02);opacity:1}
}
@keyframes fairy3dPartner{
  0%,100%{transform:translate3d(0,5px,0) rotate(5deg) scaleX(-1) scale(.96);opacity:.97}
  50%{transform:translate3d(-7px,-9px,0) rotate(-3deg) scaleX(-1) scale(1.02);opacity:1}
}

/* 3D kitten peeking over the owner's card. */
.card-peek-image{
  width:64px;
  height:64px;
  object-fit:contain;
  font-size:0;
  top:-43px;
  filter:drop-shadow(0 8px 10px rgba(109,45,74,.18));
}
.owner-peek.card-peek-image{
  left:10px;
}

/* 3D kitten in the "still together / welcome" strip. */
.together-animal-img{
  width:64px;
  height:58px;
  min-width:64px;
  object-fit:contain;
  padding:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  overflow:visible;
  filter:drop-shadow(0 8px 9px rgba(117,40,92,.16));
  animation:catFloat 3.4s var(--ease-soft) infinite;
}

/* Give the character edges breathing room without changing card content. */
.pair-status-grid{
  padding-left:8px;
  padding-right:8px;
}

@media (max-width:760px){
  .card-fairy{width:90px}
  .fairy-owner{left:-36px;bottom:1px}
  .fairy-partner{right:-36px;top:40%}
  .card-peek-image{width:58px;height:58px;top:-38px}
}

@media (max-width:520px){
  .pair-status-grid{
    padding-left:13px;
    padding-right:13px;
  }
  .card-fairy{width:82px}
  .fairy-owner{left:-27px;bottom:2px}
  .fairy-partner{right:-27px;top:38%}
  .card-peek-image{
    width:54px;
    height:54px;
    top:-35px;
    left:8px!important;
  }
  .together-animal-img{
    width:56px;
    height:52px;
    min-width:56px;
  }
}

@media (prefers-reduced-motion:reduce){
  .fairy-owner,.fairy-partner,.together-animal-img{
    animation:none!important;
  }
}


/* ===== v2.6.3 — 3D Partner Rabbit ===== */
.partner-peek.card-peek-image{
  width:68px;
  height:68px;
  right:10px;
  left:auto;
  top:-46px;
  object-fit:contain;
  filter:drop-shadow(0 8px 10px rgba(105,50,125,.20));
  transform:rotate(1deg);
}

@media (max-width:760px){
  .partner-peek.card-peek-image{
    width:61px;
    height:61px;
    top:-40px;
    right:8px;
  }
}

@media (max-width:520px){
  .partner-peek.card-peek-image{
    width:56px;
    height:56px;
    top:-37px;
    right:7px;
    left:auto!important;
  }
}

/* ===== v2.7 — always-visible winged card visitors ===== */
.fairy-portal{position:absolute;z-index:8;width:106px;height:126px;pointer-events:none;overflow:visible;filter:drop-shadow(0 13px 15px rgba(99,32,115,.22));will-change:transform}
.owner-fairy-portal{left:-50px;bottom:-4px;animation:fairyEnterOwner 6.4s ease-in-out infinite}
.partner-fairy-portal{right:-50px;top:34%;animation:fairyEnterPartner 6.8s ease-in-out .5s infinite}
.fairy-portal .card-fairy{position:absolute;inset:0 auto auto 0;width:104px;height:auto;opacity:1!important;filter:none;animation:fairyWingBeatOwner .58s ease-in-out infinite alternate!important;transform-origin:72% 48%}
.partner-fairy-portal .card-fairy{animation-name:fairyWingBeatPartner!important;transform-origin:28% 48%}
.fairy-portal::before,.fairy-portal::after{content:"";position:absolute;z-index:-1;width:42px;height:58px;border-radius:70% 25% 65% 30%;background:linear-gradient(145deg,rgba(255,255,255,.76),rgba(246,176,255,.38));box-shadow:0 0 18px rgba(255,190,250,.58);transform-origin:bottom center;animation:fairyGlowWing .42s ease-in-out infinite alternate}
.fairy-portal::before{right:3px;top:24px;transform:rotate(28deg)}
.fairy-portal::after{right:18px;top:46px;width:34px;height:46px;animation-direction:alternate-reverse}
.partner-fairy-portal::before{left:3px;right:auto;transform:scaleX(-1) rotate(28deg)}
.partner-fairy-portal::after{left:18px;right:auto}
@keyframes fairyEnterOwner{0%,100%{transform:translate3d(-7px,7px,0) rotate(-5deg)}35%,62%{transform:translate3d(34px,-13px,0) rotate(3deg)}80%{transform:translate3d(12px,-3px,0) rotate(-2deg)}}
@keyframes fairyEnterPartner{0%,100%{transform:translate3d(7px,7px,0) rotate(5deg)}35%,62%{transform:translate3d(-34px,-13px,0) rotate(-3deg)}80%{transform:translate3d(-12px,-3px,0) rotate(2deg)}}
@keyframes fairyWingBeatOwner{from{transform:rotate(-2deg) scaleX(.985) scaleY(1.01)}to{transform:rotate(2deg) scaleX(1.015) scaleY(.99)}}
@keyframes fairyWingBeatPartner{from{transform:scaleX(-.985) rotate(-2deg) scaleY(1.01)}to{transform:scaleX(-1.015) rotate(2deg) scaleY(.99)}}
@keyframes fairyGlowWing{from{scale:.72 1;rotate:-12deg;opacity:.52}to{scale:1.08 .92;rotate:12deg;opacity:.9}}
.flying-butterfly{opacity:1!important;width:34px;height:34px;display:grid;place-items:center;font-size:0;will-change:transform}
.flying-butterfly i{display:block;font-style:normal;font-size:23px;line-height:1;transform-origin:center;animation:butterflyWingBeat .28s ease-in-out infinite alternate}
.butterfly-one{left:4%;top:14%;animation:butterflyThroughOwner 7.2s ease-in-out infinite!important}
.butterfly-two{left:auto;right:4%;top:58%;animation:butterflyThroughPartner 7.8s ease-in-out .8s infinite!important}
@keyframes butterflyThroughOwner{0%,100%{transform:translate3d(-22px,18px,0) rotate(-10deg)}42%,58%{transform:translate3d(58px,-7px,0) rotate(8deg)}78%{transform:translate3d(28px,16px,0) rotate(-5deg)}}
@keyframes butterflyThroughPartner{0%,100%{transform:translate3d(22px,16px,0) rotate(10deg)}42%,58%{transform:translate3d(-58px,-9px,0) rotate(-8deg)}78%{transform:translate3d(-26px,15px,0) rotate(5deg)}}
@keyframes butterflyWingBeat{from{transform:scaleX(.52) rotate(-3deg)}to{transform:scaleX(1.08) rotate(3deg)}}
@media (max-width:520px){.fairy-portal{width:88px;height:106px}.fairy-portal .card-fairy{width:84px}.owner-fairy-portal{left:-32px;bottom:0}.partner-fairy-portal{right:-32px;top:36%}.fairy-portal::before{width:34px;height:48px;top:20px}.fairy-portal::after{width:28px;height:38px;top:39px}.butterfly-one{left:1%;top:18%}.butterfly-two{right:1%;top:60%}}
@media (prefers-reduced-motion:reduce){.fairy-portal,.fairy-portal .card-fairy,.fairy-portal::before,.fairy-portal::after,.flying-butterfly,.flying-butterfly i{animation:none!important}.owner-fairy-portal{transform:translate3d(24px,-4px,0)}.partner-fairy-portal{transform:translate3d(-24px,-4px,0)}}

/* ===== v3.3 — fancy schedule activity sheet ===== */
body.sheet-open{overflow:hidden}
body.sheet-open .bottom-nav{visibility:hidden;pointer-events:none}
.schedule-sheet-backdrop{position:fixed;inset:0;z-index:129;background:rgba(55,18,54,.38);backdrop-filter:blur(5px);animation:sheetFadeIn .22s ease both}
.schedule-sheet{position:fixed;z-index:130;left:50%;bottom:0;width:min(100%,620px);max-height:min(88vh,760px);overflow:auto;padding:10px 20px calc(24px + var(--safe-bottom));border:1px solid rgba(255,255,255,.8);border-bottom:0;border-radius:30px 30px 0 0;background:linear-gradient(165deg,rgba(255,255,255,.99),rgba(255,242,250,.98));box-shadow:0 -24px 70px rgba(99,18,87,.25);transform:translateX(-50%);animation:scheduleSheetUp .38s var(--ease-bounce) both}
.schedule-sheet-handle{width:42px;height:5px;margin:1px auto 15px;border-radius:999px;background:#e8c8df}
.schedule-sheet-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:15px}
.schedule-sheet-head h3{margin:0;color:var(--brand-dark);font-size:23px}
.sheet-close-btn{width:42px;height:42px;flex:none;border:1px solid var(--line);border-radius:50%;background:#fff;color:var(--brand);font-size:25px;line-height:1;box-shadow:0 7px 18px rgba(148,3,130,.08)}
.schedule-activity-picker{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}
.schedule-activity-picker button{min-width:0;min-height:76px;padding:9px 5px;border:2px solid #f2dce9;border-radius:19px;background:#fff;color:var(--text);display:grid;place-items:center;gap:3px;box-shadow:0 7px 18px rgba(148,3,130,.05);transition:transform .18s var(--ease-bounce),border-color .18s ease,background .18s ease,box-shadow .18s ease}
.schedule-activity-picker button span{font-size:25px;line-height:1}
.schedule-activity-picker button small{font-size:10px;font-weight:850;color:var(--muted)}
.schedule-activity-picker button:hover{transform:translateY(-3px)}
.schedule-activity-picker button:active{transform:scale(.94)}
.schedule-activity-picker button.selected{border-color:var(--pink);background:linear-gradient(145deg,#fff,#ffe7f3);box-shadow:0 10px 24px rgba(224,67,154,.16);transform:translateY(-3px) scale(1.02)}
.schedule-activity-picker button.selected span{animation:emojiBounce .55s var(--ease-bounce)}
.schedule-custom-fields{display:grid;grid-template-columns:82px 1fr;gap:10px;margin-top:12px;padding:12px;border:1px solid var(--line);border-radius:19px;background:rgba(255,255,255,.75);animation:conditionalFieldIn .25s var(--ease-soft) both}
.schedule-custom-fields label,.schedule-time-fields label{font-size:10px;color:var(--muted);font-weight:850}
.schedule-custom-fields input,.schedule-time-fields input{padding:11px 12px;border-radius:13px;font-size:13px}
.schedule-custom-fields label:first-child input{text-align:center;font-size:19px}
.schedule-emoji-palette{grid-column:1/-1;display:flex;gap:6px;overflow-x:auto;padding:2px 1px 5px;scrollbar-width:none}
.schedule-emoji-palette::-webkit-scrollbar{display:none}
.schedule-emoji-palette button{flex:0 0 38px;width:38px;height:38px;padding:0;border:1px solid var(--line);border-radius:12px;background:#fff;font-size:19px;box-shadow:0 4px 11px rgba(148,3,130,.05);transition:transform .16s var(--ease-bounce),background .16s ease,border-color .16s ease}
.schedule-emoji-palette button:active{transform:scale(.9)}
.schedule-emoji-palette button.selected{border-color:var(--pink);background:var(--pink-soft);transform:translateY(-2px) scale(1.06)}
.schedule-time-fields{display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:10px;margin-top:14px;padding:14px;border:1px solid var(--line);border-radius:20px;background:#fff}
.schedule-time-arrow{padding-bottom:13px;color:var(--pink);font-size:21px;font-weight:900}
.schedule-confirm-btn{width:100%;margin-top:14px;min-height:50px}
.schedule-draft-note{margin:12px 0 -6px;text-align:center;color:var(--muted);font-size:10px;font-weight:700}
.schedule-note-field{display:block;margin-top:12px;padding:12px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.78);font-size:10px;color:var(--muted);font-weight:850}
.schedule-note-field>span{display:flex;align-items:center;gap:5px}.schedule-note-field>span small{font-weight:650;color:var(--muted)}
.schedule-note-field textarea{width:100%;margin-top:7px;padding:11px 12px;border-radius:13px;resize:vertical;min-height:72px;font:inherit;font-size:12px;color:var(--text)}
.schedule-note-field>small{display:block;margin-top:5px;text-align:right;color:var(--muted)}.schedule-note-field>small.near-limit{color:var(--brand);font-weight:900}
.schedule-repeat-field{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:11px;margin-top:10px;padding:12px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.78)}.schedule-repeat-field input{width:21px;height:21px;accent-color:var(--brand)}.schedule-repeat-field strong,.schedule-repeat-field small{display:block}.schedule-repeat-field strong{font-size:12px;color:var(--text)}.schedule-repeat-field small{margin-top:2px;color:var(--muted);font-size:9px;line-height:1.4}
.status-reaction-summary{width:max-content;margin:8px 0 0;padding:6px 10px;border:1px solid rgba(255,255,255,.8);border-radius:999px;background:rgba(255,255,255,.72);color:var(--brand-dark);font-size:10px;font-weight:850;animation:reactionPop .35s var(--ease-bounce) both}
.status-reaction-toggle{width:max-content;margin-top:9px;padding:7px 11px;border:1px solid rgba(255,255,255,.9);border-radius:999px;background:rgba(255,255,255,.7);color:var(--brand);font-size:9px;font-weight:850;backdrop-filter:blur(8px)}
.status-reaction-picker{display:flex;flex-wrap:wrap;gap:5px;margin-top:9px;padding:5px;width:min(100%,309px);border:1px solid rgba(255,255,255,.8);border-radius:22px;background:rgba(255,255,255,.68);backdrop-filter:blur(8px)}.status-reaction-picker button{width:33px;height:33px;border:0;border-radius:50%;background:transparent;font-size:17px;transition:transform .16s var(--ease-bounce),background .16s}.status-reaction-picker button:hover,.status-reaction-picker button.selected{transform:translateY(-2px) scale(1.12);background:#fff;box-shadow:0 5px 12px rgba(103,24,91,.12)}
.status-comment-summary{display:flex;align-items:flex-start;gap:8px;width:min(100%,360px);margin-top:9px;padding:9px 10px;border:1px solid rgba(255,255,255,.82);border-radius:14px;background:rgba(255,255,255,.72);backdrop-filter:blur(8px);animation:reactionPop .35s var(--ease-bounce) both}.status-comment-summary>div{min-width:0;flex:1}.status-comment-summary strong{display:block;color:var(--brand-dark);font-size:9px}.status-comment-summary p{margin:2px 0 0;color:var(--text);font-size:10px;line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere}.comment-actions{display:flex!important;flex:0 0 auto!important;gap:5px}.comment-edit,.comment-remove{height:25px;border:0;border-radius:9px;background:var(--brand-soft);color:var(--brand);font-size:8px;font-weight:900}.comment-edit{padding:0 8px}.comment-remove{width:25px}
.status-comment-composer{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:6px;width:min(100%,410px);margin-top:9px}.status-comment-composer input{min-width:0;padding:9px 11px;border:1px solid rgba(255,255,255,.9);border-radius:13px;background:rgba(255,255,255,.8);font-size:10px}.status-comment-composer button{padding:0 11px;border:0;border-radius:12px;background:var(--brand);color:#fff;font-size:9px;font-weight:850}.status-comment-composer .comment-cancel{background:rgba(255,255,255,.78);color:var(--muted);border:1px solid rgba(255,255,255,.9)}.status-comment-composer small{grid-column:1/-1;text-align:right;color:var(--muted);font-size:8px}
@keyframes reactionPop{0%{opacity:0;transform:scale(.7)}100%{opacity:1;transform:scale(1)}}
.schedule-week-picker{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;margin:0 0 12px;padding:5px;border:1px solid var(--line);border-radius:17px;background:rgba(255,255,255,.72)}
.schedule-week-picker button{min-width:0;min-height:48px;padding:5px 2px;border:0;border-radius:12px;background:transparent;color:var(--muted);font-size:9px;font-weight:850}.schedule-week-picker button span{display:block;font-size:12px;color:var(--text)}.schedule-week-picker button.active{background:linear-gradient(135deg,var(--brand-soft),var(--pink-soft));color:var(--brand);box-shadow:0 5px 14px rgba(148,3,130,.1)}
.schedule-draft-hint{margin:-4px 0 10px;text-align:center;color:var(--brand);font-size:10px;font-weight:800}
.modal-backdrop{position:fixed;inset:0;z-index:139;background:rgba(55,18,54,.38);backdrop-filter:blur(5px)}
.preference-modal{position:fixed;z-index:140;left:50%;top:50%;transform:translate(-50%,-50%);width:min(calc(100% - 30px),500px);padding:20px;border:1px solid var(--line);border-radius:26px;background:#fff;box-shadow:0 24px 70px rgba(70,15,70,.28)}
.preference-head{display:flex;justify-content:space-between;gap:15px}.preference-head h3{margin:0;color:var(--brand-dark);font-size:21px}.preference-modal>label{display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:center;margin-top:10px;padding:13px;border:1px solid var(--line);border-radius:16px;background:var(--bg)}.preference-modal input{width:21px;height:21px;accent-color:var(--brand)}.preference-modal strong,.preference-modal small{display:block}.preference-modal strong{font-size:12px}.preference-modal small{margin-top:2px;color:var(--muted);font-size:9px}
.tutorial-overlay{position:fixed;inset:0;z-index:170;display:grid;place-items:center;padding:18px;background:rgba(45,16,46,.55);backdrop-filter:blur(9px)}
.tutorial-card{position:relative;width:min(100%,430px);padding:28px 22px 22px;border:1px solid rgba(255,255,255,.8);border-radius:30px;background:linear-gradient(165deg,#fff,#fff1fa);box-shadow:0 28px 80px rgba(65,12,62,.3);text-align:center}.tutorial-skip{position:absolute;right:15px;top:14px;border:0;background:transparent;color:var(--muted);font-size:11px;font-weight:800}.tutorial-visual{width:100px;height:100px;margin:8px auto 16px;display:grid;place-items:center;border-radius:30px;background:linear-gradient(135deg,var(--pink-soft),var(--brand-soft));font-size:46px}.tutorial-card h2{margin:5px 0 8px;color:var(--brand-dark)}.tutorial-card>p:not(.eyebrow){min-height:48px;margin:0;color:var(--muted);font-size:12px;line-height:1.65}.tutorial-dots{display:flex;justify-content:center;gap:7px;margin:15px}.tutorial-dots i{width:7px;height:7px;border-radius:50%;background:#e8c8df}.tutorial-dots i.active{width:22px;border-radius:8px;background:var(--brand)}
body.modal-open{overflow:hidden}
@media(max-width:520px){.schedule-week-picker{gap:3px}.schedule-week-picker button{font-size:8px;min-height:44px}.schedule-week-picker button span{font-size:10px}.preference-modal{padding:16px}}
.schedule-confirm-btn:disabled{opacity:.42;cursor:not-allowed;box-shadow:none;filter:saturate(.45)}
.schedule-save-btn{transition:transform .2s var(--ease-bounce),box-shadow .2s ease,background .2s ease,opacity .2s ease}
.schedule-save-btn:disabled{opacity:.52;cursor:not-allowed;background:#f5edf3;color:#a996a5}
.schedule-save-btn.active-save{opacity:1;background:linear-gradient(120deg,var(--brand),var(--pink));color:#fff;box-shadow:0 12px 28px rgba(182,23,143,.26);animation:saveButtonWake .46s var(--ease-bounce) both}
.schedule-save-btn.active-save::after{content:'✦';margin-left:7px;animation:sparkle 1.8s ease-in-out infinite}
@keyframes scheduleSheetUp{from{opacity:0;transform:translate(-50%,38px) scale(.97)}to{opacity:1;transform:translate(-50%,0) scale(1)}}
@keyframes sheetFadeIn{from{opacity:0}to{opacity:1}}
@keyframes saveButtonWake{0%{transform:scale(.96)}60%{transform:scale(1.02)}100%{transform:scale(1)}}
@media (max-width:520px){.schedule-sheet{padding-left:15px;padding-right:15px}.schedule-activity-picker{grid-template-columns:repeat(4,1fr);gap:7px}.schedule-activity-picker button{min-height:70px;border-radius:17px}.schedule-activity-picker button span{font-size:23px}.schedule-activity-picker button small{font-size:9px}.schedule-custom-fields{grid-template-columns:70px 1fr}.schedule-sheet-head h3{font-size:21px}}
@media (prefers-reduced-motion:reduce){.schedule-sheet,.schedule-sheet-backdrop,.schedule-activity-picker button.selected span,.schedule-save-btn.active-save{animation:none!important}}

/* ===== v3.5 — soft activity-aware status palette ===== */
.person-status-card.tone-mint{background:linear-gradient(145deg,#a8ebd4 0%,#78d9ba 52%,#58c7a5 100%)}
.person-status-card.tone-lavender{background:linear-gradient(145deg,#d9c2f4 0%,#bfa0e7 52%,#a985d9 100%)}
.person-status-card.tone-peach{background:linear-gradient(145deg,#ffd4bd 0%,#f8b998 52%,#efa17d 100%)}
.person-status-card.tone-sky{background:linear-gradient(145deg,#c6e6fa 0%,#9ed0f0 52%,#7ab9e2 100%)}
.person-status-card.tone-rose{background:linear-gradient(145deg,#f8c5d9 0%,#ed9fbe 52%,#df7da6 100%)}
.person-status-card.tone-lemon{background:linear-gradient(145deg,#f9e7a9 0%,#eed27b 52%,#dfbc59 100%)}
.person-status-card.soft-tone{color:#49374d;border-color:rgba(255,255,255,.72);box-shadow:0 20px 44px rgba(110,67,104,.15)}
.person-status-card.soft-tone .person-identity,.person-status-card.soft-tone .person-updated,.person-status-card.soft-tone .person-now-label{color:rgba(73,55,77,.72)}
.person-status-card.soft-tone .person-status-label{color:#49374d;background:rgba(255,255,255,.46);box-shadow:inset 0 0 0 1px rgba(255,255,255,.38)}
.person-status-card.soft-tone .person-emoji{background:rgba(255,255,255,.38);box-shadow:inset 0 0 0 1px rgba(255,255,255,.32)}
.person-status-card.soft-tone .person-message,.person-status-card.soft-tone .person-until strong,.person-status-card.soft-tone .person-until b{color:#49374d}
.person-status-card.soft-tone .person-until{color:rgba(73,55,77,.74);border-top-color:rgba(73,55,77,.18)}
.person-status-card.soft-tone .person-until small{color:rgba(73,55,77,.66)}
.person-status-card.soft-tone::after{color:rgba(255,255,255,.22)}
.person-status-card.soft-tone .card-edit-status{color:#49374d;background:rgba(255,255,255,.38);border-color:rgba(255,255,255,.55)}

/* ===== v4.1 — Z06 Walone Myanmar + comfortable reading sizes ===== */
@font-face {
  font-family: "Z06 Walone";
  src: url("./assets/fonts/Z06-Walone-Regular.ttf") format("truetype");
  font-weight: 400 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+1000-109F, U+AA60-AA7F, U+A9E0-A9FF;
}

body,
button,
input,
textarea,
select {
  font-family: "Z06 Walone", "Quicksand", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  line-height: 1.6;
}

h1, h2, h3,
.eyebrow, .tiny-label, .brand-eyebrow,
.primary-btn, .secondary-btn, .ghost-btn,
.person-identity, .person-activity h3, .person-until strong,
.day-panel-head strong, .together-card strong {
  font-family: "Z06 Walone", "Baloo 2", "Quicksand", ui-sans-serif, sans-serif;
}

label, .pair-chip, .date-chip { font-size: 14px; }
.form-error, .error-text, .auth-loading-card p, .cat-speech { font-size: 14px; }
.app-menu-item strong { font-size: 14px; }
.app-menu-item small { font-size: 12px; line-height: 1.55; }
.brand-eyebrow { font-size: 11px; }
.eyebrow, .tiny-label { font-size: 13px; }
.time-person span, .person-now-label, .person-status-label { font-size: 13px; }
.person-identity, .person-updated { font-size: 12px; }
.person-message { font-size: 16px; line-height: 1.7; min-height: 44px; }
.person-until { font-size: 12px; line-height: 1.55; }
.person-until small, .person-until b { font-size: 11px; }
.day-panel-head strong { font-size: 16px; }
.day-panel-head small { font-size: 12px; }
.schedule-info strong { font-size: 14px; }
.schedule-info span, .schedule-time, .schedule-time b { font-size: 12px; }
.schedule-time small { font-size: 11px; }
.schedule-description { font-size: 13px; line-height: 1.65; }
.schedule-once-badge, .repeat-badge { font-size: 10px !important; }
.empty-card p, .editor-zone-hint { font-size: 13px; }
.quick-grid button span, .toggle-row small, .timezone-hint { font-size: 12px; }
.toggle-row strong, .editor-row-copy strong { font-size: 14px; }
.editor-row-copy span, .editor-row-copy p { font-size: 12px; line-height: 1.6; }
.edit-row, .card-edit-status { font-size: 12px; }
.nav-item small { font-size: 12px; }
.toast { font-size: 14px; }
.unsaved-badge { font-size: 11px; }
.schedule-activity-picker button small { font-size: 12px; }
.schedule-custom-fields label, .schedule-time-fields label,
.schedule-note-field, .schedule-draft-note, .schedule-draft-hint { font-size: 12px; }
.schedule-custom-fields input, .schedule-time-fields input,
.schedule-note-field textarea { font-size: 16px; }
.schedule-repeat-field strong { font-size: 14px; }
.schedule-repeat-field small { font-size: 12px; line-height: 1.55; }
.status-reaction-summary, .status-reaction-toggle { font-size: 12px; }
.status-comment-summary strong { font-size: 12px; }
.status-comment-summary p { font-size: 14px; line-height: 1.6; }
.comment-edit, .comment-remove { font-size: 11px; }
.status-comment-composer input, .status-comment-composer button { font-size: 16px; }
.status-comment-composer small { font-size: 11px; }
.schedule-week-picker button { font-size: 11px; }
.schedule-week-picker button span { font-size: 14px; }
.preference-modal strong { font-size: 14px; }
.preference-modal small { font-size: 12px; line-height: 1.55; }
.tutorial-skip { font-size: 13px; }
.tutorial-card > p:not(.eyebrow) { font-size: 15px; line-height: 1.75; }

@media (max-width: 520px) {
  .brand-eyebrow { font-size: 10px; }
  .schedule-week-picker button { font-size: 10px; }
  .schedule-week-picker button span { font-size: 12px; }
  .schedule-activity-picker button small { font-size: 11px; }
  .card-edit-status { font-size: 13px; }
}

/* ===== v4.2 — colorful partner card + blooming flower garden ===== */
.partner-card.tone-mint {
  background:linear-gradient(145deg,#b7f1d9 0%,#77ddca 38%,#89cfee 72%,#b7a2ed 100%);
}
.partner-card.tone-lavender {
  background:linear-gradient(145deg,#edc8f6 0%,#d5a7ef 34%,#b4a9ef 68%,#91c8ef 100%);
}
.partner-card.tone-peach {
  background:linear-gradient(145deg,#ffe0bf 0%,#ffc1bb 36%,#eea8d2 70%,#c5a7ee 100%);
}
.partner-card.tone-sky {
  background:linear-gradient(145deg,#d2efff 0%,#9bdcec 35%,#9fc6f5 68%,#c2a7ef 100%);
}
.partner-card.tone-rose {
  background:linear-gradient(145deg,#ffd1e5 0%,#f5a8cf 34%,#dca6ee 68%,#a9bff1 100%);
}
.partner-card.tone-lemon {
  background:linear-gradient(145deg,#fff0b8 0%,#f8d794 34%,#f6b9bd 67%,#d3acee 100%);
}
.partner-card.missing {
  background:linear-gradient(145deg,#e6d7ec 0%,#cbbbe1 45%,#acc9df 100%);
}
.partner-card {
  isolation:isolate;
  box-shadow:0 22px 52px rgba(130,82,172,.22),0 0 0 1px rgba(255,255,255,.5) inset;
}
.partner-card::after {
  background:radial-gradient(circle at 72% 18%,rgba(255,255,255,.28),transparent 28%),radial-gradient(circle at 15% 88%,rgba(255,240,178,.22),transparent 31%);
  content:"";
  inset:0;
  border-radius:inherit;
  transform:none;
  pointer-events:none;
  z-index:0;
}
/* ===== v4.3 — activity-aware card text contrast ===== */
.person-status-card.tone-lavender,
.person-status-card.missing {
  color:#fff;
  text-shadow:0 1px 2px rgba(61,28,76,.22);
}
.person-status-card.tone-lavender .person-identity,
.person-status-card.tone-lavender .person-updated,
.person-status-card.tone-lavender .person-now-label,
.person-status-card.missing .person-identity,
.person-status-card.missing .person-updated,
.person-status-card.missing .person-now-label {
  color:rgba(255,255,255,.84);
}
.person-status-card.tone-lavender .person-status-label,
.person-status-card.missing .person-status-label {
  color:#fff;
  background:rgba(255,255,255,.19);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.25);
}
.person-status-card.tone-lavender .person-emoji,
.person-status-card.missing .person-emoji {
  background:rgba(255,255,255,.2);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);
}
.person-status-card.tone-lavender .person-message,
.person-status-card.tone-lavender .person-until,
.person-status-card.tone-lavender .person-until strong,
.person-status-card.tone-lavender .person-until small,
.person-status-card.tone-lavender .person-until b,
.person-status-card.missing .person-message,
.person-status-card.missing .person-until,
.person-status-card.missing .person-until strong,
.person-status-card.missing .person-until small,
.person-status-card.missing .person-until b {
  color:#fff;
}
.person-status-card.tone-lavender .person-until,
.person-status-card.missing .person-until {
  border-top-color:rgba(255,255,255,.3);
}
.person-status-card.tone-lavender .card-edit-status,
.person-status-card.missing .card-edit-status {
  color:#fff;
  background:rgba(255,255,255,.18);
  border-color:rgba(255,255,255,.38);
}
.person-status-card.tone-mint,
.person-status-card.tone-peach,
.person-status-card.tone-sky,
.person-status-card.tone-rose,
.person-status-card.tone-lemon {
  color:#49374d;
  text-shadow:none;
}

/* ===== v4.7 — user-supplied rose + sakura floral frame ===== */
.partner-floral-frame{position:absolute;inset:0;z-index:1;overflow:visible;pointer-events:none}
.user-flower{position:absolute;display:block;object-fit:contain;opacity:0;filter:drop-shadow(0 7px 10px rgba(74,25,72,.2));transform:scale(.2);animation:userFlowerBloom .9s var(--ease-bounce) forwards}
.user-rose{right:-25px;bottom:-78px;width:114px;height:154px;clip-path:inset(0 0 30% 0);object-position:center top;transform-origin:right top;animation-delay:.18s}
.user-sakura{width:58px;height:54px;transform-origin:center;filter:drop-shadow(0 5px 8px rgba(130,57,109,.17))}
.sakura-left{left:-36px;bottom:34%;animation-delay:.42s}
.sakura-right{right:-30px;top:27%;width:43px;height:40px;animation-delay:.64s}
.user-rose{animation-name:userFlowerBloom,userRoseBreathe;animation-duration:.9s,6.8s;animation-delay:.18s,1.2s;animation-timing-function:var(--ease-bounce),ease-in-out;animation-fill-mode:forwards,none;animation-iteration-count:1,infinite}
.sakura-left{animation-name:userFlowerBloom,userSakuraFloat;animation-duration:.9s,7.2s;animation-delay:.42s,1.5s;animation-timing-function:var(--ease-bounce),ease-in-out;animation-fill-mode:forwards,none;animation-iteration-count:1,infinite}
.sakura-right{animation-name:userFlowerBloom,userSakuraFloat;animation-duration:.9s,6.5s;animation-delay:.64s,1.7s;animation-timing-function:var(--ease-bounce),ease-in-out;animation-fill-mode:forwards,none;animation-iteration-count:1,infinite}
@keyframes userFlowerBloom{0%{opacity:0;transform:scale(.2) rotate(-10deg)}70%{opacity:1;transform:scale(1.06) rotate(2deg)}100%{opacity:.96;transform:scale(1) rotate(0)}}
@keyframes userRoseBreathe{0%,100%{transform:rotate(-1deg) translateY(0)}50%{transform:rotate(1deg) translateY(-2px)}}
@keyframes userSakuraFloat{0%,100%{transform:rotate(-2deg) translateY(0)}50%{transform:rotate(2deg) translateY(-3px)}}
@media(max-width:520px){.user-rose{right:-18px;bottom:-69px;width:106px;height:143px}.sakura-left{left:-25px}.sakura-right{right:-21px}}
@media(prefers-reduced-motion:reduce){.user-flower{animation:none;opacity:.96;transform:none}}

/* ===== v5.8 — calmer home, quick check-ins, readable cards ===== */
.quick-checkin-card{margin:20px 0 14px;padding:18px;border:1px solid rgba(224,164,205,.5);border-radius:24px;background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(255,241,249,.92));box-shadow:0 14px 34px rgba(119,62,105,.1)}
.quick-checkin-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.quick-checkin-head h3{margin:2px 0 0;font-size:21px}.quick-checkin-head>span{display:grid;place-items:center;width:42px;height:42px;border-radius:15px;background:#fff;box-shadow:0 7px 18px rgba(182,23,143,.12);font-size:21px}.quick-checkin-hint{margin:5px 0 13px;color:var(--muted);font-size:13px}.quick-checkin-buttons{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.quick-checkin-buttons button{min-width:0;min-height:70px;padding:8px 4px;border:1px solid #f0d4e6;border-radius:17px;background:#fff;color:var(--text);transition:transform .18s var(--ease-bounce),box-shadow .18s,background .18s}.quick-checkin-buttons button span{display:block;font-size:24px;line-height:1.2}.quick-checkin-buttons button small{display:block;margin-top:5px;font-size:10px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.quick-checkin-buttons button:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(119,62,105,.12)}.quick-checkin-buttons button:active,.quick-checkin-buttons button.sent{transform:scale(.94);background:var(--brand-soft)}.quick-checkin-buttons button:disabled{opacity:.55}.latest-checkin{display:flex;align-items:center;gap:10px;margin-top:12px;padding:11px 13px;border-radius:16px;background:rgba(255,255,255,.82);border:1px solid #f2dbe9}.latest-checkin>span{font-size:24px}.latest-checkin>div{display:grid;min-width:0}.latest-checkin small,.latest-checkin time{color:var(--muted);font-size:10px}.latest-checkin strong{font-size:14px;overflow-wrap:anywhere}.latest-checkin time{margin-top:1px}
.person-status-card.card-text-dark{color:#49374d;text-shadow:none}.person-status-card.card-text-dark .person-identity,.person-status-card.card-text-dark .person-updated,.person-status-card.card-text-dark .person-now-label{color:rgba(73,55,77,.72)}.person-status-card.card-text-dark .person-message,.person-status-card.card-text-dark .person-until,.person-status-card.card-text-dark .person-until strong,.person-status-card.card-text-dark .person-until small,.person-status-card.card-text-dark .person-until b{color:#49374d}.person-status-card.card-text-light{color:#fff;text-shadow:0 1px 2px rgba(61,28,76,.22)}
.partner-status-changed{animation:partnerStatusArrival 1.7s var(--ease-bounce) both}.partner-status-changed::before{content:'New update ✨';position:absolute;z-index:8;top:12px;left:50%;padding:7px 13px;border-radius:999px;background:#fff;color:var(--brand);font-size:11px;font-weight:900;box-shadow:0 10px 25px rgba(92,36,86,.2);white-space:nowrap;animation:newUpdateBadge 1.7s ease both}
@keyframes partnerStatusArrival{0%{transform:scale(1)}25%{transform:translateY(-5px) scale(1.025);box-shadow:0 26px 60px rgba(182,23,143,.32)}65%{transform:translateY(0) scale(1.01)}100%{transform:scale(1)}}@keyframes newUpdateBadge{0%{opacity:0;transform:translate(-50%,-12px) scale(.8)}20%,70%{opacity:1;transform:translate(-50%,0) scale(1)}100%{opacity:0;transform:translate(-50%,-5px) scale(.96)}}
.pair-heading{margin-bottom:10px}.together-card{margin-top:14px}.sync-state{margin-top:10px}
@media(max-width:520px){.quick-checkin-card{padding:15px;margin-top:16px}.quick-checkin-buttons{display:flex;gap:8px;overflow-x:auto;padding:2px 1px 7px;scroll-snap-type:x proximity}.quick-checkin-buttons button{flex:0 0 72px;scroll-snap-align:start}.time-pair-card{margin-bottom:17px}.pair-heading .pair-chip{display:none}.together-card{padding:13px 15px}.together-card .together-animal{width:45px;height:45px}.together-card .tiny-label{display:none}}
@media(prefers-reduced-motion:reduce){.partner-status-changed,.partner-status-changed::before{animation:none!important}.partner-status-changed::before{display:none}}

/* ===== v5.9 — fairies roam across the whole status card ===== */
.person-status-card .fairy-portal{
  z-index:1;
  width:68px;
  height:82px;
  left:8%;
  right:auto;
  top:10%;
  bottom:auto;
  opacity:.88;
  filter:drop-shadow(0 7px 10px rgba(99,32,115,.18));
  will-change:left,top,transform;
}
.person-status-card .fairy-portal .card-fairy{width:66px;inset:0 auto auto 0}
.person-status-card .fairy-portal::before{width:27px;height:38px;right:1px;top:15px}
.person-status-card .fairy-portal::after{width:23px;height:31px;right:10px;top:29px}
.person-status-card .partner-fairy-portal::before{left:1px;right:auto}
.person-status-card .partner-fairy-portal::after{left:10px;right:auto}
.owner-fairy-portal{animation:fairyRoamOwner 25s ease-in-out infinite!important}
.partner-fairy-portal{animation:fairyRoamPartner 28s ease-in-out 1.4s infinite!important}
.owner-fairy-portal .card-fairy{animation:fairyWingBeatOwner .92s ease-in-out infinite alternate!important}
.partner-fairy-portal .card-fairy{animation:fairyWingBeatOwner 1.02s ease-in-out infinite alternate!important;transform-origin:72% 48%}
.person-status-card .partner-fairy-portal::before{left:auto;right:1px;transform:rotate(28deg)}
.person-status-card .partner-fairy-portal::after{left:auto;right:10px}
@keyframes fairyRoamOwner{
  0%,100%{left:5%;top:60%;transform:translate3d(0,0,0) rotate(-9deg) scale(.9);opacity:.72;animation-timing-function:cubic-bezier(.42,0,.68,.35)}
  12%{left:18%;top:43%;transform:translate3d(0,-3px,0) rotate(-2deg) scale(.95);opacity:.86;animation-timing-function:cubic-bezier(.2,.7,.3,1)}
  20%{left:32%;top:18%;transform:translate3d(0,0,0) rotate(7deg) scale(1);opacity:.94;animation-timing-function:ease-in-out}
  25%{left:34%;top:17%;transform:translate3d(0,-5px,0) rotate(4deg) scale(1.01);opacity:.96;animation-timing-function:ease-in-out}
  30%{left:33%;top:20%;transform:translate3d(0,2px,0) rotate(1deg) scale(.99);opacity:.93;animation-timing-function:cubic-bezier(.25,.55,.35,1)}
  45%{left:68%;top:31%;transform:translate3d(0,-2px,0) rotate(-7deg) scale(.94);opacity:.86;animation-timing-function:cubic-bezier(.2,.8,.3,1)}
  51%{left:69%;top:34%;transform:translate3d(0,3px,0) rotate(-3deg) scale(.96);opacity:.91;animation-timing-function:ease-in-out}
  57%{left:66%;top:32%;transform:translate3d(0,-4px,0) rotate(2deg) scale(.97);opacity:.93;animation-timing-function:cubic-bezier(.35,0,.25,1)}
  72%{left:43%;top:62%;transform:translate3d(0,1px,0) rotate(8deg) scale(1.01);opacity:.95;animation-timing-function:ease-in-out}
  79%{left:40%;top:59%;transform:translate3d(0,-5px,0) rotate(3deg) scale(1);opacity:.94;animation-timing-function:ease-in-out}
  85%{left:42%;top:62%;transform:translate3d(0,2px,0) rotate(-1deg) scale(.98);opacity:.91;animation-timing-function:cubic-bezier(.45,0,.55,1)}
  93%{left:17%;top:48%;transform:translate3d(0,-2px,0) rotate(-8deg) scale(.93);opacity:.82}
}
@keyframes fairyRoamPartner{
  0%,100%{left:69%;top:14%;transform:translate3d(0,0,0) rotate(8deg) scale(.91);opacity:.74;animation-timing-function:cubic-bezier(.38,0,.62,.38)}
  13%{left:58%;top:36%;transform:translate3d(0,-3px,0) rotate(1deg) scale(.96);opacity:.87;animation-timing-function:cubic-bezier(.2,.75,.3,1)}
  23%{left:45%;top:58%;transform:translate3d(0,1px,0) rotate(-7deg) scale(1);opacity:.95;animation-timing-function:ease-in-out}
  29%{left:43%;top:55%;transform:translate3d(0,-5px,0) rotate(-3deg) scale(1.01);opacity:.96;animation-timing-function:ease-in-out}
  35%{left:45%;top:59%;transform:translate3d(0,2px,0) rotate(2deg) scale(.99);opacity:.93;animation-timing-function:cubic-bezier(.3,.55,.35,1)}
  49%{left:8%;top:36%;transform:translate3d(0,-2px,0) rotate(8deg) scale(.94);opacity:.86;animation-timing-function:cubic-bezier(.2,.8,.3,1)}
  56%{left:10%;top:32%;transform:translate3d(0,-5px,0) rotate(3deg) scale(.97);opacity:.93;animation-timing-function:ease-in-out}
  62%{left:9%;top:36%;transform:translate3d(0,2px,0) rotate(-2deg) scale(.96);opacity:.9;animation-timing-function:cubic-bezier(.35,0,.25,1)}
  76%{left:30%;top:10%;transform:translate3d(0,0,0) rotate(-8deg) scale(1.01);opacity:.95;animation-timing-function:ease-in-out}
  82%{left:33%;top:9%;transform:translate3d(0,-5px,0) rotate(-3deg) scale(1);opacity:.96;animation-timing-function:ease-in-out}
  88%{left:31%;top:12%;transform:translate3d(0,2px,0) rotate(2deg) scale(.98);opacity:.92;animation-timing-function:cubic-bezier(.45,0,.55,1)}
  95%{left:58%;top:28%;transform:translate3d(0,-2px,0) rotate(7deg) scale(.94);opacity:.83}
}
@media(max-width:520px){.person-status-card .fairy-portal{width:60px;height:74px}.person-status-card .fairy-portal .card-fairy{width:58px}.person-status-card .fairy-portal::before{width:24px;height:34px;top:13px}.person-status-card .fairy-portal::after{width:20px;height:28px;top:25px}}
@media(prefers-reduced-motion:reduce){.owner-fairy-portal,.partner-fairy-portal{animation:none!important;left:auto;right:12px;top:14px;transform:none;opacity:.72}}

/* ===== v5.0 — hand-holding timezone couple ===== */
.time-couple{display:block;width:72px;height:66px;object-fit:contain;filter:drop-shadow(0 7px 9px rgba(114,50,109,.17));transform-origin:center bottom;animation:timeCoupleFloat 4.8s ease-in-out infinite}
@keyframes timeCoupleFloat{0%,100%{transform:translateY(1px) rotate(-.5deg)}50%{transform:translateY(-3px) rotate(.5deg)}}
@media(max-width:520px){.time-couple{width:62px;height:57px}}
@media(prefers-reduced-motion:reduce){.time-couple{animation:none}}

/* ===== v5.1 — illustrated Us, together chip ===== */
.couple-chip{width:62px;height:46px;padding:2px 7px;display:grid;place-items:center;overflow:visible;background:linear-gradient(145deg,#fff,#fff1f8)}
.couple-chip img{display:block;width:50px;height:43px;object-fit:contain;filter:drop-shadow(0 4px 6px rgba(104,43,98,.14))}
@media(max-width:520px){.couple-chip{width:58px;height:43px;padding:2px 6px}.couple-chip img{width:46px;height:40px}}

/* ===== v5.3 — responsive HTML daily rose popup ===== */
.daily-rose-overlay{position:fixed;inset:0;z-index:190;display:grid;place-items:center;padding:18px;background:rgba(54,19,50,.56);backdrop-filter:blur(10px);animation:dailyRoseFade .28s ease both}
.daily-rose-card{position:relative;width:min(100%,410px);max-height:calc(100dvh - 36px);overflow:auto;padding:28px 22px 22px;border:1px solid rgba(255,255,255,.88);border-radius:34px;background:linear-gradient(165deg,#fff8fb 0%,#ffe6ef 48%,#f4e9ff 100%);box-shadow:0 28px 85px rgba(69,18,62,.38);animation:dailyRoseArrival .7s var(--ease-bounce) both}
.daily-rose-copy{text-align:center;position:relative;z-index:3}
.daily-rose-eyebrow{margin:0 0 5px;color:#cc5b83;font-size:11px;font-weight:900;letter-spacing:1.6px}
.daily-rose-copy h2{margin:0;color:#a91d55;font-size:31px;line-height:1.2;font-family:"Z06 Walone","Pacifico","Baloo 2",cursive}
.daily-rose-copy>p:last-child{margin:6px 0 0;color:#b95a7c;font-size:16px;font-weight:750}
.daily-rose-scene{position:relative;height:270px;margin:15px -10px 16px;overflow:hidden;border-radius:27px;background:linear-gradient(180deg,#ffd7c5 0%,#f6b6c9 44%,#c7b7e9 100%);box-shadow:inset 0 0 0 1px rgba(255,255,255,.48)}
.daily-rose-gift-scene{display:block;width:100%;height:100%;object-fit:cover;object-position:center;animation:dailyCharactersArrive .85s var(--ease-bounce) .18s both}
.daily-rose-keep{width:100%;min-height:52px;display:flex;align-items:center;justify-content:center;gap:9px;border-radius:18px;font-size:16px}
.daily-rose-keep b{font-size:19px}
.daily-rose-keep:focus-visible{outline:4px solid rgba(255,255,255,.92);outline-offset:3px}
.daily-rose-overlay.rose-kept .daily-rose-card{animation:dailyRoseKept .52s var(--ease-bounce) forwards}
.daily-rose-overlay.rose-kept::after{content:'🌹';position:fixed;left:50%;top:50%;z-index:191;font-size:64px;transform:translate(-50%,-50%);animation:roseGiftBurst .52s var(--ease-bounce) both}
@keyframes dailyRoseFade{from{opacity:0}to{opacity:1}}
@keyframes dailyRoseArrival{0%{opacity:0;transform:translateX(-38px) scale(.9)}70%{opacity:1;transform:translateX(4px) scale(1.015)}100%{transform:none}}
@keyframes dailyCharactersArrive{0%{opacity:0;transform:translateX(-48px) scale(.94)}72%{opacity:1;transform:translateX(4px) scale(1.015)}100%{transform:none}}
@keyframes dailyRoseKept{to{opacity:0;transform:scale(.88) translateY(-15px)}}
@keyframes roseGiftBurst{0%{opacity:0;transform:translate(-50%,-30%) scale(.3)}65%{opacity:1;transform:translate(-50%,-60%) scale(1.18)}100%{opacity:0;transform:translate(-50%,-100%) scale(.9)}}
@media(max-width:430px){.daily-rose-overlay{padding:12px}.daily-rose-card{padding:23px 16px 17px;border-radius:29px}.daily-rose-copy h2{font-size:27px}.daily-rose-scene{height:240px;margin:13px -4px 14px}}
@media(max-height:650px){.daily-rose-card{padding-top:18px}.daily-rose-scene{height:210px;margin-top:10px}.daily-rose-copy h2{font-size:25px}}
@media(prefers-reduced-motion:reduce){.daily-rose-overlay,.daily-rose-card,.daily-rose-gift-scene,.daily-rose-overlay.rose-kept .daily-rose-card,.daily-rose-overlay.rose-kept::after{animation:none}}

/* ===== v6.5 — cohesive color, glass, micro-motion, local atmosphere ===== */
.person-status-card.tone-mint{background:linear-gradient(145deg,#baf2dd 0%,#79dcb9 52%,#4fc39c 100%)}
.person-status-card.tone-rose{background:linear-gradient(145deg,#ffd3e4 0%,#f3a5c4 52%,#df7fa8 100%)}
.person-status-card.tone-lemon{background:linear-gradient(145deg,#fff0b5 0%,#f2d782 52%,#dfbd58 100%)}
.person-status-card.tone-sky{background:linear-gradient(145deg,#d3efff 0%,#a2d4f2 52%,#7bb9e1 100%)}
.person-status-card.tone-peach{background:linear-gradient(145deg,#ffe0cc 0%,#f7bea1 52%,#e99c79 100%)}
.person-status-card.tone-lavender{background:linear-gradient(145deg,#cdb1ef 0%,#a980da 53%,#8060be 100%)}
.partner-card.tone-mint{background:linear-gradient(145deg,#caf5e7 0%,#82dfc2 46%,#8bcde8 100%)}
.partner-card.tone-rose{background:linear-gradient(145deg,#ffd5e8 0%,#f1a7cd 48%,#c99ee8 100%)}
.partner-card.tone-lemon{background:linear-gradient(145deg,#fff2ba 0%,#f4d78e 48%,#efb9bd 100%)}
.partner-card.tone-sky{background:linear-gradient(145deg,#d9f1ff 0%,#a7d8ed 48%,#b8b4ec 100%)}
.partner-card.tone-peach{background:linear-gradient(145deg,#ffe1ca 0%,#f8bda8 48%,#e9a8cf 100%)}
.partner-card.tone-lavender{background:linear-gradient(145deg,#d4b7ef 0%,#ad84da 50%,#8262bc 100%)}
.time-pair-card,.quick-checkin-card,.together-card,.day-panel,.edit-card{background:linear-gradient(145deg,rgba(255,255,255,.86),rgba(255,246,252,.7));border-color:rgba(255,255,255,.82);box-shadow:0 16px 42px rgba(101,55,95,.1),inset 0 1px 0 rgba(255,255,255,.95);-webkit-backdrop-filter:blur(16px) saturate(1.15);backdrop-filter:blur(16px) saturate(1.15)}
.person-status-card.atmosphere-morning{box-shadow:0 22px 50px rgba(201,124,91,.18),inset 0 0 58px rgba(255,232,181,.13)}
.person-status-card.atmosphere-day{box-shadow:0 22px 50px rgba(79,136,145,.16),inset 0 1px 0 rgba(255,255,255,.42)}
.person-status-card.atmosphere-evening{box-shadow:0 22px 52px rgba(143,76,133,.22),inset 0 0 64px rgba(184,104,182,.14)}
.person-status-card.atmosphere-night{box-shadow:0 22px 56px rgba(47,33,90,.28),inset 0 0 76px rgba(43,29,99,.2)}
.person-status-card.atmosphere-morning .person-card-top::after,.person-status-card.atmosphere-day .person-card-top::after,.person-status-card.atmosphere-evening .person-card-top::after,.person-status-card.atmosphere-night .person-card-top::after{position:absolute;right:0;top:27px;font-size:12px;opacity:.72}
.person-status-card .person-card-top::after{content:attr(data-atmosphere-label)}
.reaction-floater{position:absolute;z-index:20;left:50%;top:58%;font-size:39px;line-height:1;pointer-events:none;filter:drop-shadow(0 8px 13px rgba(72,25,79,.22));animation:reactionFloatAway 1.15s cubic-bezier(.18,.82,.25,1) both}.reaction-floater i{position:absolute;left:50%;top:50%;color:#fff4b8;font-size:13px;font-style:normal;animation:reactionSpark 1s ease-out both;animation-delay:calc(var(--spark-index)*35ms);transform:rotate(calc(var(--spark-index)*72deg)) translateY(-18px)}
@keyframes reactionFloatAway{0%{opacity:0;transform:translate(-50%,18px) scale(.35) rotate(-10deg)}28%{opacity:1;transform:translate(-50%,-5px) scale(1.24) rotate(6deg)}58%{transform:translate(-50%,-25px) scale(1.04) rotate(-3deg)}100%{opacity:0;transform:translate(-50%,-92px) scale(.8) rotate(4deg)}}
@keyframes reactionSpark{0%{opacity:0;transform:rotate(calc(var(--spark-index)*72deg)) translateY(-5px) scale(.3)}35%{opacity:1}100%{opacity:0;transform:rotate(calc(var(--spark-index)*72deg)) translateY(-48px) scale(1.15)}}
.button-success{background:linear-gradient(120deg,#36bd88,#6ed2aa)!important;color:#fff!important;box-shadow:0 12px 28px rgba(42,170,121,.25)!important;animation:buttonSuccessPop .55s var(--ease-bounce) both!important}
@keyframes buttonSuccessPop{0%{transform:scale(.94)}65%{transform:scale(1.025)}100%{transform:scale(1)}}
.quick-checkin-buttons button{position:relative}.quick-checkin-buttons button.sent::after{content:'✓';position:absolute;right:7px;top:5px;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#36bd88;color:#fff;font-size:11px;font-weight:900;animation:checkInTick .75s var(--ease-bounce) both}@keyframes checkInTick{0%{opacity:0;transform:scale(.2) rotate(-18deg)}55%{opacity:1;transform:scale(1.15) rotate(4deg)}100%{transform:scale(1)}}
@media(max-width:520px){.time-pair-card,.quick-checkin-card,.together-card,.day-panel,.edit-card{-webkit-backdrop-filter:blur(12px) saturate(1.1);backdrop-filter:blur(12px) saturate(1.1)}.person-status-card .person-card-top::after{font-size:10px!important;top:25px!important}}
@media(prefers-reduced-motion:reduce){.reaction-floater,.button-success,.quick-checkin-buttons button.sent::after{animation:none!important}}

/* ===== v6.6 — toast + install panel safe mobile layering ===== */
.toast{
  position:fixed!important;
  z-index:150!important;
  left:50%!important;
  right:auto!important;
  bottom:calc(104px + var(--safe-bottom))!important;
  width:max-content;
  max-width:calc(100vw - 32px);
  padding:11px 16px;
  text-align:center;
  line-height:1.55;
  white-space:normal;
  overflow-wrap:anywhere;
  pointer-events:none;
}
.install-hint{
  position:fixed!important;
  z-index:160!important;
  bottom:calc(104px + var(--safe-bottom))!important;
  max-height:calc(100dvh - 132px - var(--safe-bottom));
  overflow:auto;
}
@media(max-width:520px){.toast{bottom:calc(100px + var(--safe-bottom))!important;max-width:calc(100vw - 24px);border-radius:18px;padding:10px 14px}.install-hint{left:12px;right:12px;bottom:calc(100px + var(--safe-bottom))!important;max-height:calc(100dvh - 120px - var(--safe-bottom))}}

/* ===== v6.8 — privacy-friendly presence + response feedback ===== */
.person-presence{display:flex;align-items:center;gap:5px;width:max-content;margin:3px 0 7px;color:inherit;font-size:11px;font-weight:800;opacity:.88}
.person-presence i{width:7px;height:7px;border-radius:50%;background:#22c983;box-shadow:0 0 0 4px rgba(34,201,131,.16);animation:presenceBreathe 2.2s ease-in-out infinite}
.person-presence.offline{opacity:.65}.person-presence.offline i{background:currentColor;box-shadow:none;animation:none;opacity:.55}
@keyframes presenceBreathe{50%{box-shadow:0 0 0 7px rgba(34,201,131,0)}}
.person-status-card.new-comment-glow{animation:newCommentGlow 1.8s ease-out both}
@keyframes newCommentGlow{0%{box-shadow:0 0 0 0 rgba(255,255,255,0)}18%{box-shadow:0 0 0 5px rgba(255,255,255,.9),0 0 34px 9px rgba(255,115,188,.5)}100%{box-shadow:0 22px 50px rgba(101,55,95,.16),0 0 0 0 rgba(255,255,255,0)}}
@media(prefers-reduced-motion:reduce){.person-presence i,.person-status-card.new-comment-glow{animation:none!important}}

/* ===== v6.9 — clearer atmosphere icons + playful loading ===== */
.loading-emojis{gap:8px;min-height:48px}
.loading-emojis span{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:15px;background:rgba(255,255,255,.76);box-shadow:0 8px 22px rgba(148,3,130,.1);font-size:23px;animation:loadingEmojiWave 1.65s var(--ease-bounce) infinite both}
.loading-emojis span:nth-child(2){animation-delay:.14s}.loading-emojis span:nth-child(3){animation-delay:.28s}.loading-emojis span:nth-child(4){animation-delay:.42s}
@keyframes loadingEmojiWave{0%,65%,100%{opacity:.55;transform:translateY(3px) scale(.9) rotate(-3deg)}32%{opacity:1;transform:translateY(-8px) scale(1.08) rotate(4deg)}}
.loading-heart{margin-top:10px}
@media(max-width:380px){.loading-emojis span{width:38px;height:38px;font-size:21px}}
@media(prefers-reduced-motion:reduce){.loading-emojis span{animation:none!important;opacity:1}}

/* ===== v7.1 — offline queue feedback + both-free moment ===== */
.both-free-celebration{position:relative;z-index:24;grid-column:1/-1;justify-self:center;display:flex;align-items:center;gap:7px;margin:-5px 0 1px;padding:10px 16px;border:1px solid rgba(255,255,255,.92);border-radius:999px;background:rgba(255,255,255,.9);color:var(--brand);box-shadow:0 12px 32px rgba(151,46,135,.2);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);white-space:nowrap;pointer-events:none}
.both-free-celebration strong{font-size:13px}.both-free-celebration>span{color:var(--pink);font-size:17px}
.both-free-celebration.celebrate{animation:bothFreeArrival 1.8s var(--ease-bounce) both}.both-free-celebration.celebrate>span{animation:bothFreeHeart 1s ease-in-out 2}
@keyframes bothFreeArrival{0%{opacity:0;transform:translateY(8px) scale(.7)}24%{opacity:1;transform:translateY(-3px) scale(1.06)}65%{transform:translateY(0) scale(1)}100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes bothFreeHeart{50%{transform:scale(1.35) rotate(8deg)}}
@media(max-width:520px){.both-free-celebration{margin:-4px 0 1px;padding:9px 13px}.both-free-celebration strong{font-size:12px}}
@media(prefers-reduced-motion:reduce){.both-free-celebration,.both-free-celebration>span{animation:none!important}}

/* ===== v7.2 — compact activity inbox ===== */
.new-activity-banner{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:11px;margin:0 0 12px;padding:11px 12px;border:1px solid rgba(237,164,211,.72);border-radius:19px;background:linear-gradient(135deg,rgba(255,255,255,.95),rgba(255,235,248,.92));box-shadow:0 11px 28px rgba(128,52,114,.12);animation:activityBannerIn .4s var(--ease-bounce) both}
.new-activity-emoji{display:grid;place-items:center;width:39px;height:39px;border-radius:13px;background:#fff;box-shadow:0 6px 15px rgba(156,54,132,.12);font-size:21px}.new-activity-banner>div{display:grid;min-width:0}.new-activity-banner small{color:var(--pink);font-size:9px;font-weight:900;letter-spacing:.12em}.new-activity-banner strong{margin-top:2px;color:var(--text);font-size:13px;line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.new-activity-banner button{padding:9px 13px;border:0;border-radius:12px;background:var(--brand);color:#fff;font-size:12px;font-weight:900;box-shadow:0 7px 16px rgba(148,3,130,.18)}
@keyframes activityBannerIn{from{opacity:0;transform:translateY(-8px) scale(.98)}to{opacity:1;transform:none}}
.nav-item{position:relative}.nav-unread-dot{position:absolute;top:7px;left:calc(50% + 10px);width:8px;height:8px;border:2px solid #fff;border-radius:50%;background:#ff3f93;box-shadow:0 2px 7px rgba(198,26,111,.35);animation:navUnreadPulse 1.8s ease-in-out infinite}
@keyframes navUnreadPulse{50%{transform:scale(1.22);box-shadow:0 0 0 5px rgba(255,63,147,.13)}}
@media(max-width:420px){.new-activity-banner{gap:8px;padding:10px}.new-activity-emoji{width:36px;height:36px}.new-activity-banner strong{font-size:12px}.new-activity-banner button{padding:8px 10px}}
@media(prefers-reduced-motion:reduce){.new-activity-banner,.nav-unread-dot{animation:none!important}}
.quick-checkin-card.activity-highlight{animation:quickActivityGlow 1.8s ease-out both}
@keyframes quickActivityGlow{0%{box-shadow:0 0 0 0 rgba(255,255,255,0)}20%{box-shadow:0 0 0 5px rgba(255,255,255,.92),0 0 32px 8px rgba(255,93,177,.42)}100%{box-shadow:0 14px 34px rgba(119,62,105,.1)}}
@media(prefers-reduced-motion:reduce){.quick-checkin-card.activity-highlight{animation:none!important}}

/* ===== v8.0 — private realtime chat ===== */
.bottom-nav{grid-template-columns:repeat(4,1fr)}
#chatView{padding-bottom:32px}.chat-view{width:min(100%,760px);margin:0 auto}.chat-header{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:12px;padding:16px 18px;border:1px solid rgba(241,205,230,.8);border-radius:24px;background:rgba(255,255,255,.86);box-shadow:0 12px 30px rgba(109,50,99,.1);backdrop-filter:blur(14px)}.chat-header h2{margin:1px 0 0;font-size:25px;color:var(--brand-dark)}.chat-header small{display:block;margin-top:2px;color:var(--muted);font-size:12px}.chat-header>span{display:grid;place-items:center;width:45px;height:45px;border-radius:15px;background:linear-gradient(135deg,var(--pink-soft),var(--brand-soft));font-size:23px}
.chat-offline-notice{margin:0 0 9px;padding:8px 12px;border-radius:13px;background:#fff2c7;color:#8a6200;text-align:center;font-size:11px;font-weight:800}.chat-messages{height:clamp(360px,58dvh,650px);overflow-y:auto;overscroll-behavior:contain;padding:15px 11px 20px;border:1px solid rgba(238,205,227,.8);border-radius:25px 25px 10px 10px;background:linear-gradient(180deg,rgba(255,252,254,.9),rgba(250,237,247,.78));scroll-behavior:smooth}.chat-empty{display:grid;place-items:center;align-content:center;height:100%;min-height:260px;color:var(--muted);text-align:center}.chat-empty>span{font-size:44px}.chat-empty strong{margin-top:10px;color:var(--brand-dark);font-size:17px}.chat-empty p{margin:4px 0;font-size:12px}
.chat-pinned-bar{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:9px;margin:0 3px 7px;padding:7px 8px;border:1px solid rgba(255,255,255,.82);border-left:3px solid #8057d8;border-radius:12px;background:rgba(255,255,255,.78);box-shadow:0 7px 18px rgba(70,47,102,.1);backdrop-filter:blur(15px);cursor:pointer}.chat-pinned-icon{display:grid;place-items:center;width:29px;height:29px;border-radius:9px;background:#ece3fb;color:#7650ca;font-size:17px}.chat-pinned-bar>div{display:grid;min-width:0}.chat-pinned-bar small{color:#7650ca;font-size:9px;font-weight:900}.chat-pinned-bar strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text);font-size:11px}.chat-pinned-bar>button{width:29px;height:29px;padding:0;border:0;border-radius:9px;background:transparent;color:var(--muted);font-size:20px}.chat-pinned-bar:focus-visible{outline:3px solid rgba(128,87,216,.35);outline-offset:2px}
.chat-date-separator,.chat-new-marker{width:max-content;margin:12px auto;padding:5px 10px;border-radius:999px;background:rgba(255,255,255,.84);color:var(--muted);font-size:10px;font-weight:800}.chat-new-marker{position:relative;width:100%;padding:0;background:transparent;color:var(--pink);text-align:center}.chat-new-marker::before,.chat-new-marker::after{content:"";display:inline-block;width:24%;height:1px;margin:0 8px 3px;background:rgba(229,95,166,.35)}
.chat-message{display:flex;align-items:flex-end;gap:5px;margin:6px 0}.chat-message.mine{justify-content:flex-end}.chat-message.theirs{justify-content:flex-start}.chat-bubble{max-width:min(78%,520px);padding:10px 12px 7px;border-radius:19px;background:#fff;color:var(--text);box-shadow:0 5px 15px rgba(91,46,84,.08)}.chat-message.mine .chat-bubble{border-bottom-right-radius:6px;background:linear-gradient(135deg,#ce75cf,#a94bc1);color:#fff}.chat-message.theirs .chat-bubble{border-bottom-left-radius:6px}.chat-bubble p{margin:0;font-size:15px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}.chat-bubble footer{display:flex;justify-content:flex-end;gap:7px;margin-top:4px;min-height:13px;font-size:9px;opacity:.72}.chat-message.queued .chat-bubble{opacity:.7}.chat-replied{display:grid;margin:-2px -3px 7px;padding:6px 8px;border-left:3px solid currentColor;border-radius:8px;background:rgba(255,255,255,.18);opacity:.85}.chat-message.theirs .chat-replied{background:var(--brand-soft);color:var(--brand)}.chat-replied small{font-size:9px;font-weight:900}.chat-replied span{max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}.chat-reply-btn{width:28px;height:28px;border:0;border-radius:50%;background:rgba(255,255,255,.82);color:var(--muted);opacity:0;transition:opacity .15s,transform .15s}.chat-message:hover .chat-reply-btn,.chat-reply-btn:focus-visible{opacity:1}.chat-reply-btn:active{transform:scale(.9)}
.chat-composer{position:sticky;bottom:calc(90px + var(--safe-bottom));z-index:12;margin-top:8px;padding:9px;border:1px solid rgba(237,199,225,.88);border-radius:10px 10px 23px 23px;background:rgba(255,255,255,.94);box-shadow:0 14px 34px rgba(107,51,97,.14);backdrop-filter:blur(16px)}.chat-compose-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:end;gap:7px}.chat-compose-row textarea{width:100%;min-height:42px;max-height:120px;resize:none;padding:10px 12px;border:1px solid var(--line);border-radius:15px;background:#fff;color:var(--text);font:inherit;font-size:16px;line-height:1.4;outline:none}.chat-compose-row textarea:focus{border-color:var(--pink);box-shadow:0 0 0 3px rgba(255,99,171,.1)}.chat-emoji-btn,.chat-send-btn{width:42px;height:42px;border:0;border-radius:14px;font-size:19px}.chat-emoji-btn{background:var(--pink-soft);color:var(--brand)}.chat-send-btn{background:linear-gradient(135deg,var(--brand),var(--pink));color:#fff;box-shadow:0 7px 16px rgba(148,3,130,.2)}.chat-send-btn:disabled{opacity:.5}.chat-input-count{display:block;margin:4px 7px 0;text-align:right;color:var(--muted);font-size:9px}.chat-reply-preview{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:7px;padding:7px 9px;border-radius:12px;background:var(--brand-soft);border-left:3px solid var(--brand)}.chat-reply-preview>div{display:grid;min-width:0}.chat-reply-preview small{color:var(--brand);font-size:9px;font-weight:900}.chat-reply-preview strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text);font-size:11px}.chat-reply-preview button{width:27px;height:27px;border:0;border-radius:9px;background:#fff;color:var(--brand)}
.chat-unread-badge{position:absolute;top:4px;left:calc(50% + 9px);display:grid;place-items:center;min-width:18px;height:18px;padding:0 4px;border:2px solid #fff;border-radius:999px;background:#ff3f93;color:#fff;font-style:normal;font-size:9px;font-weight:900;box-shadow:0 4px 10px rgba(205,31,117,.28)}
@media(max-width:520px){#chatView{padding-bottom:18px}.chat-header{padding:13px 14px;border-radius:21px}.chat-header h2{font-size:22px}.chat-messages{height:calc(100dvh - 330px);min-height:330px;padding:12px 8px 17px}.chat-bubble{max-width:83%}.chat-reply-btn{opacity:.72}.chat-composer{bottom:calc(86px + var(--safe-bottom));padding:8px}.nav-item small{font-size:9px}}
.chat-delivery-state{min-width:18px;font-weight:900;letter-spacing:-2px}.chat-message.mine .chat-delivery-state{color:rgba(255,255,255,.92)}.chat-message.queued .chat-delivery-state{letter-spacing:0}.chat-new-marker{position:sticky;top:4px;z-index:3;padding:5px 0;background:rgba(252,242,249,.9);backdrop-filter:blur(7px)}
.chat-message-actions{display:flex;align-items:center;gap:4px}.chat-message-actions button{width:28px;height:28px;border:0;border-radius:50%;background:rgba(255,255,255,.82);color:var(--muted);opacity:0;transition:opacity .15s,transform .15s}.chat-message:hover .chat-message-actions button,.chat-message-actions button:focus-visible{opacity:1}.chat-message-actions button:active{transform:scale(.9)}.chat-delete-btn{color:#c83f72!important}.chat-message-actions .chat-reply-btn{display:grid;place-items:center}
@media(max-width:520px){.chat-message-actions button{opacity:.7}.chat-message-actions{flex-direction:column}}
.chat-action-backdrop{position:fixed;inset:0;z-index:175;background:rgba(25,18,31,.34);backdrop-filter:blur(2px);animation:dailyRoseFade .16s ease both}.chat-action-sheet{position:fixed;z-index:176;top:var(--chat-menu-top,30%);left:var(--chat-menu-left,24px);width:var(--chat-menu-width,306px);padding:8px;border:1px solid rgba(255,255,255,.82);border-radius:18px;background:rgba(255,252,255,.98);box-shadow:0 22px 55px rgba(48,27,51,.3);animation:chatActionFloat .2s var(--ease-bounce) both}.chat-action-handle,.chat-action-sheet>small,.chat-action-sheet>p{display:none}.chat-action-sheet>button{display:flex;align-items:center;gap:13px;width:100%;min-height:50px;padding:0 15px;border:0;border-radius:12px;background:transparent;color:var(--text);font-size:16px;font-weight:750;text-align:left}.chat-action-sheet>button:active{background:var(--pink-soft);transform:scale(.985)}.chat-action-sheet>button span{display:grid;place-items:center;width:30px;color:var(--brand);font-size:21px}.chat-action-sheet>button.danger,.chat-action-sheet>button.danger span{color:#d52f68}.chat-action-sheet>button.cancel{display:none}.chat-action-sheet b{font:inherit}@keyframes chatActionFloat{from{opacity:0;transform:translateY(8px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}body.chat-actions-open{overflow:hidden}
.chat-reaction-picker{position:absolute;left:0;bottom:calc(100% + 7px);display:grid;grid-template-columns:repeat(7,1fr);gap:2px;width:100%;padding:7px;border:1px solid rgba(255,255,255,.88);border-radius:999px;background:rgba(255,252,255,.98);box-shadow:0 12px 30px rgba(48,27,51,.24)}.chat-reaction-picker button{display:grid;place-items:center;min-width:0;height:40px;padding:0;border:0;border-radius:50%;background:transparent;font-size:23px;transition:transform .16s var(--ease-bounce),background .16s}.chat-reaction-picker button:active{transform:scale(.82)}.chat-reaction-picker button.selected{background:var(--pink-soft);box-shadow:0 4px 12px rgba(122,47,109,.15);transform:translateY(-3px) scale(1.08)}.chat-message-reactions{display:flex;flex-wrap:wrap;gap:4px;margin:6px 0 -2px}.chat-message-reactions span{padding:3px 7px;border:1px solid rgba(205,113,181,.26);border-radius:999px;background:rgba(255,255,255,.8);color:var(--text);font-size:13px;line-height:1.1}.chat-message.mine .chat-message-reactions span{background:rgba(255,255,255,.2);color:#fff;border-color:rgba(255,255,255,.28)}.chat-message-reactions span.mine{box-shadow:0 0 0 2px rgba(255,211,237,.55)}
.chat-emoji-picker{display:grid;grid-template-columns:repeat(8,1fr);gap:4px;max-height:176px;margin-bottom:8px;padding:7px;overflow-y:auto;border-radius:17px;background:linear-gradient(145deg,#fff8fc,#f7eaf4);border:1px solid rgba(237,199,225,.75)}.chat-emoji-picker button{display:grid;place-items:center;min-width:0;height:38px;padding:0;border:0;border-radius:11px;background:transparent;font-size:21px}.chat-emoji-picker button:active{background:#fff;transform:scale(.84)}.chat-emoji-btn.active{background:var(--brand)!important;color:#fff!important;transform:rotate(-8deg)}
@media(max-width:420px){.chat-emoji-picker{grid-template-columns:repeat(6,1fr);max-height:170px}.chat-emoji-picker button{height:37px}}

/* ===== v89 — chat identity, menu and cleaner composer ===== */
.chat-topbar{position:relative;z-index:16;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:11px;margin-bottom:8px;padding:10px 11px;border:1px solid rgba(236,195,224,.82);border-radius:22px;background:rgba(255,255,255,.91);box-shadow:0 10px 25px rgba(96,45,88,.1);backdrop-filter:blur(16px)}
.chat-partner-avatar{display:grid;place-items:center;width:44px;height:44px;overflow:hidden;border-radius:50%;background:linear-gradient(145deg,#fff0f8,#eadcfb);box-shadow:inset 0 0 0 2px rgba(255,255,255,.85);font-size:24px}.chat-partner-avatar img{width:100%;height:100%;object-fit:cover}.chat-partner-copy{display:grid;min-width:0}.chat-partner-copy strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--brand-dark);font-size:17px}.chat-partner-copy small{display:flex;align-items:center;gap:6px;color:#28a66c;font-size:11px;font-weight:750}.chat-partner-copy small i{width:7px;height:7px;border-radius:50%;background:#35c47d;box-shadow:0 0 0 3px rgba(53,196,125,.13)}.chat-partner-copy small.offline{color:var(--muted)}.chat-partner-copy small.offline i{background:#b9a9b5;box-shadow:none}
.chat-more-btn{width:42px;height:42px;padding:0 0 7px;border:0;border-radius:14px;background:var(--pink-soft);color:var(--brand);font-size:20px;font-weight:900;letter-spacing:2px}.chat-more-btn[aria-expanded="true"]{background:var(--brand);color:#fff}.chat-more-menu{position:absolute;top:calc(100% + 7px);right:4px;width:min(260px,calc(100vw - 34px));padding:7px;border:1px solid rgba(235,196,224,.9);border-radius:17px;background:rgba(255,255,255,.98);box-shadow:0 18px 45px rgba(60,28,56,.2);animation:chatActionFloat .18s ease both}.chat-more-menu button{display:flex;align-items:center;gap:11px;width:100%;min-height:45px;padding:0 11px;border:0;border-radius:11px;background:transparent;color:var(--text);font-size:13px;text-align:left}.chat-more-menu button:active{background:var(--pink-soft)}.chat-more-menu button span{display:grid;place-items:center;width:28px;color:var(--brand);font-size:20px}.chat-more-menu button b{font:inherit;font-weight:760}
.chat-search-bar{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:8px;margin-bottom:8px;padding:7px 9px 7px 13px;border:1px solid rgba(232,188,219,.82);border-radius:16px;background:rgba(255,255,255,.94);color:var(--brand)}.chat-search-bar input{min-width:0;height:34px;border:0;background:transparent;color:var(--text);font:inherit;font-size:14px;outline:0}.chat-search-bar button{width:32px;height:32px;border:0;border-radius:10px;background:var(--pink-soft);color:var(--brand);font-size:18px}
.chat-composer{padding:6px;border:1px solid rgba(228,180,215,.82);border-radius:24px;background:rgba(255,255,255,.96);box-shadow:0 12px 30px rgba(91,42,83,.14)}.chat-compose-row{gap:3px}.chat-compose-row textarea{min-height:44px;padding:11px 8px 8px;border:0!important;border-radius:0;background:transparent!important;box-shadow:none!important;font-size:16px}.chat-compose-row textarea::placeholder{color:#a698a3}.chat-emoji-btn,.chat-send-btn{width:44px;height:44px;border-radius:50%}.chat-emoji-btn{background:transparent}.chat-send-btn{box-shadow:0 6px 15px rgba(148,3,130,.25);transition:transform .16s var(--ease-bounce)}.chat-send-btn:active{transform:scale(.88)}.chat-send-btn:disabled{box-shadow:none}.chat-input-count{display:none;margin:3px 12px 1px}.chat-composer:focus-within .chat-input-count{display:block}.chat-reply-preview{margin:2px 4px 5px;border-radius:14px}
@media(max-width:520px){.chat-topbar{position:sticky;top:4px}.chat-messages{height:calc(100dvh - 315px);min-height:390px}.chat-more-menu{right:0}.chat-composer{border-radius:24px}}

/* ===== v91 — expandable, frequently-used message reactions ===== */
.chat-reaction-picker{grid-template-columns:repeat(7,1fr)}.chat-reaction-more-btn{background:#eadce8!important;color:var(--brand)!important;font-family:system-ui,sans-serif;font-size:23px!important;font-weight:900;transition:transform .18s var(--ease-bounce)!important}.chat-reaction-more-btn[aria-expanded="true"]{transform:rotate(180deg);background:var(--pink-soft)!important}.chat-reaction-more{position:absolute;left:0;bottom:calc(100% + 8px);display:grid;grid-template-columns:repeat(7,1fr);gap:3px;width:100%;max-height:205px;padding:8px;overflow-y:auto;border:1px solid rgba(255,255,255,.9);border-radius:22px;background:rgba(255,252,255,.99);box-shadow:0 15px 35px rgba(48,27,51,.25);overscroll-behavior:contain}.chat-reaction-more button{height:39px;font-size:22px}.chat-reaction-picker.expanded{border-radius:20px}.chat-reaction-picker.expanded::after{content:"More reactions";position:absolute;left:14px;bottom:calc(100% + 218px);color:#fff;font-size:9px;font-weight:850;letter-spacing:.08em;text-shadow:0 1px 5px rgba(0,0,0,.35)}
@media(max-width:380px){.chat-reaction-picker,.chat-reaction-more{grid-template-columns:repeat(7,1fr)}.chat-reaction-picker button,.chat-reaction-more button{font-size:20px}}

/* ===== v92 — typing, photo and voice messages ===== */
.chat-partner-typing{display:flex!important;align-items:center;gap:6px;color:var(--brand)!important;font-size:11px!important;font-weight:800}.chat-partner-typing>span{width:5px;height:5px;border-radius:50%;background:currentColor;box-shadow:8px 0 0 currentColor,16px 0 0 currentColor;animation:typingDots 1.1s ease-in-out infinite}.chat-partner-typing.hidden{display:none!important}@keyframes typingDots{0%,100%{opacity:.35;transform:translateY(0)}50%{opacity:1;transform:translateY(-2px)}}
.chat-compose-row{grid-template-columns:auto minmax(80px,1fr) auto auto auto;align-items:center}.chat-media-btn,.chat-mic-btn{display:grid;place-items:center;width:38px;height:38px;padding:0;border:0;border-radius:50%;background:transparent;color:var(--brand);font:inherit;font-size:23px;font-weight:500;cursor:pointer}.chat-mic-btn{font-size:19px}.chat-mic-btn.recording{background:#ffe3ed;color:#dc2862;animation:recordingPulse 1s ease-in-out infinite}.chat-emoji-btn{width:38px;height:38px}.chat-recording-bar{display:flex;align-items:center;gap:9px;margin:2px 3px 7px;padding:9px 11px;border-radius:14px;background:#fff0f5;color:#c6265b;font-size:11px}.chat-recording-bar i{width:9px;height:9px;border-radius:50%;background:#ef3c65;animation:recordingPulse 1s ease-in-out infinite}.chat-recording-bar span{flex:1;color:var(--muted)}.chat-recording-bar button{padding:6px 9px;border:0;border-radius:9px;background:#fff;color:#c6265b;font-size:10px;font-weight:850}@keyframes recordingPulse{50%{opacity:.5;transform:scale(.88)}}.chat-upload-progress{position:fixed;z-index:230;top:calc(14px + var(--safe-top));left:50%;width:min(calc(100% - 32px),390px);height:22px;margin:0;overflow:hidden;border:1px solid rgba(255,255,255,.9);border-radius:999px;background:#f4e5ef;box-shadow:0 8px 24px rgba(67,27,61,.2);transform:translateX(-50%)}.chat-upload-progress>span{position:absolute;inset:0 auto 0 0;width:0;background:linear-gradient(90deg,var(--pink),var(--brand));transition:width .15s}.chat-upload-progress small{position:absolute;inset:0;display:grid;place-items:center;color:var(--brand-dark);font-size:9px;font-weight:900}
.chat-photo-message{display:block;width:min(270px,100%);padding:0;border:0;border-radius:14px;background:transparent;overflow:hidden}.chat-photo-message img{display:block;width:100%;max-height:340px;object-fit:cover}.chat-message.voice .chat-bubble{width:min(235px,72vw);padding:9px 11px 6px}.chat-voice-player{display:flex;align-items:center;gap:9px;width:100%;min-height:38px;padding:0;background:transparent}.chat-voice-toggle{display:grid;flex:0 0 32px;place-items:center;width:32px;height:32px;padding:0 0 0 2px;border:0;border-radius:50%;background:var(--brand);color:#fff;font-size:12px;cursor:pointer;transition:transform .16s var(--ease-bounce),background .16s}.chat-message.mine .chat-voice-toggle{background:#fff;color:var(--brand)}.chat-voice-toggle:active{transform:scale(.86)}.chat-voice-player.playing .chat-voice-toggle{padding:0;font-size:10px;animation:voiceGlow 1.5s ease-in-out infinite}.chat-voice-content{display:grid;flex:1;gap:0;min-width:0}.chat-voice-range{width:100%;height:20px;margin:0;appearance:none;background:transparent;cursor:pointer}.chat-voice-range::-webkit-slider-runnable-track{height:13px;border-radius:7px;background:repeating-linear-gradient(90deg,currentColor 0 2px,transparent 2px 5px);color:var(--brand);opacity:.58;mask:linear-gradient(180deg,transparent 8%,#000 8% 92%,transparent 92%)}.chat-message.mine .chat-voice-range::-webkit-slider-runnable-track{color:#fff}.chat-voice-range::-webkit-slider-thumb{width:9px;height:9px;margin-top:2px;appearance:none;border:2px solid #fff;border-radius:50%;background:var(--brand)}.chat-message.mine .chat-voice-range::-webkit-slider-thumb{background:#fff;border-color:var(--brand)}.chat-voice-range::-moz-range-track{height:4px;border-radius:5px;background:rgba(143,31,126,.25)}.chat-voice-range::-moz-range-progress{height:4px;border-radius:5px;background:currentColor}.chat-voice-range::-moz-range-thumb{width:8px;height:8px;border:2px solid #fff;border-radius:50%;background:var(--brand)}.chat-voice-time{color:inherit;font-size:8px;font-weight:800;letter-spacing:.02em;opacity:.68}.chat-voice-audio{display:none}@keyframes voiceGlow{50%{box-shadow:0 0 0 4px rgba(255,255,255,.18)}}.chat-message.voice .chat-bubble>footer{margin-top:1px}.chat-message:has(.chat-photo-message) .chat-bubble{padding:4px 4px 7px}.chat-message:has(.chat-photo-message) .chat-bubble>p{padding:5px 8px 0}
.chat-photo-preview{position:fixed;z-index:193;left:50%;top:50%;width:min(calc(100% - 28px),430px);padding:13px;border-radius:25px;background:#fff;box-shadow:0 25px 80px rgba(42,18,39,.32);transform:translate(-50%,-50%)}#chatPhotoPreviewBackdrop{z-index:192}.chat-media-modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;padding:0 3px}.chat-media-modal-head strong{color:var(--brand-dark);font-size:18px}.chat-media-modal-head button{width:35px;height:35px;border:0;border-radius:11px;background:var(--pink-soft);color:var(--brand);font-size:20px}.chat-photo-preview img{display:block;width:100%;max-height:56dvh;object-fit:contain;border-radius:17px;background:#f5eef3}.chat-photo-preview textarea{width:100%;margin-top:10px;padding:11px 12px;resize:none;border:1px solid var(--line);border-radius:14px;background:#fff;color:var(--text);font:inherit;font-size:15px;outline:0}.chat-photo-preview textarea:focus{border-color:var(--pink)}.chat-photo-preview .full{margin-top:9px}
.chat-media-viewer{position:fixed;inset:0;z-index:210;display:grid;place-items:center;padding:calc(72px + var(--safe-top)) 18px calc(24px + var(--safe-bottom));background:rgba(20,12,20,.94);backdrop-filter:blur(8px)}.chat-media-viewer img{display:block;max-width:100%;max-height:calc(100dvh - 120px - var(--safe-top) - var(--safe-bottom));object-fit:contain;border-radius:14px;opacity:0;transform:scale(.975);box-shadow:0 20px 70px rgba(0,0,0,.4);transition:opacity .22s ease,transform .22s ease,filter .28s ease}.chat-media-viewer.previewing img,.chat-media-viewer.ready img{visibility:visible;opacity:1;transform:none}.chat-media-viewer.previewing img{filter:blur(7px);opacity:.8}.chat-media-viewer.loading:not(.previewing) img,.chat-media-viewer.error img{visibility:hidden}.chat-media-viewer::before{display:none;color:#fff;text-align:center;white-space:pre-line}.chat-media-viewer.loading:not(.previewing)::before{display:block;width:42px;height:42px;border:4px solid rgba(255,255,255,.22);border-top-color:#fff;border-radius:50%;content:"";animation:mediaViewerSpin .8s linear infinite}.chat-media-viewer.error::before{display:block;content:"🖼️\A Photo ကိုဖွင့်လို့မရသေးပါ\A ပြန်ပိတ်ပြီး ထပ်စမ်းပါ";color:rgba(255,255,255,.88);font-size:13px;font-weight:800;line-height:1.8}.chat-media-viewer>button{position:absolute;z-index:1;top:calc(14px + var(--safe-top));height:43px;border:1px solid rgba(255,255,255,.3);background:rgba(0,0,0,.52);color:#fff}.chat-media-close{right:14px;width:43px;border-radius:50%;font-size:25px}.chat-media-download{right:67px;width:auto!important;padding:0 15px;border-radius:999px;font:800 13px/1 system-ui,sans-serif}.chat-media-download span{margin-left:3px}.chat-media-download:disabled{opacity:.5}@keyframes mediaViewerSpin{to{transform:rotate(360deg)}}
@media(max-width:420px){.chat-compose-row{grid-template-columns:34px minmax(70px,1fr) 34px 34px 42px;gap:1px}.chat-media-btn,.chat-mic-btn,.chat-emoji-btn{width:34px;height:38px}.chat-send-btn{width:42px;height:42px}.chat-compose-row textarea{padding-inline:5px}.chat-photo-message{width:min(245px,100%)}}
@media(prefers-reduced-motion:reduce){.chat-partner-typing>span,.chat-mic-btn.recording,.chat-recording-bar i{animation:none!important}}

/* ===== v99 — compact voice-note player ===== */
.chat-message.voice .chat-bubble{width:min(208px,64vw);min-width:178px;padding:7px 9px 5px;border-radius:17px}
.chat-voice-player{gap:7px;min-height:34px}
.chat-voice-toggle{flex-basis:29px;width:29px;height:29px;background:linear-gradient(145deg,var(--pink),var(--brand));box-shadow:0 4px 10px rgba(143,31,126,.22);font-size:10px}
.chat-message.mine .chat-voice-toggle{background:rgba(255,255,255,.96);box-shadow:0 4px 10px rgba(80,20,70,.14);color:var(--brand)}
.chat-voice-content{gap:1px}
.chat-voice-range{height:17px}
.chat-voice-range::-webkit-slider-runnable-track{height:11px;background:repeating-linear-gradient(90deg,currentColor 0 2px,transparent 2px 4px);opacity:.48}
.chat-voice-range::-webkit-slider-thumb{width:7px;height:7px;margin-top:2px;border-width:1px}
.chat-voice-time{font-family:ui-rounded,system-ui,sans-serif;font-size:7.5px;font-weight:750;opacity:.62}
.chat-message.voice .chat-bubble>footer{margin-top:0;padding-right:1px}
@media(max-width:380px){.chat-message.voice .chat-bubble{width:min(195px,62vw);min-width:170px}}

/* ===== v100 — roomy messages and photo reply previews ===== */
.chat-bubble.long-text{width:min(88%,520px)}
.chat-photo-message{width:min(318px,76vw);border-radius:16px}
.chat-photo-message img{width:100%;height:auto;max-height:430px;object-fit:cover}
.chat-message:has(.chat-photo-message) .chat-bubble{max-width:min(86%,540px)}
.chat-replied{grid-template-columns:minmax(0,1fr);align-items:center;gap:7px;min-width:0}
.chat-replied.photo{grid-template-columns:38px minmax(0,1fr);padding:5px 7px}
.chat-replied>div{display:grid;min-width:0}
.chat-replied img{width:38px;height:38px;object-fit:cover;border-radius:7px;background:rgba(255,255,255,.3)}
.chat-replied.photo small{color:#ff6f9e}
.chat-replied.photo span{font-weight:750}
@media(max-width:520px){.chat-bubble.long-text{width:91%;max-width:91%}.chat-photo-message{width:min(310px,78vw)}.chat-message:has(.chat-photo-message) .chat-bubble{max-width:88%}}
@media(max-width:360px){.chat-photo-message{width:76vw}.chat-bubble.long-text{width:93%;max-width:93%}}

/* ===== v101 — customizable chat backgrounds ===== */
.chat-messages{background-color:#fff7fb;background-size:auto,auto;transition:background-color .25s ease}
.chat-messages[data-background="blush"]{background-image:radial-gradient(circle at 12% 18%,rgba(255,158,201,.16) 0 2px,transparent 3px),linear-gradient(145deg,#fff9fc,#fdf1f8)}
.chat-messages[data-background="lavender"]{background-image:radial-gradient(circle at 18% 20%,rgba(139,95,191,.13) 0 2px,transparent 3px),linear-gradient(145deg,#fbf8ff,#eee8fb)}
.chat-messages[data-background="sakura"]{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='90' height='90' viewBox='0 0 90 90'%3E%3Cg fill='%23ef9dbf' fill-opacity='.14'%3E%3Ccircle cx='15' cy='15' r='4'/%3E%3Ccircle cx='23' cy='15' r='4'/%3E%3Ccircle cx='19' cy='9' r='4'/%3E%3Ccircle cx='19' cy='21' r='4'/%3E%3Ccircle cx='70' cy='64' r='3'/%3E%3C/g%3E%3C/svg%3E"),linear-gradient(150deg,#fffafa,#fff0f7)}
.chat-messages[data-background="night"]{background-image:radial-gradient(circle at 20% 22%,rgba(255,255,255,.6) 0 1px,transparent 1.5px),radial-gradient(circle at 72% 65%,rgba(255,205,245,.5) 0 1px,transparent 1.5px),linear-gradient(155deg,#201a38,#392248);background-size:55px 55px,73px 73px,auto}.chat-messages[data-background="night"] .chat-date-separator,.chat-messages[data-background="night"] .chat-new-marker{color:#fff;background:rgba(31,18,45,.72)}.chat-messages[data-background="night"] .chat-empty{color:#f9ebff}
.chat-messages[data-background="hearts"]{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72'%3E%3Ctext x='8' y='25' font-size='13' fill='%23df78aa' fill-opacity='.13'%3E%E2%99%A1%3C/text%3E%3Ctext x='48' y='58' font-size='10' fill='%238e4fa4' fill-opacity='.11'%3E%E2%99%A1%3C/text%3E%3C/svg%3E"),linear-gradient(145deg,#fff8fc,#f9eef8)}
.chat-messages[data-background="clean"]{background:#f7f7f9}
#chatBackgroundBackdrop{z-index:194}.chat-background-picker{position:fixed;z-index:195;left:50%;top:50%;width:min(calc(100% - 28px),430px);padding:18px;border:1px solid rgba(255,255,255,.92);border-radius:27px;background:rgba(255,252,255,.98);box-shadow:0 26px 80px rgba(63,27,58,.3);transform:translate(-50%,-50%);animation:profileEditorIn .24s var(--ease-bounce) both}.chat-background-head{display:flex;align-items:flex-start;justify-content:space-between}.chat-background-head h3{margin:2px 0;color:var(--brand-dark);font-size:23px}.chat-background-head button{width:36px;height:36px;border:0;border-radius:12px;background:var(--pink-soft);color:var(--brand);font-size:20px}.chat-background-hint{margin:5px 0 14px;color:var(--muted);font-size:12px}.chat-background-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.chat-background-options>button{position:relative;display:grid;grid-template-columns:42px minmax(0,1fr) 20px;align-items:center;gap:8px;min-height:57px;padding:7px;border:1px solid var(--line);border-radius:16px;background:#fff;color:var(--text);font:inherit;text-align:left}.chat-background-options>button.selected{border-color:var(--pink);box-shadow:0 0 0 3px rgba(255,99,171,.1)}.chat-background-options>button>b{display:none;color:var(--brand)}.chat-background-options>button.selected>b{display:block}.background-sample{width:42px;height:42px;border-radius:11px;box-shadow:inset 0 0 0 1px rgba(80,30,70,.08)}.background-sample.blush{background:linear-gradient(145deg,#fff9fc,#f7dce9)}.background-sample.lavender{background:linear-gradient(145deg,#faf6ff,#dcd0f2)}.background-sample.sakura{background:radial-gradient(circle at 30% 30%,#f2a6c3 0 3px,transparent 4px),#fff0f6}.background-sample.night{background:radial-gradient(circle at 30% 25%,#fff 0 1px,transparent 2px),linear-gradient(145deg,#201a38,#4a2b59)}.background-sample.hearts{background:linear-gradient(145deg,#fff5fb,#edd8e9)}.background-sample.hearts::after{content:'♡';display:grid;place-items:center;height:100%;color:#cf6f9e;font-size:23px}.background-sample.clean{background:#f3f3f5}@media(max-width:380px){.chat-background-options{grid-template-columns:1fr}.chat-background-picker{max-height:88dvh;overflow:auto}}

/* ===== v102 — unified rounded chat icons ===== */
.chat-topbar svg,.chat-more-menu svg,.chat-compose-row svg{display:block;width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.chat-more-btn{display:grid;place-items:center;padding:0}.chat-more-btn svg{width:22px;height:22px;fill:currentColor;stroke:none}.chat-more-menu button span svg{width:21px;height:21px}.chat-emoji-btn,.chat-mic-btn,.chat-media-btn,.chat-send-btn{display:grid;place-items:center}.chat-emoji-btn svg,.chat-mic-btn svg,.chat-media-btn svg{width:23px;height:23px}.chat-emoji-btn .fill-icon{fill:currentColor;stroke:none}.chat-send-btn svg{width:21px;height:21px;transform:translateX(1px)}.chat-media-btn{transition:background .16s,transform .16s}.chat-media-btn:active,.chat-emoji-btn:active,.chat-mic-btn:active{background:var(--pink-soft);transform:scale(.9)}.chat-mic-btn.recording svg{animation:recordingPulse 1s ease-in-out infinite}

/* ===== v90 — private chat profile editor ===== */
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}#profileEditorBackdrop{z-index:190}.profile-editor{position:fixed;z-index:191;left:50%;top:50%;width:min(calc(100% - 28px),390px);padding:18px;border:1px solid rgba(255,255,255,.9);border-radius:27px;background:rgba(255,252,255,.98);box-shadow:0 26px 80px rgba(63,27,58,.3);transform:translate(-50%,-50%);animation:profileEditorIn .24s var(--ease-bounce) both}.profile-editor-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.profile-editor-head h3{margin:2px 0 0;color:var(--brand-dark);font-size:23px}.profile-editor-head button{width:36px;height:36px;border:0;border-radius:12px;background:var(--pink-soft);color:var(--brand);font-size:20px}.profile-preview{display:grid;place-items:center;width:106px;height:106px;margin:17px auto 12px;overflow:hidden;border:5px solid #fff;border-radius:50%;background:linear-gradient(145deg,#fff0f8,#e9dcfb);box-shadow:0 10px 28px rgba(116,46,102,.17)}.profile-preview span{font-size:55px}.profile-preview img{width:100%;height:100%;object-fit:cover}.profile-photo-button{display:grid;place-items:center;min-height:43px;margin-bottom:13px;border:1px dashed rgba(188,86,160,.48);border-radius:14px;background:#fff5fb;color:var(--brand);font-size:13px;font-weight:850;cursor:pointer}.profile-name-field{display:grid;gap:6px;margin-bottom:12px}.profile-name-field>span{color:var(--brand-dark);font-size:12px;font-weight:850}.profile-name-field input{height:46px;padding:0 13px;border:1px solid var(--line);border-radius:14px;background:#fff;color:var(--text);font:inherit;font-size:16px;outline:none}.profile-name-field input:focus{border-color:var(--pink);box-shadow:0 0 0 3px rgba(255,99,171,.1)}.profile-name-field small{text-align:right;color:var(--muted);font-size:9px}.profile-editor .full{margin-top:8px}.profile-editor .form-error{min-height:16px;margin:7px 2px 0;text-align:center}@keyframes profileEditorIn{from{opacity:0;transform:translate(-50%,-46%) scale(.95)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}


/* ===== v103 — compact, full-height mobile chat ===== */
.chat-back-btn{display:none;width:42px;height:42px;padding:0;border:0;border-radius:50%;background:var(--pink-soft);color:var(--brand);place-items:center;flex:none}.chat-back-btn svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:520px){body.chat-active{overflow:hidden}body.chat-active .app-shell{height:100dvh;min-height:0;padding:calc(8px + var(--safe-top)) 10px calc(8px + var(--safe-bottom));overflow:hidden}body.chat-active .topbar,body.chat-active .bottom-nav{display:none!important}body.chat-active #chatView{display:grid;grid-template-rows:auto auto auto auto minmax(0,1fr) auto;height:100%;padding:0;overflow:hidden}.chat-active .chat-topbar{position:relative;top:auto;grid-template-columns:auto auto minmax(0,1fr) auto;margin:0 0 7px;padding:7px 8px;border-radius:20px}.chat-active .chat-back-btn{display:grid}.chat-active .chat-partner-avatar{width:43px;height:43px;border-radius:50%}.chat-active .chat-partner-copy strong{font-size:17px}.chat-active .chat-more-btn{width:42px;height:42px}.chat-active .chat-messages{width:100%;height:auto;min-height:0;border-radius:20px;padding:12px 8px 18px}.chat-active .chat-composer{position:relative;bottom:auto;margin-top:7px;padding:5px;border-radius:22px}.chat-active .chat-search-bar,.chat-active .chat-offline-notice{margin-bottom:7px}}


/* ===== v104 — keep the mobile composer inside the visible viewport ===== */
@media(max-width:520px){body.chat-active #chatView{position:fixed;z-index:60;top:var(--chat-viewport-top,0px);bottom:auto;left:50%;width:min(100%,620px);height:var(--chat-viewport-height,100dvh);padding:calc(8px + var(--safe-top)) 10px calc(8px + var(--safe-bottom));transform:translateX(-50%);background:var(--bg)}body.chat-active #chatMessages{height:auto!important;min-height:0!important;overflow-y:auto}body.chat-active #chatForm{position:relative!important;inset:auto!important;flex:none;min-height:56px}}



/* ===== v105 — optional per-device large chat text ===== */
body.chat-large-text .chat-bubble{max-width:min(91%,560px)}body.chat-large-text .chat-bubble p{font-size:20px;line-height:1.65;overflow-wrap:anywhere;word-break:break-word}body.chat-large-text .chat-bubble footer{font-size:11px}body.chat-large-text .chat-replied span{max-width:100%;font-size:14px}body.chat-large-text .chat-replied small{font-size:11px}body.chat-large-text .chat-message-reactions span{font-size:17px}body.chat-large-text .chat-input-count{font-size:10px}body.chat-large-text #chatInput{font-size:18px;line-height:1.5}
@media(max-width:380px){body.chat-large-text .chat-bubble{max-width:94%}body.chat-large-text .chat-bubble p{font-size:19px}}

/* ===== v106 — respect iPhone Dynamic Type without breaking chat layout ===== */
@supports (font: -apple-system-body){@media(hover:none){html{font:-apple-system-body;-webkit-text-size-adjust:auto;text-size-adjust:auto}.chat-bubble p{font-size:.9375rem;line-height:1.55}.chat-bubble footer{font-size:.5625rem}.chat-partner-copy strong{font-size:1.0625rem}.chat-partner-copy small{font-size:.6875rem}.chat-more-menu button{font-size:.8125rem}.chat-compose-row textarea{font-size:1rem}.chat-replied span{font-size:.6875rem}.chat-replied small{font-size:.5625rem}body.chat-large-text .chat-bubble p{font-size:1.25rem;line-height:1.65}body.chat-large-text .chat-bubble footer{font-size:.6875rem}body.chat-large-text .chat-replied span{font-size:.875rem}body.chat-large-text .chat-replied small{font-size:.6875rem}body.chat-large-text #chatInput{font-size:1.125rem}}}


/* ===== v107 — owner-only storage and error monitoring ===== */
.admin-diagnostics{margin-top:28px}.monitor-heading{align-items:center;margin-bottom:12px}.monitor-heading h3{margin:2px 0;color:var(--brand-dark);font-size:22px}.monitor-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.monitor-card{min-width:0;padding:17px;border:1px solid rgba(206,151,190,.3);border-radius:23px;background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(255,243,250,.92));box-shadow:0 12px 30px rgba(91,43,83,.08)}.monitor-card-head{display:flex;align-items:center;gap:10px}.monitor-card-head>span{display:grid;place-items:center;width:39px;height:39px;border-radius:13px;background:var(--pink-soft);font-size:20px}.monitor-card-head small{display:block;color:var(--muted);font-size:9px;font-weight:900;letter-spacing:.09em}.monitor-card-head h4{margin:1px 0;color:var(--brand-dark);font-size:17px}.monitor-value{display:block;margin-top:17px;color:var(--text);font-size:24px;line-height:1.1}.monitor-subvalue{display:block;min-height:17px;margin-top:5px;color:var(--muted);font-size:11px}.monitor-meter{height:8px;margin:13px 0 15px;overflow:hidden;border-radius:99px;background:#eaddea}.monitor-meter span{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--pink),#9b69d1);transition:width .3s ease}.monitor-stats{display:grid;gap:7px;margin:0}.monitor-stats div{display:flex;justify-content:space-between;gap:10px;padding-top:7px;border-top:1px solid var(--line)}.monitor-stats dt{color:var(--muted);font-size:11px}.monitor-stats dd{margin:0;color:var(--text);font-size:11px;font-weight:850;text-align:right}.monitor-note{margin:13px 0 0;color:var(--muted);font-size:10px;line-height:1.45}.monitor-error-list{display:grid;gap:7px;max-height:226px;margin-top:13px;overflow:auto}.monitor-error-list.empty{display:block;padding:13px;border-radius:14px;background:#f7f3f7;color:var(--muted);font-size:11px;text-align:center}.monitor-error-item{padding:10px;border-radius:14px;background:#fff;border:1px solid var(--line)}.monitor-error-item strong{display:block;color:#9b356d;font-size:11px}.monitor-error-item p{margin:4px 0;color:var(--text);font-size:11px;line-height:1.4;overflow-wrap:anywhere}.monitor-error-item small{color:var(--muted);font-size:9px}.monitor-clear{margin-top:12px}.admin-diagnostics.hidden{display:none!important}@media(max-width:620px){.monitor-grid{grid-template-columns:1fr}}


.storage-quota-warning{margin:-4px 0 14px;padding:10px 11px;border-radius:13px;background:#fff3d6;color:#805100;font-size:11px;font-weight:800;line-height:1.4}.storage-quota-warning[data-level="warning"]{background:#ffe7cf;color:#8b3f00}.storage-quota-warning[data-level="critical"]{background:#ffe1e7;color:#a01d43}.storage-quota-warning.hidden{display:none!important}


/* ===== v109 — romantic owner monitor dashboard ===== */
.monitor-heading{padding:0 3px}.monitor-heading .eyebrow{display:inline-flex;padding:5px 9px;border-radius:99px;background:linear-gradient(90deg,#ffe3f1,#eee2ff);color:#ad427d}.storage-monitor-card{position:relative;overflow:hidden;padding:20px;background:radial-gradient(circle at 100% 0,rgba(230,200,255,.62),transparent 36%),radial-gradient(circle at 0 100%,rgba(255,208,230,.5),transparent 38%),linear-gradient(145deg,#fff,#fff7fc)}.storage-monitor-card::before{content:'♡';position:absolute;right:16px;top:72px;color:rgba(203,100,160,.13);font-size:72px;line-height:1;pointer-events:none}.storage-monitor-card .monitor-card-head{position:relative;z-index:1}.storage-monitor-card .monitor-card-head>span{background:linear-gradient(145deg,#fff,#f4deff);box-shadow:0 8px 20px rgba(133,69,143,.13)}.storage-status-badge{margin-left:auto;padding:6px 9px;border-radius:99px;background:#e3f8ed;color:#277553;font-size:10px}.storage-status-badge[data-level="notice"]{background:#fff3d6;color:#805100}.storage-status-badge[data-level="warning"]{background:#ffe7cf;color:#8b3f00}.storage-status-badge[data-level="critical"]{background:#ffe1e7;color:#a01d43}.storage-hero{position:relative;display:flex;align-items:center;gap:17px;margin:19px 0 15px}.storage-ring{--storage-percent:0;display:grid;flex:none;place-items:center;width:105px;height:105px;border-radius:50%;background:conic-gradient(#e754a1 calc(var(--storage-percent)*1%),#9b6bd5 calc(var(--storage-percent)*1%),#eee7f0 0);box-shadow:0 10px 28px rgba(121,66,128,.15)}.storage-ring::before{content:'';grid-area:1/1;width:82px;height:82px;border-radius:50%;background:rgba(255,255,255,.96);box-shadow:inset 0 0 0 1px rgba(180,120,160,.1)}.storage-ring>div{z-index:1;grid-area:1/1;display:grid;text-align:center}.storage-ring strong{color:var(--brand-dark);font-size:23px;line-height:1}.storage-ring small{margin-top:4px;color:var(--muted);font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.storage-hero-copy{display:grid;min-width:0;gap:4px}.storage-hero-copy .monitor-value{margin:0;font-size:22px}.storage-hero-copy .monitor-subvalue{min-height:0;margin:0}.storage-hero-copy>span{margin-top:5px;color:#a1487b;font-size:11px;font-weight:800}.storage-monitor-card>.monitor-meter{height:6px;margin:0 0 14px;background:rgba(154,111,155,.12)}.storage-mini-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.storage-mini{display:grid;gap:3px;min-width:0;padding:12px 9px;border:1px solid rgba(255,255,255,.85);border-radius:17px;background:rgba(255,255,255,.72);box-shadow:0 7px 20px rgba(90,43,82,.06)}.storage-mini>span{font-size:20px}.storage-mini small{color:var(--muted);font-size:9px;font-weight:800}.storage-mini strong{color:var(--text);font-size:11px;overflow-wrap:anywhere}.storage-mini.photo{background:linear-gradient(145deg,rgba(255,255,255,.9),rgba(255,227,241,.75))}.storage-mini.voice{background:linear-gradient(145deg,rgba(255,255,255,.9),rgba(238,226,255,.82))}.storage-mini.message{background:linear-gradient(145deg,rgba(255,255,255,.9),rgba(226,242,255,.8))}.storage-people{display:grid;gap:10px;margin-top:16px;padding:14px;border-radius:18px;background:rgba(255,255,255,.7);border:1px solid rgba(221,180,207,.28)}.storage-people>p{display:grid;margin:0}.storage-people>p strong{color:var(--brand-dark);font-size:12px}.storage-people>p small{color:var(--muted);font-size:9px}.storage-person{display:grid;grid-template-columns:auto 1fr;gap:4px 8px;align-items:center}.storage-person span{color:var(--text);font-size:11px;font-weight:800}.storage-person b{color:var(--muted);font-size:9px;text-align:right}.storage-person i{grid-column:1/-1;height:7px;overflow:hidden;border-radius:99px;background:#f1e8ef}.storage-person em{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#ee67aa,#ff9dc8);transition:width .45s ease}.storage-person.partner em{background:linear-gradient(90deg,#936bd3,#c7a0ed)}.storage-queue-row{display:flex;justify-content:space-between;margin-top:10px;padding:10px 12px;border-radius:14px;background:rgba(255,255,255,.58);color:var(--muted);font-size:10px}.storage-queue-row strong{color:var(--text)}@media(max-width:390px){.storage-monitor-card{padding:16px}.storage-ring{width:91px;height:91px}.storage-ring::before{width:70px;height:70px}.storage-ring strong{font-size:20px}.storage-hero{gap:12px}.storage-hero-copy .monitor-value{font-size:18px}.storage-mini-grid{gap:5px}.storage-mini{padding:10px 7px}}