@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Instrument+Serif:ital@0;1&display=swap');
:root{font-family:"DM Sans",system-ui,sans-serif;color:#142b46;background:#e8f5ff;--line:#d6e4ee;--muted:#48647e;--navy:#173755;--accent:#cae8fb}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 86% 13%,#f9fdff 0%,transparent 38%),radial-gradient(ellipse at 10% 44%,#c8e7fa 0%,transparent 44%),linear-gradient(145deg,#eaf7ff,#d7eefd 52%,#f4faff);background-attachment:fixed}header{background:#f7fcffda;border-bottom:1px solid #fff}.shell{width:min(1320px,calc(100% - 72px));margin:auto}.top{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:76px}.brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:19px;white-space:nowrap}.brand span{background:#173755;color:#fff;border-radius:13px;display:grid;place-items:center;width:41px;height:41px;font-size:13px;letter-spacing:.05em}a{color:inherit;text-decoration:none}nav{display:flex;gap:5px;flex-wrap:wrap}nav a{padding:9px 14px;border-radius:20px;font-weight:600;color:var(--muted)}nav a[aria-current]{background:#dceffc;color:var(--navy)}main{padding:28px 0 44px}.hero{position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:center;min-height:246px;padding:32px 42px;border:1px solid #fff;border-radius:28px;background:radial-gradient(ellipse at 84% 72%,#e9faff 6%,transparent 53%),linear-gradient(118deg,#f6fcff,#b4def8 95%);box-shadow:0 12px 48px #36719a14}.hero:before,.hero:after{content:"";position:absolute;z-index:-1;right:-13%;width:71%;height:110%;border-radius:50%;transform:rotate(-22deg);border:1px solid #ffffffb0;box-shadow:0 0 0 17px #ffffff20,0 0 0 34px #ffffff25,0 0 0 54px #ffffff20}.hero:before{top:18%}.hero:after{top:42%;right:-8%}.hero h1{font:400 clamp(54px,7vw,96px)/.88 "Instrument Serif",Georgia,serif;margin:0 0 16px;letter-spacing:-.025em}.hero p{margin:0;color:#365774;font-size:17px}.hero img{width:min(31%,270px);height:205px;object-fit:contain;margin-left:auto;mix-blend-mode:multiply}.panel{background:#ffffffeb;border:1px solid #fff;border-radius:23px;padding:24px;margin-top:20px;box-shadow:0 8px 30px #35648b0d}.head,.controls,.row,.actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.head,.row{justify-content:space-between}.head{margin-bottom:17px}.head h2,h3,p{margin-top:0}h2{font-size:24px;margin:0;letter-spacing:-.03em}h3{font-size:16px;margin-bottom:4px}p{line-height:1.5}.muted,small{color:var(--muted)}small{display:block;line-height:1.45}.calendar{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}.day{border:1px solid var(--line);border-radius:14px;min-height:148px;padding:10px;background:#f7fbff;display:flex;flex-direction:column;gap:8px}.day.today{background:#eaf6ff;border-color:#83b8dd}.day>button{align-self:flex-start;margin-top:auto}.session{border-radius:10px;background:#e3eff8;padding:8px;overflow-wrap:anywhere}.session.done{background:#deeee8}.session label{display:flex;gap:5px;align-items:start;font-size:13px;font-weight:700}.session small{margin:3px 0}.session button{padding:3px 0;background:none;border:0;font-size:12px;text-decoration:underline}.mix{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px}.animal{margin:0;text-align:center;background:#f4faff;border-radius:14px;padding:10px 5px}.animal img{width:100%;height:95px;object-fit:contain;mix-blend-mode:multiply}.animal strong{display:block;font-size:22px}.animal figcaption{font-size:13px}.row{padding:14px 0;border-top:1px solid var(--line);overflow-wrap:anywhere}.row p{margin:4px 0;white-space:pre-wrap}.row img{width:64px;height:64px;object-fit:cover;border-radius:9px}.row>div:first-child{min-width:0}.primary{background:var(--navy);color:white;border-color:var(--navy)}button,input,textarea,select{font:inherit;color:inherit}button{cursor:pointer;background:#f5faff;border:1px solid var(--line);border-radius:10px;padding:8px 12px;font-weight:600}button:hover{filter:brightness(.96)}:focus-visible{outline:3px solid #2776aa;outline-offset:3px}input:not([type=checkbox]),textarea,select{width:100%;border:1px solid #b8cfdf;background:#f9fcff;border-radius:9px;padding:9px}input[type=checkbox]{accent-color:#17634e;flex:none;width:16px;height:16px;margin:1px 2px 0 0}.controls input{width:auto}.field{display:grid;gap:5px;margin-bottom:13px;font-weight:600}.field small{font-weight:400}textarea{resize:vertical;min-height:95px}.fields,.macro-layout{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.macro-layout{grid-template-columns:auto 1fr;align-items:center;gap:25px}.ring{width:146px;height:146px;border-radius:50%;display:grid;place-items:center}.ring span{background:white;border-radius:50%;width:109px;height:109px;display:grid;place-items:center;text-align:center;font-size:13px}.macro{display:flex;gap:7px;align-items:center;margin:6px 0}.macro i{width:10px;height:10px;border-radius:50%}.macro strong{margin-left:auto}.meter{display:block;width:100%;height:12px;accent-color:#317ba9;margin:10px 0}.photo-preview{max-width:110px;max-height:110px;object-fit:cover;margin:8px 0;border-radius:10px}footer{padding:0 0 25px;color:var(--muted);font-size:13px;display:flex;justify-content:space-between;gap:8px}dialog{color:inherit;width:min(540px,calc(100% - 28px));max-height:90vh;border:1px solid var(--line);border-radius:21px;padding:22px}dialog::backdrop{background:#1129446b}#notice:not(:empty){position:fixed;bottom:16px;left:50%;transform:translateX(-50%);background:#173755;color:white;padding:10px 18px;border-radius:18px;z-index:5}
@media(max-width:1040px){.calendar{grid-template-columns:repeat(4,minmax(0,1fr))}}@media(max-width:680px){.shell{width:calc(100% - 26px)}.top{align-items:flex-start;flex-direction:column;gap:9px;padding:10px 0}.brand span{width:34px;height:34px}nav{gap:1px}nav a{padding:7px 9px;font-size:13px}main{padding-top:13px}.hero{min-height:172px;padding:20px 15px}.hero img{height:126px;width:32%}.hero p{font-size:14px}.panel{padding:14px;margin-top:13px}.calendar{grid-template-columns:repeat(2,minmax(0,1fr))}.mix{grid-template-columns:repeat(3,minmax(0,1fr))}.animal img{height:76px}.controls{font-size:13px}.controls button{padding:6px 9px}.macro-layout{gap:12px}.ring{width:104px;height:104px}.ring span{width:78px;height:78px}}
