/* TIMMY – styly webu podle návrhu na plátně (JYnYVQ11rRKqPbwfxbKH43). Písma: Atkinson Hyperlegible + Bricolage Grotesque. */
body{margin:0;background:#F6F6F3;color:#15171C;font-family:'Atkinson Hyperlegible',system-ui,sans-serif;font-size:15px;line-height:1.45}
a{color:#2747D0}a:hover{color:#1A3299}
h1,h2,h3{font-family:'Bricolage Grotesque',system-ui,sans-serif;margin:0;line-height:1.15}
button,input,select,textarea{font:inherit}

/* rozvržení rodiče */
.app{display:grid;grid-template-columns:232px minmax(0,1fr);min-height:100vh}
.side{background:#15171C;color:#E9EAEE;padding:24px 16px;display:flex;flex-direction:column;gap:4px}
.brand{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:26px;letter-spacing:.06em;color:#fff;padding:4px 12px 20px;text-decoration:none}
.nav{display:flex;align-items:center;min-height:44px;padding:0 12px;border-radius:10px;color:#C9CBD2;text-decoration:none;font-size:15px}
.nav:hover{background:#262931;color:#fff}
.nav.on{background:#2747D0;color:#fff;font-weight:700}
.kdo{padding:12px;border-top:1px solid #2E3139;font-size:14px;color:#C9CBD2}
.kdo button{background:none;border:0;padding:0;color:#9FB0F5;text-decoration:underline;cursor:pointer}
.main{padding:32px 40px 48px;display:flex;flex-direction:column;gap:24px;max-width:1080px;box-sizing:border-box;width:100%}
.hlava{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap}
.hlava>div:first-child{display:flex;flex-direction:column;gap:6px}
.hlava h1{font-size:34px}
.card{background:#fff;border:1px solid #E2E3E7;border-radius:14px;padding:20px;box-sizing:border-box}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 18px;border-radius:10px;border:1px solid #15171C;background:#15171C;color:#fff;font-weight:700;cursor:pointer;text-decoration:none}
.btn:hover{color:#fff;background:#2A2D35}
.btn2{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 16px;border-radius:10px;border:1px solid #CDD0D6;background:#fff;color:#15171C;font-weight:700;cursor:pointer;text-decoration:none}
.btn2:hover{color:#15171C;border-color:#9AA0AA}
.btn2.mala{min-height:36px;padding:0 12px;font-size:14px}
.chip{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;background:#EAEEFC;color:#1E3AA8;font-size:13px;font-weight:700;white-space:nowrap}
.chip.ok{background:#E5F3EB;color:#1A6B40}
.chip.warn{background:#FDF1E6;color:#8F4508}
.chip.err{background:#FBE9E9;color:#9B1C1C}
.muted{color:#5A5F6B}
.lbl{font-size:12px;font-weight:700;color:#5A5F6B;text-transform:uppercase;letter-spacing:.08em}
.row{display:flex;align-items:center;gap:12px}
.tab{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:10px;border:1px solid #CDD0D6;background:#fff;font-weight:700;color:#15171C;text-decoration:none}
.tab.on{border-color:#15171C;box-shadow:inset 0 0 0 1px #15171C}
.in{min-height:44px;border:1px solid #CDD0D6;border-radius:10px;padding:0 12px;background:#fff;box-sizing:border-box;width:100%}
.in.mala{min-height:40px;border-radius:8px;padding:0 10px}
.in.chybi{border-color:#C9731F}
.pole{display:flex;flex-direction:column;gap:4px}
.pole>span{font-size:13px;color:#5A5F6B}
.zprava{background:#E5F3EB;border:1px solid #BFE0CC;color:#1A6B40;border-radius:12px;padding:12px 16px;font-weight:700}
.chyba{background:#FBE9E9;border:1px solid #F0C4C4;color:#9B1C1C;border-radius:12px;padding:12px 16px;font-weight:700}
.upozorneni{display:flex;gap:16px;align-items:flex-start;background:#FDF1E6;border-color:#F3D9BF}
.eink{image-rendering:pixelated;border:8px solid #2A2C31;border-radius:12px;background:#fff;display:block;box-sizing:content-box}
.eink.s{border-width:6px;border-radius:10px;width:200px;height:200px}
.eink.xs{border-width:5px;border-radius:8px;width:140px;height:140px}
table{border-collapse:collapse;width:100%}
th{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:#5A5F6B;text-align:left;padding:8px 10px;border-bottom:1px solid #E2E3E7}
td{padding:6px 10px;border-bottom:1px solid #EEEFF2;vertical-align:middle}
.skryte{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* přepínač (checkbox) */
.sw{appearance:none;-webkit-appearance:none;display:inline-block;width:40px;height:24px;border-radius:999px;background:#CDD0D6;position:relative;flex-shrink:0;margin:0;cursor:pointer;vertical-align:middle}
.sw::after{content:'';position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:left .15s}
.sw:checked{background:#2747D0}.sw:checked::after{left:19px}
.sw:focus-visible{outline:3px solid #9FB0F5;outline-offset:2px}

/* R1 přehled: časová osa dne */
.tl{display:grid;grid-template-columns:64px 14px minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid #EEEFF2}
.tl:last-child{border-bottom:0}
.tl.ted{background:#F3F5FE;margin:0 -20px;padding:10px 20px}
.dot{width:12px;height:12px;border-radius:50%;border:2px solid #2747D0;box-sizing:border-box}
.dot.done{background:#2747D0}
.dot.now{background:#fff;box-shadow:0 0 0 4px #EAEEFC}
.cisla{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.cisla .v{font-size:22px;font-weight:700}

/* R2 rozvrh */
.grid{display:grid;grid-template-columns:56px repeat(10,minmax(0,1fr));gap:6px}
.hd{font-size:12px;color:#5A5F6B;text-align:center;padding:6px 0;line-height:1.3}
.hd b{display:block;font-size:15px;color:#15171C}
.day{display:flex;flex-direction:column;justify-content:center;align-items:center;background:#15171C;color:#fff;border-radius:10px;font-weight:700;font-size:15px;min-height:64px}
.day span{font-weight:400;font-size:12px;color:#C9CBD2}
.cell{min-height:64px;border:1px dashed #DADCE1;border-radius:10px;display:flex;flex-direction:column;gap:4px;padding:4px;box-sizing:border-box}
.cell select{flex-grow:1;border:0;border-radius:8px;background:#EAEEFC;color:#15171C;font-weight:700;font-size:15px;text-align:center;text-align-last:center;cursor:pointer;min-height:28px;appearance:none;-webkit-appearance:none;padding:0 2px}
.cell select.prazdne{background:transparent;color:#9FA4AE;font-weight:400}
.cell select.alt{background:#fff;border:1px dashed #9AA3BF;color:#5A5F6B}
.cell label{display:flex;align-items:center;justify-content:center;gap:4px;font-size:11px;color:#5A5F6B}

/* R3/R4 */
.item{display:grid;grid-template-columns:72px minmax(0,1fr) auto auto;gap:16px;align-items:center;padding:12px 0;border-bottom:1px solid #EEEFF2}
.item:last-of-type{border-bottom:0}
.time{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:22px}
.time input{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:20px;width:72px;min-height:40px;border:1px solid #CDD0D6;border-radius:8px;text-align:center;box-sizing:border-box}
.days{display:inline-flex;gap:3px}
.days label{position:relative}
.days input{position:absolute;opacity:0;width:1px;height:1px}
.days span{width:26px;height:26px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;background:#F0F1F4;color:#8A8F99;cursor:pointer}
.days input:checked+span{background:#15171C;color:#fff}
.days input:focus-visible+span{outline:3px solid #9FB0F5}
/* R4 kroužky: sbalené řádky (rozbalí se k úpravě) a panel „Nový kroužek“ */
.kr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 16px;align-items:start;padding:8px 16px;border:1px solid #E2E3E7;border-radius:12px;scroll-margin-top:24px}
.kr>.sw{margin-top:14px}
.kr.vyp .kr-kdy,.kr.vyp .kr-co b{color:#8A8F99}
.kr.pridany{border-color:#9FD0B2;background:#F5FBF7}
.kr-souhrn{display:grid;grid-template-columns:76px minmax(0,1fr) auto;gap:12px;align-items:center;min-height:36px;padding:4px 0}
.kr-kdy{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:17px;white-space:nowrap}
.kr-co{display:flex;flex-direction:column;gap:2px;min-width:0}
.kr-co>.muted{font-size:14px}
.kr-upravit{color:#2747D0;font-size:14px;font-weight:700;text-decoration:underline}
.kr-telo{display:flex;flex-direction:column;gap:12px;margin:8px 0;padding-top:12px;border-top:1px solid #EEEFF2}
details:not([open]) .otevreno,details[open] .zavreno{display:none}
.kr-novy{border:2px dashed #9AA3BF;border-radius:12px;background:#FBFBFE}
.kr-novy>summary{display:flex;align-items:center;gap:10px;min-height:52px;padding:0 16px;font-weight:700;color:#2747D0}
.kr-novy>summary:hover{background:#F3F5FE;border-radius:10px}
.kr-novy .plus{width:26px;height:26px;border-radius:50%;background:#2747D0;color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:20px;line-height:1;transition:transform .15s}
.kr-novy[open]{border-style:solid;border-color:#2747D0;background:#F3F5FE}
.kr-novy[open]>summary{font-family:'Bricolage Grotesque',sans-serif;font-size:18px;color:#15171C}
.kr-novy[open] .plus{transform:rotate(45deg);background:#5A5F6B}
.kr-novy .kr-telo{margin:0;padding:0 16px 16px;border-top:0}
.trojice{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.span2{grid-column:span 2}
.tyden{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}
.bd{border:1px solid #E2E3E7;border-radius:12px;padding:12px 10px;display:flex;flex-direction:column;gap:8px;align-items:center;text-align:center}
.bd input[type=text]{width:100%;text-align:center;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:20px;min-height:40px;border:1px solid #CDD0D6;border-radius:8px;box-sizing:border-box}
.bd.vyp{background:#F6F6F3}

/* R3 budík */
.dayrow{display:grid;grid-template-columns:150px 110px 1fr auto;gap:16px;align-items:center;padding:8px 0;border-bottom:1px solid #EEEFF2}
.dayrow:last-child{border-bottom:0}
.step{display:flex;flex-direction:column;gap:4px;padding:14px;border-radius:12px;background:#F6F6F3;flex:1}
.step b{font-size:18px}
.song{display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:center;padding:8px;border-radius:12px;border:1px solid #E2E3E7}
.song.vybrana{border-color:#2747D0;background:#F3F5FE}
.play{width:44px;height:44px;border-radius:50%;border:1px solid #CDD0D6;background:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;flex-shrink:0}
.play.hraje{background:#EAEEFC;border-color:#2747D0}
.play.ne{background:#F0F1F4;cursor:default}
input[type=range]{width:100%;accent-color:#2747D0}

/* R5 kalendář */
.cal{display:grid;grid-template-columns:40px repeat(7,minmax(0,1fr));gap:6px}
.cal .h{font-size:12px;font-weight:700;color:#5A5F6B;text-align:center;padding-bottom:4px}
.cal .w{font-size:12px;font-weight:700;color:#5A5F6B;display:flex;align-items:center;justify-content:center}
.cal .d{min-height:62px;border-radius:10px;background:#F3F5FE;padding:6px 8px;box-sizing:border-box;font-weight:700;display:flex;flex-direction:column;gap:2px}
.cal .d small{font-weight:400;font-size:11px;line-height:1.2;color:#5A5F6B}
.cal .d.we{background:#F0F1F4;color:#8A8F99}
.cal .d.off{background:#FDF1E6;color:#8F4508}
.cal .d.ex{box-shadow:inset 0 0 0 2px #2747D0}
.cal .d.x{background:transparent}
.cal .d.dnes{outline:2px solid #15171C;outline-offset:1px}
.li{display:grid;grid-template-columns:150px minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid #EEEFF2}
.li:last-of-type{border-bottom:0}
.vzorek{width:14px;height:14px;border-radius:4px;display:inline-block}

/* R6 písničky */
.knihovna .song{grid-template-columns:44px minmax(0,1fr) 90px 200px auto;gap:16px;padding:12px 0;border:0;border-radius:0;border-bottom:1px solid #EEEFF2}
.knihovna .song:last-child{border-bottom:0}
.knihovna .song>.chip{justify-self:start;white-space:normal}
.bar{height:10px;border-radius:999px;background:#E2E3E7;overflow:hidden}
.bar>div{height:100%;background:#2747D0}
.nahrat{display:flex;gap:24px;align-items:center;border:2px dashed #9AA3BF;background:#FBFBFE}
.nahrat.nad{border-color:#2747D0;background:#F3F5FE}

/* R7 moduly */
.st{display:grid;grid-template-columns:36px minmax(0,1fr);gap:14px;padding:14px 0;border-bottom:1px solid #EEEFF2}
.st:last-child{border-bottom:0}
.n{width:36px;height:36px;border-radius:50%;background:#15171C;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700}
.n.done{background:#1E7A4A}
.n.next{background:#fff;color:#15171C;border:2px solid #CDD0D6;box-sizing:border-box}
.log{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13px;background:#15171C;color:#C9F2D6;border-radius:10px;padding:12px 14px;line-height:1.6;white-space:pre-wrap;min-height:48px;max-height:200px;overflow:auto}

/* R8 rodina */
.person{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid #EEEFF2}
.av{width:44px;height:44px;border-radius:50%;background:#15171C;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-family:'Bricolage Grotesque',sans-serif;font-size:18px}
.slot{border:2px dashed #CDD0D6;border-radius:12px;padding:14px;display:flex;align-items:center;justify-content:space-between;gap:12px;color:#5A5F6B}
.perm{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid #EEEFF2}
.perm:last-child{border-bottom:0}
.qr{width:150px;height:150px;border-radius:10px;border:1px solid #E2E3E7;background:#fff;display:flex;align-items:center;justify-content:center;color:#8A8F99;font-size:13px;text-align:center}
.qr img{width:150px;height:150px;image-rendering:pixelated}
.odkazdite{display:flex;align-items:center;background:#F6F6F3;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13px;word-break:break-all;padding:10px 12px}
.cervene{color:#8F2A1A !important;border-color:#E8C3BC !important}
details>summary{cursor:pointer;list-style:none}
details>summary::-webkit-details-marker{display:none}
/* vstup (přihlášení): tmavé pozadí, bílé karty */
.vstup{background:#15171C;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:36px;padding:32px 16px;box-sizing:border-box}
.vstup .logo{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:44px;letter-spacing:.08em;color:#fff;text-align:center}
.vstup .pod{color:#C9CBD2;text-align:center}
.vcard{background:#fff;border-radius:18px;padding:32px;box-sizing:border-box;width:400px;max-width:100%;display:flex;flex-direction:column;gap:16px}
.vcard h1{font-size:26px}
.vcard .btn{min-height:48px;border-color:#2747D0;background:#2747D0}
.vcard .btn:hover{background:#1A3299}
.vcard .in{min-height:48px}
.vcard label{display:flex;flex-direction:column;gap:6px}
.vcard label>span{font-size:14px;color:#5A5F6B}
.vcard .pata{font-size:13px;border-top:1px solid #EEEFF2;padding-top:12px;color:#5A5F6B}
.kod{display:flex;gap:8px;justify-content:space-between}
.kod input{width:48px;height:58px;border:1px solid #CDD0D6;border-radius:10px;font-size:26px;text-align:center;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;box-sizing:border-box}
.zaskrt{display:flex !important;flex-direction:row !important;align-items:center;gap:10px;min-height:44px}
.zaskrt input{width:20px;height:20px}
.odkazbtn{background:none;border:0;padding:0;color:#2747D0;text-decoration:underline;cursor:pointer;font-size:14px;align-self:flex-start}


/* dítě (mobil): D0 tmavě, D1–D3 světle se spodní lištou */
body.dite{font-size:17px;line-height:1.4}
body.dite.tma{background:#15171C;color:#fff}
.dmain{max-width:480px;margin:0 auto;min-height:100vh;box-sizing:border-box;padding:24px 20px 100px;display:flex;flex-direction:column;gap:14px}
.tma .dmain{padding:36px 24px 32px;gap:22px}
.tma a{color:#FFD54A}
.tma h1{font-size:44px;line-height:1.05}
.dhlava{display:flex;justify-content:space-between;align-items:flex-end;padding-bottom:2px}
.dhlava h1{font-size:32px}
.dcas{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:22px}
.dlogo{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;letter-spacing:.08em;font-size:20px;color:#C9CBD2}
.dkrok{display:grid;grid-template-columns:36px minmax(0,1fr);gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid #2E3139}
.dkrok:last-child{border-bottom:0}
.dkrok .c{width:36px;height:36px;border-radius:50%;background:#FFD54A;color:#15171C;display:flex;align-items:center;justify-content:center;font-weight:700}
.dzluty{display:flex;align-items:center;justify-content:center;min-height:56px;border-radius:16px;background:#FFD54A;color:#15171C !important;font-weight:700;text-decoration:none;font-size:18px}
.dtmava{background:#15171C;color:#fff;border-radius:20px;padding:20px;display:flex;flex-direction:column;gap:6px}
.dtmava .z{font-size:13px;font-weight:700;letter-spacing:.08em;color:#FFD54A;text-transform:uppercase}
.dvelky{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:30px;line-height:1.1}
.dbila{background:#fff;border:1px solid #E2E3E7;border-radius:20px;padding:16px 20px;display:flex;flex-direction:column;gap:4px}
.dbila.seznam{padding:8px 20px}
.postup{height:8px;border-radius:999px;background:#33363F;margin-top:6px}
.postup>div{height:100%;border-radius:999px;background:#FFD54A}
.it{display:grid;grid-template-columns:64px minmax(0,1fr);gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid #EEEFF2}
.it:last-child{border-bottom:0}
.it b{font-family:'Bricolage Grotesque',sans-serif;font-size:18px}
.it.c3{grid-template-columns:28px 64px minmax(0,1fr);gap:8px;padding:8px 0}
.it.past{color:#9A9EA8}
.it.now{background:#FFF6D6;margin:0 -20px;padding:10px 20px}
.taska{background:#fff;border:2px solid #15171C;border-radius:20px;padding:14px 20px;display:flex;flex-direction:column}
.bag{display:grid;grid-template-columns:40px minmax(0,1fr);gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid #EEEFF2}
.bag:last-child{border-bottom:0}
.ic{width:40px;height:40px;border-radius:12px;background:#FFF6D6;display:flex;align-items:center;justify-content:center}
.dmodra{background:#EAEEFC;border-radius:20px;padding:14px 20px;display:flex;justify-content:space-between;align-items:center}
.tabs{position:fixed;left:0;right:0;bottom:0;height:76px;background:#fff;border-top:1px solid #E2E3E7;display:flex;justify-content:center}
.tabs nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;max-width:480px}
.t{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-decoration:none;color:#5A5F6B;font-size:13px;font-weight:700}
.t.on{color:#2747D0}
.dsong{display:grid;grid-template-columns:48px minmax(0,1fr) 28px;gap:12px;align-items:center;padding:10px 12px;border-radius:16px;border:1px solid #E2E3E7;background:#fff;min-height:68px;box-sizing:border-box;cursor:pointer}
.dsong:has(input:checked){border:2px solid #2747D0;background:#F3F5FE}
.dsong .play{width:48px;height:48px}
.dsong input{appearance:none;-webkit-appearance:none;width:24px;height:24px;border-radius:50%;border:2px solid #9AA3BF;box-sizing:border-box;margin:0;cursor:pointer}
.dsong input:checked{border:7px solid #2747D0}
.dsong input:focus-visible{outline:3px solid #9FB0F5}
@media (max-width:860px){
  .app{grid-template-columns:1fr}
  .side{flex-direction:row;flex-wrap:wrap;padding:12px}
  .brand{padding:4px 12px}
  .main{padding:20px 16px 40px}
  .grid{grid-template-columns:44px repeat(10,minmax(48px,1fr));overflow-x:auto}
  .trojice,.dva{grid-template-columns:1fr !important}
  .dayrow{grid-template-columns:1fr 100px auto}
  .dayrow .muted{display:none}
  .knihovna .song{grid-template-columns:44px minmax(0,1fr) auto}
  .knihovna .song>:nth-child(3),.knihovna .song>:nth-child(4){display:none}
}