.carnet{--rule:2.125rem;background-color:var(--paper);background-image:linear-gradient(to bottom, transparent calc(var(--rule) - 1px), var(--paper-rule) calc(var(--rule) - 1px), var(--paper-rule) var(--rule));background-size:100% var(--rule);color:var(--paper-ink);font-family:var(--font-hand), cursive;font-size:calc(var(--rule) * .62);line-height:var(--rule);background-position:0 .9rem;border-radius:3px;padding:.9rem .9rem 1.2rem 2.9rem;position:relative;overflow:hidden;box-shadow:0 1px #2b27200f,0 18px 40px -18px #2b272059}.carnet:before{content:"";inset-block:0;background:var(--paper-margin);opacity:.55;width:1.5px;position:absolute;left:2.2rem}.carnet-line{white-space:nowrap;display:block;position:relative}.carnet-line>span{position:relative}.carnet-mark{transform-origin:0;background:#00c0a033;border-radius:3px;position:absolute;inset:.3rem -.35rem .2rem;transform:scaleX(0)}.carnet-scan{inset-inline:0;background:var(--signal);opacity:0;pointer-events:none;height:2px;position:absolute;top:0}.record{background:var(--card);color:var(--card-foreground);box-shadow:var(--shadow-raised);border-radius:1rem;padding:1.25rem 1.25rem .5rem}.record-row{border-top:1px solid var(--border);justify-content:space-between;align-items:center;gap:1rem;padding-block:.7rem;font-size:.94rem;display:flex}.record-row dd{font-variant-numeric:tabular-nums;text-align:right;font-weight:500}.record-row[data-check] .record-dose{color:var(--warning)}.reading-links{pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.reading-links path{fill:none;stroke:var(--signal);stroke-width:1.5px;stroke-dasharray:var(--len,0);stroke-dashoffset:0}.reading-links circle{fill:var(--signal)}.carnet-ribbon{white-space:nowrap;border-block:1px solid var(--border);background:var(--paper);color:var(--paper-ink);font-family:var(--font-hand), cursive;padding-block:.6rem;font-size:clamp(1.4rem,2.6vw,1.9rem);overflow:hidden}.carnet-ribbon-track{gap:2.75rem;padding-inline:1.5rem;display:inline-flex}.carnet-ribbon-track span[aria-hidden]{color:#a8966f}@supports (animation-timeline:scroll()){@media (prefers-reduced-motion:no-preference){.carnet-ribbon-track{animation:linear both ribbon-drift;animation-timeline:scroll(root)}}}@keyframes ribbon-drift{0%{transform:translate(0)}to{transform:translate(-35%)}}.how-step :is(h3,.how-number){transition:color .3s var(--ease-standard)}[data-how=live] .how-step:not([data-active]) :is(h3,.how-number){color:var(--subtle-foreground)}.how-panel{background:var(--muted);border-radius:1.75rem;height:32.5rem;position:sticky;top:calc(50svh - 16.25rem);overflow:hidden}.how-panel>*{transition:transform .6s var(--ease-standard), opacity .45s var(--ease-standard);position:absolute}.how-panel .carnet{--rule:1.95rem;width:19rem;top:3.4rem;left:2.75rem}.how-frame{width:21.3rem;height:19.6rem;top:2.1rem;left:1.6rem}.how-frame i{border:3px solid var(--signal);width:1.6rem;height:1.6rem;position:absolute}.how-frame i:first-child{border-bottom:0;border-right:0;border-top-left-radius:.5rem;top:0;left:0}.how-frame i:nth-child(2){border-bottom:0;border-left:0;border-top-right-radius:.5rem;top:0;right:0}.how-frame i:nth-child(3){border-top:0;border-right:0;border-bottom-left-radius:.5rem;bottom:0;left:0}.how-frame i:nth-child(4){border-top:0;border-left:0;border-bottom-right-radius:.5rem;bottom:0;right:0}.how-panel .record{width:19.5rem;bottom:1.75rem;right:1.75rem}.how-status{background:var(--card);border-radius:.75rem;align-items:center;gap:.6rem;padding:.7rem .9rem;font-size:.9rem;display:flex;bottom:2.25rem;left:2.75rem}.how-spinner{border:2px solid var(--input);border-top-color:var(--primary);border-radius:50%;width:.9rem;height:.9rem;animation:1s linear infinite how-spin}@keyframes how-spin{to{transform:rotate(1turn)}}.how-qr{background:var(--card);text-align:center;width:8.25rem;color:var(--muted-foreground);border-radius:1rem;padding:.75rem;font-size:.75rem;top:2.25rem;left:2.75rem}.how-qr svg{border:2px solid var(--signal);background:#fff;border-radius:.5rem;width:100%;height:auto;padding:.35rem;display:block}.how-panel[data-step=photograph] :is(.record,.how-status,.how-qr){opacity:0}.how-panel[data-step=photograph] .record{transform:translateY(2.5rem)}.how-panel[data-step=read] :is(.how-frame,.how-qr){opacity:0}.how-panel[data-step=read] .record{opacity:0;transform:translateY(2.5rem)}.how-panel[data-step=check] :is(.how-frame,.how-status,.how-qr){opacity:0}.how-panel[data-step=check] .carnet{transform:translate(-1.2rem,-.6rem)rotate(-2deg)scale(.95)}.how-panel[data-step=check] .record-row[data-check]{background:var(--warning-soft);border-radius:.5rem;margin-inline:-.75rem;padding-inline:.75rem}.how-panel[data-step=keep] :is(.how-frame,.how-status){opacity:0}.how-panel[data-step=keep] .carnet{opacity:.45;transform:translate(-2.5rem,4rem)rotate(-5deg)scale(.82)}@media (max-width:63.99rem){.how-panel{z-index:2;border-radius:1.25rem;height:20rem;top:4.5rem}.how-panel .carnet{--rule:1.4rem;width:12.75rem;padding:.7rem .6rem .9rem 2.1rem;top:1.4rem;left:1.1rem}.how-panel .carnet:before{left:1.6rem}.how-frame{width:14rem;height:13.4rem;top:.6rem;left:.5rem}.how-panel .record{width:14.5rem;padding:.75rem .75rem .25rem;bottom:.75rem;right:.75rem}.how-panel .record :is(.record-head,[data-field=test],[data-field=lock]){display:none}.how-panel .record-row{padding-block:.45rem;font-size:.75rem}.how-panel .record-title{font-size:1.05rem}.how-qr{width:6rem;top:1.1rem;left:1.1rem}.how-status{bottom:.9rem;left:1.1rem}}.reading{--read-start:.7s;--read-step:.42s}.reading .carnet-scan{animation:read-scan calc(8 * var(--read-step) + .3s) linear var(--read-start) both}.reading .carnet-mark{animation:read-mark 1.1s var(--ease-standard) both;animation-delay:calc(var(--read-start) + .12s + var(--i) * var(--read-step))}.reading .record-field{animation:read-field .4s var(--ease-standard) both;animation-delay:calc(var(--read-start) + .2s + var(--i) * var(--read-step))}.reading .reading-links path{animation:read-link .7s var(--ease-standard) both}.reading .reading-links circle{animation:.3s both read-dot}@keyframes read-scan{0%{opacity:0;top:.9rem}8%,92%{opacity:1}to{opacity:0;top:100%}}@keyframes read-mark{0%{transform:scaleX(0)}35%{opacity:1;transform:scaleX(1)}75%{opacity:1}to{opacity:0;transform:scaleX(1)}}@keyframes read-field{0%{opacity:0;transform:translateY(4px)}}@keyframes read-link{0%{stroke-dashoffset:var(--len,0)}}@keyframes read-dot{0%{opacity:0}}@media (prefers-reduced-motion:reduce){.reading *,.reading .reading-links *{animation:none!important}}.ink-band{--primary:var(--ink-band-foreground);--primary-foreground:#0f1e26;--secondary:#f6f4ef1f;--secondary-foreground:var(--ink-band-foreground);--ring:var(--ink-band-foreground);background:var(--ink-band);color:var(--ink-band-foreground)}