*{box-sizing:border-box}body{margin:0;background:#dfe5fb;color:#222d6e;font:16px/1.5 Arial,sans-serif;padding:30px}main{max-width:1000px;margin:auto;background:#f6f2e9;min-height:calc(100vh - 60px);border-radius:18px;padding:35px 55px}header,footer,.today{display:flex;justify-content:space-between;align-items:center;gap:20px}header b{font-size:27px;letter-spacing:-1px}header b span{font-size:12px;vertical-align:top}a{color:inherit;font-size:13px}.content{max-width:630px;margin:55px auto}.label,.note,footer{font-size:11px;letter-spacing:1px}h1{font-size:64px;font-weight:400;line-height:1.05;letter-spacing:-3px;margin:24px 0 40px}h1 i{font-family:Georgia,serif;font-weight:400}h2{font:32px Georgia,serif;margin:0}.today>span{font-size:13px}.today{border-bottom:1px solid #ccd0df;padding-bottom:20px}#tasks label{display:flex;align-items:center;gap:15px;padding:21px 0;border-bottom:1px solid #ccd0df;cursor:pointer}input[type=checkbox]{width:24px;height:24px;accent-color:#2945c7}#tasks small{margin-left:auto;font-size:10px}input:checked+span{text-decoration:line-through;opacity:.5}form{margin-top:25px}form>label{font-size:12px}form>div{display:flex;gap:10px;margin-top:8px}#task{flex:1;min-width:0;padding:12px;border:1px solid #ccd0df;background:transparent;border-radius:8px;font:inherit}button{border:0;background:#2945c7;color:white;border-radius:50%;width:44px;font-size:26px;cursor:pointer}.note{margin-top:30px;color:#626b82;letter-spacing:0}footer{border-top:1px solid #ccd0df;padding-top:20px}footer span{font-size:30px}@media(max-width:600px){body{padding:12px}main{padding:25px}h1{font-size:50px}header a{font-size:11px}.content{margin-top:40px}#tasks small{display:none}}
/* Keep the interactive study in the portfolio's editorial rhythm. */
main{border-radius:4px;box-shadow:10px 12px 0 #222d6e12}
.label,.note,footer{font-size:12px}
#tasks small{font-size:12px}
#tasks label{transition:background-color .2s}
#tasks label:hover{background:#2945c708}
:focus-visible{outline:2px solid #2945c7;outline-offset:5px}
@media(max-width:600px){header{align-items:flex-start}header a{font-size:12px;max-width:130px;text-align:right}h1{font-size:clamp(40px,12vw,50px);letter-spacing:-2px}footer{flex-wrap:wrap}}