.bk{--bk-w:min(340px, 72vw);--bk-d:34px;width:var(--bk-w);aspect-ratio:3/4;perspective:1600px;margin-inline:auto;position:relative}.bk-glow{pointer-events:none;background:radial-gradient(circle,#d9a44161,#d9a44100 62%);border-radius:50%;position:absolute;inset:-22%}.bk-book{transform-style:preserve-3d;position:absolute;inset:0;transform:rotateY(-22deg)rotateX(4deg)}.bk-cover,.bk-back{border-radius:4px 14px 14px 4px;position:absolute;inset:0}.bk-back{transform:translateZ(calc(var(--bk-d) / -2));background:#22160f}.bk-cover{transform:translateZ(calc(var(--bk-d) / 2));background:linear-gradient(105deg, #241811 0%, var(--cocoa) 8%, #332219 60%, var(--cocoa) 100%);color:var(--linen);flex-direction:column;justify-content:space-between;padding:13% 10% 10% 15%;display:flex;overflow:hidden;box-shadow:inset 10px 0 #3a2a21,inset 12px 0 #1d130e}.bk-title{font-family:var(--serif);flex-direction:column;gap:6px;display:flex}.bk-t1{font-size:calc(var(--bk-w) * .105);white-space:nowrap;letter-spacing:-.02em;line-height:1}.bk-t1 em{font-style:italic}.bk-t2{font-size:calc(var(--bk-w) * .13);color:var(--peach-glow);letter-spacing:-.02em;font-style:italic;line-height:1}.bk-sub{font-family:var(--sans);font-size:max(12px, calc(var(--bk-w) * .04));color:#d8d2c6;max-width:16em;margin-top:12px;line-height:1.45}.bk-author{letter-spacing:.2em;text-transform:uppercase;color:var(--honey);font-size:12px;font-weight:700}.bk-sheen{pointer-events:none;background:linear-gradient(115deg,#0000 30%,#fff0dc17 45%,#0000 60%);position:absolute;inset:0}.bk-spine{top:0;bottom:0;left:calc(var(--bk-d) / -2);width:var(--bk-d);background:linear-gradient(90deg,#1d130e,#2e1f17 50%,#1d130e);border-radius:3px;justify-content:center;align-items:center;display:flex;position:absolute;transform:rotateY(-90deg)}.bk-spine span{writing-mode:vertical-rl;font-family:var(--serif);color:var(--peach-glow);white-space:nowrap;font-size:12px}.bk-pages{top:1.5%;bottom:1.5%;right:calc(var(--bk-d) / -2);width:calc(var(--bk-d) - 4px);background:repeating-linear-gradient(90deg,#f3e8da 0 1px,#e6d8c5 1px 2px);position:absolute;transform:rotateY(90deg)}
.sub{flex-direction:column;gap:16px;width:100%;display:flex}.sub-card{background:var(--white);border:1px solid var(--line);border-radius:22px;padding:clamp(20px,3vw,28px)}.sub-row{flex-wrap:wrap;gap:12px;display:flex}.sub-field{flex-direction:column;flex:200px;gap:8px;font-size:14px;font-weight:500;display:flex}.sub-field input{color:var(--ink);background:#fbf7f1;border:1px solid #d8cbbb;border-radius:12px;min-height:54px;padding:15px 16px;font-size:17px;transition:border-color .3s,background-color .3s,box-shadow .3s}.sub-field input::placeholder{color:#9a8877}.sub-field input:focus{border-color:var(--terracotta);background:#fff;outline:none;box-shadow:0 0 0 4px #b5502f1f}.sub-btn{border-radius:14px;width:100%;min-height:60px;font-size:17px}.sub-note{color:var(--muted);text-align:center;margin:0;font-size:13px;line-height:1.5}.sub-error{color:var(--terracotta-deep);margin:0;font-size:14px;font-weight:500}.sub-hp{width:1px;height:1px;position:absolute;left:-9999px;overflow:hidden}.sub-ages{border:0;margin:0;padding:0}.sub-ages legend{margin-bottom:8px;padding:0;font-size:14px;font-weight:500}.sub-chips{flex-wrap:wrap;gap:8px;display:flex}.sub-chip{cursor:pointer;min-height:44px;transition:background-color .35s var(--ease-out), color .35s var(--ease-out), border-color .35s;border:1px solid #d8cbbb;border-radius:999px;align-items:center;padding:11px 18px;font-size:15px;display:inline-flex;position:relative}.sub-chip input{opacity:0;cursor:pointer;position:absolute;inset:0}.sub-chip:has(input:focus-visible){outline:2px solid var(--terracotta);outline-offset:2px}.sub-chip.is-on{background:var(--cocoa);border-color:var(--cocoa);color:var(--linen)}.sub-spinner{border:2px solid #ffffff59;border-top-color:#fff;border-radius:50%;width:18px;height:18px;animation:.8s linear infinite sub-spin}@keyframes sub-spin{to{transform:rotate(360deg)}}.sub-dark .sub-field input{background:var(--cocoa-soft);border-color:var(--cocoa-line);color:var(--linen)}.sub-dark .sub-field input::placeholder{color:#a8968a}.sub-dark .sub-field input:focus{border-color:var(--peach-glow);background:#41302a;box-shadow:0 0 0 4px #eb9a7426}.sub-dark .sub-note{color:#b9a796}.sub-dark .sub-error{color:var(--peach-glow)}.sub-dark .sub-chip{border-color:var(--cocoa-line)}.sub-dark .sub-chip.is-on{background:var(--linen);color:var(--cocoa)}.sub-inline{flex-flow:wrap;gap:10px}.sub-inline .sub-inline-field{flex:260px}.sub-inline .sub-btn{border-radius:999px;flex:none;width:auto;min-height:56px}.sub-inline .sub-field input{border-radius:999px;min-height:56px;padding-inline:22px}.sub-inline .sub-error,.sub-inline .sub-note{text-align:left;flex-basis:100%}@media (max-width:520px){.sub-inline .sub-btn{width:100%}}.sub-done{flex-direction:row;align-items:center;gap:18px}.sub-check{flex-shrink:0;width:52px;height:52px}.sub-check circle,.sub-check path{fill:none;stroke:var(--terracotta);stroke-width:2.5px;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1px;animation:sub-draw .9s var(--ease-out) forwards}.sub-check path{animation-delay:.45s}.sub-dark .sub-check circle,.sub-dark .sub-check path{stroke:var(--peach-glow)}@keyframes sub-draw{to{stroke-dashoffset:0}}.sub-done-title{font-family:var(--serif);margin:0;font-size:26px;line-height:1.2}.sub-done-body{color:var(--muted);margin:4px 0 0;font-size:15px}.sub-dark .sub-done-body{color:#cbbcad}
