:root{--navy:#071b35;--blue:#123f73;--red:#b11d2f;--gold:#d9b65d;--ink:#142033}*{box-sizing:border-box}body{margin:0;background:linear-gradient(135deg,#e8edf4,#fff 42%,#eee8dd);color:var(--ink);font:15px/1.5 Arial,sans-serif}header{padding:34px 20px 30px;text-align:center;color:#fff;background:linear-gradient(120deg,var(--navy),var(--blue));border-bottom:6px solid var(--red);box-shadow:0 3px 18px #0004}header h1{margin:4px 0;font:700 clamp(27px,4vw,46px) Georgia,serif;text-transform:uppercase}header p{margin:3px;color:#dce8f6;text-transform:uppercase;letter-spacing:.16em}.stars{color:var(--gold);font-size:19px;letter-spacing:.35em}main{width:min(1500px,96%);margin:30px auto}.narrow{width:min(760px,92%)}nav,.actions{display:flex;justify-content:flex-end;gap:18px;margin-bottom:14px}nav a{color:var(--blue);font-weight:bold}.legend,.reading{display:grid;grid-template-columns:180px 1.2fr 1.2fr 1fr;gap:18px;align-items:center}.legend{padding:0 18px 8px;color:#526274;font-size:12px;font-weight:bold;text-transform:uppercase}.reading,.panel,.alert,.empty{margin-bottom:12px;padding:18px;background:#fff;border-radius:7px;box-shadow:0 2px 10px #10233a18}.reading{border-left:6px solid var(--blue)}.reading time{font-weight:bold;color:var(--blue)}.reading b{display:block;font-size:11px;color:#657385;letter-spacing:.06em}.difference{color:var(--red);font-size:17px;font-weight:bold}.success{border-left:6px solid #24854b}.error{border-left:6px solid var(--red)}label{display:block;margin:17px 0;font-weight:bold}input,select{display:block;width:100%;margin-top:6px;padding:12px;border:1px solid #aab5c2;border-radius:5px;font:inherit}button,.button{display:inline-block;padding:12px 20px;border:0;border-radius:5px;background:var(--red);color:#fff;text-decoration:none;font-weight:bold;cursor:pointer}.secondary{background:var(--blue)}.small{padding:8px 13px;font-size:13px}.date-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}footer{text-align:center;padding:25px;color:#64707d;font-size:12px}@media(max-width:1000px){.legend{display:none}.reading{grid-template-columns:1fr 1fr}.reading time{grid-column:1/-1}}@media(max-width:640px){.reading,.date-grid{grid-template-columns:1fr}.reading time{grid-column:auto}}