:root { --ink:#213b48; --dark:#184c64; --soft:#69808b; --line:#e7ebed; --bg:#fffaf7; --white:#fff; --blue:#e5f4ff; --pink:#fff0f1; --green:#eff8e9; --yellow:#fff5df; --lav:#f2edff; --shadow:0 8px 30px rgba(58,70,71,.055); --bb-h:64px; }
* { box-sizing:border-box; }
html {scroll-behavior:smooth; -webkit-text-size-adjust:100%;}
body {margin:0; background:var(--bg); color:var(--ink); font-family:ui-rounded,"Avenir Next",Avenir,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; line-height:1.4; overscroll-behavior-y:none;}
button,input,textarea {font:inherit;}
button {cursor:pointer; -webkit-tap-highlight-color:transparent; touch-action:manipulation;}
button:focus-visible,input:focus-visible,textarea:focus-visible {outline:3px solid #62aed8;outline-offset:3px;}
[hidden] {display:none!important;}

.shell {max-width:1050px;margin:0 auto;padding:22px 22px 70px;}
.hero {min-height:168px;display:flex;align-items:center;position:relative;background:linear-gradient(108deg,#fffaf4,#eaf7ff 61%,#f0f7e8);border:1px solid #e5ecec;border-radius:28px;overflow:hidden;padding:21px 26px 21px 210px;box-shadow:var(--shadow);}
.mascot {position:absolute;left:11px;bottom:-10px;width:192px;height:auto;filter:drop-shadow(0 4px 1px rgba(88,65,39,.05));}
.eyebrow {text-transform:uppercase;letter-spacing:.16em;font-size:.71rem;font-weight:850;color:#64808f;margin-bottom:4px;}
.hero h1 {color:#195773;font-weight:900;font-size:clamp(2rem,4.7vw,3.6rem);line-height:1.05;margin:0;letter-spacing:-.045em;}
.hero p {margin:9px 0 0;color:#435d69;font-size:1rem;font-weight:650;}
.iconbtn {border:1px solid #e1e8ea;background:#fff;border-radius:12px;min-width:44px;min-height:44px;font-size:1.2rem;}
.settings-btn {position:absolute;right:16px;top:14px;}

.topbar {display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:18px 0 17px;}
.tabs {display:flex;gap:5px;border:1px solid #ece9e7;border-radius:17px;padding:5px;background:#fff;box-shadow:var(--shadow);}
.tab {border:0;background:transparent;color:#647681;font-weight:850;padding:12px 21px;min-height:46px;border-radius:12px;}
.tab[aria-selected="true"] {background:#1e627c;color:white;box-shadow:0 3px 12px #1e627c20;}
.saved {display:inline-flex;align-items:center;gap:7px;font-size:.83rem;color:#658176;font-weight:700;min-height:35px;}
.saved.error {color:#b54444;}
.saved.pending {color:#9b6630;}
.dot {display:inline-block;background:#65ab80;width:8px;height:8px;border-radius:50%;}
.saved.error .dot {background:#cc5a5a;}
.saved.pending .dot {background:#e0a24a;}

.card {background:white;border:1px solid #eeeae7;border-radius:24px;padding:23px 25px;box-shadow:var(--shadow);margin:16px 0;}
.daycard {display:flex;align-items:center;justify-content:space-between;gap:22px;background:linear-gradient(115deg,#e8f5ff,#f3f9ff);border-color:#d4e9f7;}
.fieldtitle {font-weight:900;color:#22566f;font-size:.85rem;text-transform:uppercase;letter-spacing:.09em;margin-bottom:4px;}
.prettydate {font-size:clamp(1.25rem,2.4vw,1.7rem);font-weight:900;letter-spacing:-.02em;text-transform:capitalize;}
.date-controls {display:flex;align-items:center;gap:7px;flex-wrap:wrap;}
.date-controls input {width:155px;padding:12px 10px;border:1px solid #c6dce8;border-radius:12px;background:#fff;color:#214957;min-height:46px;font-size:16px;}
.mini {min-width:45px;min-height:46px;border-radius:12px;border:1px solid #cbdfe9;background:#fff;color:#26627b;font-size:1.1rem;font-weight:900;}
.today {border:1px solid #2c708a;background:#2c708a;color:#fff;font-size:.86rem;padding:0 13px;}

.section-title {display:flex;align-items:center;gap:11px;font-size:1.16rem;font-weight:900;letter-spacing:-.015em;margin:28px 0 12px;}
.section-title .sticon {width:39px;height:39px;border-radius:13px;display:grid;place-items:center;font-size:1.4rem;}
.sticon.blue{background:#ddf1ff}.sticon.pink{background:#ffe7eb}.sticon.green{background:#e8f6df}.sticon.lav{background:#f0e9ff}
.metrics {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;}
.metric {border-radius:21px;padding:19px 18px;border:1px solid transparent;min-width:0;}
.metric.blue {background:#e7f5ff;border-color:#d5eaf6}.metric.green{background:#ecf7e5;border-color:#daecd2}.metric.yellow{background:#fff4db;border-color:#f7e7c0}
.metric-header {display:flex;align-items:center;gap:8px;margin-bottom:14px;font-weight:850;font-size:1rem;}
.metric-header .emoji {font-size:1.75rem;line-height:1}
.value-row {display:flex;align-items:center;gap:8px;}
.number {width:100%;min-width:0;background:#fff;border:1px solid #d5dadd;padding:11px 13px;border-radius:12px;color:#193d50;font-size:1.35rem;font-weight:850;height:50px;}
.unit {font-size:.95rem;font-weight:800;color:#536a71;}
.small-note {font-size:.8rem;color:#47655e;margin-top:11px;font-weight:700;}
.stepbuttons {display:flex;flex-wrap:wrap;gap:6px;margin-top:11px;}
.chip {border:1px solid #bfdad5;background:#fff;border-radius:10px;min-height:40px;padding:6px 10px;font-size:.82rem;font-weight:800;color:#2b6670;}
.stepper {display:flex;align-items:center;gap:7px;}
.stepper .number {text-align:center;max-width:110px;}
.stepper button {min-width:45px;height:49px;border:1px solid #edcc8c;border-radius:12px;background:white;font-weight:900;font-size:1.3rem;color:#725b27;}

.meals {display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;}
.meal {border:1px solid #f3dddf;background:#fff7f7;border-radius:19px;padding:14px 12px;min-width:0;display:flex;flex-direction:column;align-items:stretch;}
.meal-emoji {font-size:2.5rem;text-align:center;margin:2px 0 7px;line-height:1.25;}
.checklabel {display:flex;align-items:center;gap:9px;font-weight:820;cursor:pointer;min-height:46px;}
.meal .checklabel {justify-content:center;font-size:.91rem;}
input[type="checkbox"] {appearance:none;-webkit-appearance:none;min-width:23px;width:23px;height:23px;border:2px solid #9aadb1;background:white;border-radius:7px;position:relative;margin:0;cursor:pointer;}
input[type="checkbox"]:checked {background:#347e8f;border-color:#347e8f;}
input[type="checkbox"]:checked::after {content:"";position:absolute;width:11px;height:6px;border:solid white;border-width:0 0 2px 2px;left:4px;top:5px;transform:rotate(-45deg);}
.meals .note-label {margin-top:12px;}
.note-label {display:block;color:#61747a;font-size:.76rem;font-weight:770;margin-bottom:5px;}
.small-textarea,.big-textarea,.short-input {border:1px solid #e0e0de;background:#fff;padding:11px;border-radius:10px;width:100%;color:#233a43;resize:vertical;font-size:16px;}
.small-textarea {min-height:72px;}
.big-textarea {min-height:144px;font-size:1rem;line-height:1.55;}

.incident-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px;}
.incident {padding:20px;border-radius:21px;border:1px solid #f2dada;background:linear-gradient(130deg,#ffeded,#fffafa);}
.incident.poop {background:linear-gradient(125deg,#fff4db,#fffaf0);border-color:#f2e5bd;}
.incident .head {display:flex;align-items:center;gap:10px;font-size:1.12rem;font-weight:900;margin-bottom:14px;}
.incident .head span {font-size:2.1rem;}
.incident .checklabel {font-size:1rem;margin-bottom:11px;}
.energy-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;}
.energy-option {display:block;cursor:pointer;position:relative;}
.energy-option input {position:absolute;opacity:0;width:1px;height:1px;}
.energy-option span {display:flex;gap:7px;align-items:center;justify-content:center;text-align:center;background:#f0f8ed;border:1.5px solid #dcead8;border-radius:14px;padding:15px 9px;min-height:73px;font-weight:780;font-size:.92rem;}
.energy-option input:checked+span {border-color:#69a577;background:#ddf3df;box-shadow:inset 0 0 0 1px #69a577;color:#235d3f;}
.energy-option input:focus-visible+span {outline:3px solid #69a577;outline-offset:2px;}
.symptoms {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:22px;row-gap:2px;}
.symptoms .checklabel {border-bottom:1px dashed #eff0ef;font-weight:700;padding:6px 3px;font-size:.98rem;}
.extras {display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-top:17px;}
.extras label {display:block;font-size:.84rem;color:#516c73;font-weight:780;margin-bottom:7px;}
.short-input {height:46px;}

.actions {display:flex;align-items:center;gap:11px;flex-wrap:wrap;margin:21px 0;}
.btn {display:inline-flex;justify-content:center;align-items:center;gap:8px;padding:12px 17px;min-height:48px;border-radius:13px;border:1px solid #d4dfe0;background:white;color:#315e6a;font-weight:840;text-align:center;}
.btn-primary {background:#21657e;color:white;border-color:#21657e;box-shadow:0 3px 12px #21657e1c;}
.btn-danger {color:#a24146;border-color:#efd5d5;}
.btn-block {width:100%;}
.btn:disabled {opacity:.6;cursor:default;}
.privacy {font-size:.8rem;color:#617779;line-height:1.58;padding:12px 1px;}
.privacy strong {color:#385966;}

.history-heading {font-size:1.35rem;font-weight:900;margin:0 0 5px;}
.muted {color:#698087;font-size:.91rem;}
.history-summary {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0;}
.summary {background:#eef6fa;border:1px solid #e2edf0;border-radius:16px;padding:16px;}
.summary:nth-child(2) {background:#f1f8ec;border-color:#e3eddc;}
.summary:nth-child(3) {background:#fff4eb;border-color:#f2e8db;}
.summary .k {color:#688089;font-size:.78rem;font-weight:760;margin-bottom:7px;}
.summary .v {font-size:1.5rem;color:#245b6e;font-weight:900;letter-spacing:-.025em;}
.calendar-top {display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:18px;}
.calendar-top h3 {margin:0;text-transform:capitalize;font-size:1.2rem;}
.calendar-nav {display:flex;gap:8px;}
.calendar-grid {display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;}
.weekday {text-align:center;font-size:.79rem;font-weight:850;color:#8a979f;padding:4px 0 9px;}
.cal-day {border:1px solid #eceeef;border-radius:12px;background:white;min-height:52px;position:relative;color:#45616f;font-weight:800;}
.cal-day.recorded {background:#e9f7ed;border-color:#c2e4cc;color:#266444;}
.cal-day.today-border {box-shadow:inset 0 0 0 2px #85b7d1;}
.cal-day.selected {background:#256b82;color:white;border-color:#256b82;}
.cal-day .point {position:absolute;bottom:5px;left:calc(50% - 2px);height:5px;width:5px;background:#4d9f6e;border-radius:50%;}
.cal-day.selected .point {background:white;}
.cal-placeholder {min-height:52px;}
.history-list {display:grid;gap:9px;}
.history-row {display:flex;align-items:center;justify-content:space-between;gap:14px;text-align:left;border:1px solid #e8ebec;border-radius:15px;background:#fff;padding:15px 18px;min-height:78px;width:100%;}
.history-row .date {font-weight:880;color:#244f62;font-size:1rem;}
.history-row .facts {margin-top:5px;color:#627c82;font-size:.83rem;line-height:1.45;}
.history-row .arrow {font-size:1.4rem;color:#6e9bb0;}
.empty {padding:28px;text-align:center;background:#f7fbfc;border:1px dashed #d6e7ea;border-radius:16px;color:#66808b;}
.chart-wrap {overflow-x:auto;}
.chart-wrap svg {width:100%;height:auto;min-width:300px;display:block;}
.backup {background:linear-gradient(115deg,#f3efff,#fffbff);border-color:#e6ddf6;}
.backup-actions {display:flex;gap:9px;flex-wrap:wrap;margin:17px 0 0;}
.hint {font-size:.79rem;color:#68717e;margin:10px 0 0;line-height:1.55;}
#backupWarning {color:#9b6630;font-weight:770;}
.toast {position:fixed;bottom:calc(18px + env(safe-area-inset-bottom, 0px));left:50%;transform:translateX(-50%);background:#224c62;color:#fff;box-shadow:0 6px 30px #25435644;padding:13px 21px;border-radius:14px;font-size:.9rem;z-index:100;width:max-content;max-width:calc(100vw - 30px);text-align:center;}
.toast.action {cursor:pointer;text-decoration:underline;}

/* ---- přihlášení ---- */
.login {min-height:100dvh;display:grid;place-items:center;padding:20px;padding-top:max(20px, env(safe-area-inset-top));}
.login-card {width:100%;max-width:400px;background:#fff;border:1px solid #eeeae7;border-radius:26px;padding:28px 24px;box-shadow:var(--shadow);text-align:center;}
.login-mascot {width:120px;height:auto;}
.login-card h1 {color:#195773;font-weight:900;font-size:2rem;margin:4px 0 6px;letter-spacing:-.04em;}
.login-card form {margin-top:18px;text-align:left;display:grid;gap:12px;}
.field span {display:block;font-size:.8rem;font-weight:800;color:#516c73;margin-bottom:5px;}
.field input {width:100%;border:1px solid #c6dce8;border-radius:12px;padding:12px;min-height:48px;font-size:16px;background:#fff;color:#214957;}
.login-error {background:#fff0f0;color:#a24146;border:1px solid #efd5d5;border-radius:10px;padding:10px;font-size:.88rem;font-weight:700;}
.login-card .hint {margin-top:16px;}
#offlineOnlyBtn {margin-top:8px;font-size:.88rem;min-height:42px;}

/* ---- spodní lišta ---- */
.bottombar {display:none;}

/* ---- nastavení (sheet) ---- */
.sheet-backdrop {position:fixed;inset:0;background:rgba(33,59,72,.35);z-index:200;display:flex;align-items:flex-end;justify-content:center;}
.sheet {width:100%;max-width:520px;background:#fff;border-radius:24px 24px 0 0;padding:12px 20px calc(20px + env(safe-area-inset-bottom,0px));box-shadow:0 -10px 40px rgba(0,0,0,.15);}
.sheet-handle {width:42px;height:5px;border-radius:3px;background:#d8dfe2;margin:0 auto 12px;}
.sheet h2 {margin:0 0 12px;font-size:1.25rem;}
.sheet-row {display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px dashed #eef0f1;font-size:.92rem;}
.sheet-row .k {color:#698087;font-weight:700;}
.sheet-row .v {font-weight:800;color:#244f62;text-align:right;word-break:break-word;}
.sheet-actions {display:grid;gap:8px;margin:16px 0 6px;}
#closeSheetBtn {margin-top:12px;}
@media(min-width:700px){.sheet-backdrop{align-items:center;}.sheet{border-radius:24px;}}

@media(max-width:800px){.meals{grid-template-columns:repeat(3,minmax(0,1fr));}.metrics{grid-template-columns:repeat(2,minmax(0,1fr));}.metric:last-child{grid-column:span 2;}.metric:last-child .value-row{max-width:280px}.incident-grid{gap:10px}}

/* ---- mobil ---- */
@media(max-width:600px){
  .shell{padding:10px 12px calc(var(--bb-h) + 24px + env(safe-area-inset-bottom,0px));}
  .hero{min-height:118px;padding:14px 48px 14px 112px;border-radius:20px;}
  .mascot{width:118px;left:-6px;bottom:-4px;}
  .hero h1{font-size:clamp(1.6rem,7.5vw,2.2rem)}.hero p{font-size:.8rem;line-height:1.3;margin-top:4px;}
  .eyebrow{font-size:.55rem;letter-spacing:.1em;}
  .settings-btn{right:10px;top:10px;min-width:40px;min-height:40px;}
  .topbar{margin:10px 0 4px;}.tabs{display:none;}.saved{padding-left:4px;min-height:22px;font-size:.78rem;}
  .card{padding:15px 14px;border-radius:19px;margin:11px 0;}
  .daycard{display:block;position:sticky;top:calc(6px + env(safe-area-inset-top,0px));z-index:20;backdrop-filter:saturate(1.2) blur(8px);background:rgba(236,246,255,.92);padding:12px 14px;}
  .daycard .fieldtitle{display:none;}
  .prettydate{font-size:1.05rem;}
  .date-controls{margin-top:8px;display:grid;grid-template-columns:46px 1fr 46px auto;gap:6px;}
  .date-controls input{width:auto;min-width:0;padding:10px 6px;}
  .metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;}.metric{padding:14px 11px;border-radius:17px;}.metric-header{font-size:.83rem;gap:4px;margin-bottom:10px;}.metric-header .emoji{font-size:1.35rem;}.metric .number{font-size:1.15rem;padding:10px 8px;}.metric:last-child{grid-column:span 2;}.metric:last-child .stepper{max-width:250px;}
  .section-title{margin:22px 1px 10px;font-size:1.05rem;}
  .meals{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}.meal{padding:12px 10px;}.meal-emoji{font-size:2rem;}.meal .checklabel{font-size:.86rem;}
  .incident-grid{grid-template-columns:1fr;gap:9px;}.incident{padding:15px;}.energy-grid{grid-template-columns:1fr;gap:7px;}.energy-option span{min-height:49px;justify-content:flex-start;padding:10px 14px;}
  .symptoms{column-gap:6px;}.symptoms .checklabel{font-size:.88rem;gap:7px;}.extras{grid-template-columns:1fr;gap:10px;}
  .actions{gap:8px;}.actions .btn{flex:1 1 45%;padding:12px 10px;}
  .history-summary{gap:7px;}.summary{padding:12px 9px;border-radius:12px;}.summary .k{font-size:.7rem;}.summary .v{font-size:1.2rem;}
  .cal-day{min-height:43px;border-radius:9px;}.cal-placeholder{min-height:43px;}
  .backup-actions .btn{flex:1 1 45%;}.history-row{padding:12px;}
  .bottombar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:150;height:calc(var(--bb-h) + env(safe-area-inset-bottom,0px));padding-bottom:env(safe-area-inset-bottom,0px);background:rgba(255,255,255,.96);backdrop-filter:blur(10px);border-top:1px solid #e7ebed;}
  .bb-item{flex:1;border:0;background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:.72rem;font-weight:800;color:#7a8b93;}
  .bb-item[aria-selected="true"]{color:#1e627c;}
  .bb-ico{font-size:1.35rem;line-height:1.1;}
  .toast{bottom:calc(var(--bb-h) + 14px + env(safe-area-inset-bottom,0px));}
}

@media print {
  body {background:#fff;-webkit-print-color-adjust:exact;print-color-adjust:exact;font-size:11px;}
  .shell{max-width:100%;padding:0 4px;}.hero{min-height:95px;box-shadow:none;padding-left:130px;}.mascot{width:115px;}.hero h1{font-size:29px;}
  .topbar,.actions,.privacy,#historyView,.date-controls,#toast,.backup,.bottombar,.settings-btn {display:none!important;}
  .card,.meal,.incident,.metric {box-shadow:none;break-inside:avoid;}
  .section-title{margin:10px 0 7px;}.card{padding:10px 13px;margin:8px 0;}.meals{grid-template-columns:repeat(5,1fr);}
  textarea {height:auto;min-height:40px!important;resize:none;}.big-textarea{min-height:65px!important;}
  .daycard{display:block;position:static;}
}
