/* Aktywnik+ fresh interface: progressive skin for existing local-first app. */
:root{--forest:#103824;--forest2:#19462e;--mint:#eff6e9;--lime:#b9f36f;--border:#dbe7d6;--muted:#5d7165;--shadow:0 8px 25px rgba(16,56,36,.08);font-family:Inter,"Segoe UI",system-ui,sans-serif;color:var(--forest);background:#f5f9f0}
body{background:#f5f9f0;color:var(--forest)}
.topbar{background:rgba(250,252,246,.97);color:var(--forest);border-bottom:1px solid #e1ebdb;box-shadow:0 2px 14px rgba(16,56,36,.025);padding:12px clamp(12px,3vw,32px);gap:16px;flex-wrap:wrap}
.topbar .brand{font-weight:850;font-size:1.18rem;letter-spacing:-.025em;font-family:Georgia,serif}
.topbar .brand-mark{display:inline-flex;align-items:center;justify-content:center;background:var(--forest);border-radius:50%;color:white;width:34px;height:34px;margin-right:6px;font-size:.7rem;letter-spacing:-.04em;font-family:system-ui}
.topbar .tagline{color:var(--muted);font-size:.7rem;margin-left:7px}
.topbar .version-badge,.topbar .local-session-badge{font-size:.68rem;color:#67806a}
.topbar .secure-actions{display:flex;flex-wrap:wrap;gap:7px;align-items:center}
.topbar .secure-actions .badge{background:transparent;color:#4a6855;font-size:.72rem;padding:3px 5px}
.topbar .language-switch{color:var(--forest);border-color:var(--border);min-height:36px}
.topbar .button-link,.topbar button{font-size:.78rem;border-radius:999px;min-height:36px;padding:7px 12px}
.topbar .install-mini{background:#eaf3e5;border-color:var(--border)}
#childViewTabs{display:flex;align-items:center;gap:4px;background:#ebf3e6;padding:5px;border-radius:100px;margin-left:auto}
#childViewTabs[hidden]{display:none}
#childViewTabs button{border:0;border-radius:100px;background:transparent;color:#557060;font-weight:750;font-size:.83rem;min-height:38px;padding:9px 15px;cursor:pointer;white-space:nowrap}
#childViewTabs button.active{background:#fff;color:var(--forest);box-shadow:0 2px 9px rgba(16,56,36,.10)}
#childViewTabs button:hover:not(.active){background:#e1eddb}
.nav-profile{display:inline-grid;place-items:center;min-width:35px;height:35px;border-radius:50%;background:#e2f2d4;color:var(--forest);font-weight:800;font-size:.85rem}
#logoutStatus:not(:empty){width:100%;font-size:.8rem;color:#21563a}
.shell{max-width:1020px;gap:12px;padding:22px clamp(12px,3vw,24px)}
.card{background:white;border:1px solid #eff2eb;border-radius:24px;box-shadow:var(--shadow);padding:clamp(16px,3vw,24px);margin-bottom:14px}
.card h1,.card h2,.card h3,.support-card h2{color:var(--forest);font-family:Georgia,"Times New Roman",serif;letter-spacing:-.025em}
.card h2{font-size:1.35rem}.card h1{font-size:clamp(1.7rem,5vw,2.3rem)}
.hero.card{background:#fff;min-height:125px}
.hero .metric{background:#eff6e9;color:var(--forest)}
.eyebrow{color:#688271;letter-spacing:.04em}
.section-head h2{font-size:1.3rem}
.primary,.timer-start,.button-link.primary{background:var(--forest);color:white;border-radius:999px;box-shadow:0 4px 14px rgba(16,56,36,.1)}
.primary:hover,.timer-start:hover{background:#1d5236;color:#fff}
.ghost,.button-link.ghost,.duration-presets button,.report-buttons button{background:#eff5e9;color:var(--forest);border:1px solid #dce9d6;border-radius:999px}
button:hover,.button-link:hover{filter:brightness(.98)}
#childPanel{max-width:820px;margin:auto}
.app-view[hidden],#familyDataCard[hidden]{display:none!important}
.screen-heading{font:700 1.6rem Georgia,serif;margin:7px 0 18px}
.activity-grid,.activity-grid.compact{display:flex;gap:7px;flex-wrap:wrap}
.activity{display:inline-flex;align-items:center;gap:5px;min-height:36px;border:1px solid var(--border);background:#f5f9f0;border-radius:999px;padding:9px 12px;text-align:left;font-size:.8rem;font-weight:720}
.activity .emoji{display:inline;margin:0;font-size:.99rem}
.activity:hover{background:#effcda;border-color:#a9d980}
.activity:focus-visible{outline:2px solid #265c3c}
input,select,textarea{border-color:#cddfcc;background:#fff;color:#183f2b;border-radius:13px}
.snapshot-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.snapshot-item,.stat,.report-summary>div{background:#f5f9f0;border:1px solid #e2ecd9;border-radius:18px}
.stat strong,.snapshot-item strong{color:#154027}
.overview-card{background:white;border:1px solid #e8eee4}
.timer-card{background:#eff8e7;border:1px solid #bddca7}
.timer-clock{font-family:Georgia,serif;font-variant-numeric:tabular-nums;letter-spacing:-.03em;color:var(--forest)}
#quickTimerCard .quick-timer-content{display:flex;align-items:center;justify-content:space-between;gap:22px}
#quickTimerCard .timer-clock{font-size:clamp(2.4rem,8vw,4rem);line-height:1.1}
.quick-timer-action{border:none;background:var(--forest);color:white;border-radius:50%;width:66px;height:66px;min-width:66px;font-size:1.4rem;cursor:pointer;box-shadow:0 8px 22px rgba(16,56,36,.18)}
.quick-timer-action:hover{background:#22533a}
.streak-card{background:linear-gradient(125deg,#194830,#0b3021);color:#f6fff3;border:0;box-shadow:0 12px 26px rgba(16,56,36,.16)}
.streak-title{display:flex;align-items:center;justify-content:space-between;gap:10px}
.streak-title h2{color:#fff;margin:0;font:700 clamp(1.1rem,3vw,1.55rem) Georgia,serif}
.streak-title h2 b{font-size:1.8em}
.streak-icon{font-size:1.8rem;padding:8px 12px;background:#ffffff13;border-radius:15px}
.streak-title p{margin:4px 0 0;font-size:.78rem;color:#e1eddd}
.streak-week-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin-top:18px}
.streak-day{display:grid;justify-items:center;gap:5px}
.streak-dot{display:grid;place-items:center;background:#ffffff26;color:#d7f9bf;border-radius:50%;width:38px;height:38px;font-weight:900}
.streak-day.current .streak-dot{outline:2px solid #b8ee75;outline-offset:2px}
.streak-day.done .streak-dot{background:#b6f56e;color:#123724}
.streak-day small{font-size:.73rem;color:#d7e8d5}
.streak-bottom{margin:18px 0 0;padding:9px 12px;background:#ffffff1a;border-radius:999px;color:#e7f3e5;font-size:.81rem}
.goal-period-buttons{display:flex;gap:7px;flex-wrap:wrap;margin:12px 0 18px}
.goal-period-buttons button{background:#f0f6e9;border:0;border-radius:999px;padding:8px 15px;min-height:37px;color:var(--forest);font-weight:750;cursor:pointer}
.goal-period-buttons button.active{background:var(--forest);color:#fff}
.goal-body{display:flex;gap:20px;align-items:center}
.goal-ring{--goal-progress:0%;height:120px;width:120px;border-radius:50%;background:conic-gradient(#84c64e var(--goal-progress),#eaf2e2 0);display:grid;place-items:center;flex:none}
.goal-ring-inner{height:94px;width:94px;border-radius:50%;background:#fff;display:grid;place-items:center;font:bold 1.45rem Georgia,serif;color:var(--forest)}
.goal-stats strong{font:700 2rem Georgia,serif;display:block}
.goal-stats small{color:var(--muted)}
.goal-form{display:flex;gap:8px;align-items:end;flex-wrap:wrap;margin-top:16px;padding-top:12px;border-top:1px solid #edf2e9}
.goal-form label{font-size:.83rem;font-weight:700}
.goal-form input{display:block;max-width:170px;margin-top:5px}
.goal-form button{min-height:44px}
.goal-note{color:#677c6c;display:block;margin-top:10px}
.danger{border-radius:999px}
#familyDataCard .cta a{display:inline-flex;margin:8px 6px 0 0}
@media(max-width:850px){
  .topbar{align-items:center}
  #childViewTabs{order:4;flex:1 0 100%;justify-content:center;margin:0;overflow-x:auto}
  #childViewTabs button{padding:9px 13px}
  .topbar .secure-actions{margin-left:auto}
  .topbar .tagline,.topbar .version-badge,.topbar .local-session-badge{display:none}
  .topbar .secure-actions #deviceChildBadge{display:none}
}
@media(max-width:540px){
  .topbar{gap:8px;padding:9px 10px}
  .topbar .secure-actions{gap:3px}
  .topbar .secure-actions #saveStatusBadge{display:none}
  .topbar .secure-actions #cloudSyncBadge{max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .topbar .secure-actions #parentAccessBtn{padding:7px 9px}
  .topbar .secure-actions #signOutBtn{padding:7px}
  #childViewTabs{gap:1px;padding:3px}
  #childViewTabs button{font-size:.74rem;padding:8px 10px;min-height:38px}
  #quickTimerCard .quick-timer-action{width:54px;height:54px;min-width:54px}
  .goal-body{gap:12px}
  .goal-ring{width:95px;height:95px}.goal-ring-inner{width:73px;height:73px;font-size:1.15rem}
  .streak-dot{width:29px;height:29px}
  .snapshot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hero.card{align-items:center}
  .card{border-radius:21px}
}
@media print{
  #childViewTabs,#streakCard,#goalPanel,#quickTimerCard,.goal-form{display:none!important}
  .app-view[hidden]{display:block!important}
}