@import url("./looseleaf.css");
/* Opt in on app surfaces. Readers and print previews share the studio route. */
:is(.landing, .workspace, .business, .album-workshop) {
  --desk-ink: var(--ll-ink, #2a2420);
  --desk-paper: var(--ll-slip, #fbf8f1);
  --desk-mint: var(--ll-desk, #a8c8bb);
  --desk-apricot: var(--ll-sticky-orange, #f7c08e);
  --desk-yellow: var(--ll-sticky-yellow, #f7e38a);
  --desk-edge: 7px 12px 6px 9px / 9px 6px 11px 7px;
  --desk-hand: "Kevin Sans", system-ui, sans-serif;
}
.landing .opening, .landing #process, .album-workshop .drop {
  background-color: #f9f8ed;
  background-image: linear-gradient(#55766314 1px, transparent 1px),
    linear-gradient(90deg, #55766314 1px, transparent 1px);
  background-size: 26px 26px;
}
.landing #process, .album-workshop .drop { background-color: var(--desk-mint); }
.landing .eyebrow, .workspace > small, .paper-panel > small,
.business > small, .album-workshop .eyebrow {
  font: 700 1rem/1.45 var(--desk-hand);
  letter-spacing: .045em;
  color: var(--desk-ink);
}
.landing .opening-copy .eyebrow {
  display: inline-flex;
  padding: .28em .75em;
  background: var(--desk-yellow);
  transform: rotate(-1deg);
}
.landing .opening-copy .label-line { display: none; }
.landing .workshop-steps article, .workspace .paper-panel, .business form,
.album-workshop .drop, .landing .shelf-card {
  border: 1.5px solid var(--desk-ink);
  border-radius: var(--desk-edge);
  box-shadow: 3px 3px 0 #324a3a40;
}
.landing .workshop-steps article, .workspace .paper-panel, .business form {
  background-color: var(--desk-paper);
  padding: clamp(16px, 3vw, 32px);
}
.landing .step-number { font: 700 1.2rem var(--desk-hand); color: var(--desk-ink); }
.landing .step-icon { background: var(--desk-yellow); border-color: var(--desk-ink); }
.workspace .bar { background: var(--desk-mint); border-radius: var(--desk-edge); }
.workspace .shelf-checkout { margin-block: 1.5rem; }
.workspace .shelf-checkout > * + * { margin-top: 1rem; }
.landing .opening-actions .gift-button, .landing .closing .gift-button,
.paper-panel :is(button, .cta), .workspace .buttons .cta, .business form button,
.album-workshop .btn {
  border: 1.5px solid var(--desk-ink);
  border-radius: var(--desk-edge);
  box-shadow: 2px 3px 0 var(--desk-ink);
  min-height: 44px;
}
.landing .opening-actions .gift-button, .landing .closing .gift-button,
.paper-panel .cta, .workspace .buttons .cta, .album-workshop .primary {
  color: var(--desk-ink);
  background: var(--desk-apricot);
}
.paper-panel, .paper-panel fieldset { min-width: 0; }
:is(.paper-panel, .business form, .album-workshop) :is(input, select, textarea):not([type="checkbox"], [type="radio"], [type="file"]) {
  border: 1.5px solid #687668;
  border-radius: var(--desk-edge);
  background: #fffefa;
  min-height: 44px;
  min-width: 0;
  font-size: max(1em, 16px);
}
:is(.paper-panel, .business form, .album-workshop) :is(input, select, textarea, button, a):focus-visible {
  outline: 3px solid #2753a2;
  outline-offset: 3px;
}
:is(.paper-panel, .album-workshop) :is([type="checkbox"], [type="radio"]) { accent-color: #22634a; }
.paper-panel legend { font: 700 1.25rem/1.3 var(--desk-hand); }
.paper-panel .photo-picker { background-color: var(--desk-mint); border-color: #577260; }
.workspace .paper-panel [role="alert"]:not(:empty) {
  padding: .75em 1em;
  background: #ffe5df;
  border-left: 4px solid #963340;
  color: #702131;
}
.gift-includes { padding-left: 1.4em; line-height: 1.7; }
.gift-includes li::marker { color: #346852; }
.gift-shell .delivery-fields, .gift-shell .delivery-rates {
  padding: .5rem 0 1rem;
  margin: 1.5rem 0;
  border: 0;
  border-bottom: 1px dashed #87998b;
}
.delivery-fields label { margin: .75rem 0; }
.gift-shell .delivery-rates label {
  display: grid;
  gap: .75rem;
  align-items: baseline;
  line-height: 1.5;
}
.gift-shell .delivery-rates input { flex: none; width: auto; }
@media (min-width: 700px) {
  .delivery-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 1.5rem; }
  .delivery-fields label:first-of-type { grid-column: 1 / -1; }
}

/* Bind the studio to Looseleaf's Notebook stock, ink and motion. */
.landing .workshop-steps article, .workspace .paper-panel, .business .metric,
.album-workshop .drop { background-image: url("./slip.png"); background-size: 256px; }
.landing #shelf { background: var(--ll-desk) url("./linen.png") repeat; }
.landing .shelf-card { background: var(--ll-paper); }
.landing :is(h1,h2,h3), .workspace > h1, .paper-panel :is(h2,h3),
.business :is(h1,h2), .album-workshop :is(h1,h2) {
  font-family: "Kevin Sans", system-ui, sans-serif;
  font-weight: 700;
  letter-spacing: -.035em;
  line-height: 1.06;
}
.landing h1 em, .landing h2 em { font-style: normal; color: var(--ll-ink-you); }
.landing .opening h1 em::after {
  content: ""; display: block; width: 3em; height: .29em;
  background: url("./underline-flourish.svg") left center / 100% 250% no-repeat;
}
.landing .opening-copy .eyebrow { gap: .5em; }
.landing .opening-copy .eyebrow::before, .gift-shell .gift-bookplate::before {
  content: ""; display: inline-block; width: 2rem; height: 2rem;
  border: none; background: url("./sparkle-trio.svg") center / contain no-repeat;
}
.gift-shell .gift-bookplate::before { background-image: url("./envelope-heart.svg"); }
.gift-shell .gift-bookplate { font: 700 1rem "Kevin Sans", sans-serif; }
.landing .step-icon { transform: rotate(-4deg); }
.landing .closing { background-image: url("./slip.png"); }
.landing-footer .workshop-icon { filter: brightness(0) invert(1); }
.workshop-icon { display: inline-block; vertical-align: middle; flex: none; }
.workshop-nav a { display: inline-flex; align-items: center; gap: .4rem; min-height: 44px; }
.workshop-nav, .paper-panel, .business form, .album-workshop {
  color: var(--ll-ink);
}
.paper-panel :is(label, input, select, textarea), .business form, .album-workshop .fine,
.paper-panel p, .paper-panel li { font-family: system-ui, sans-serif; }
.paper-panel :is(button,.cta), .album-workshop .btn, .landing .gift-button {
  font-family: "Kevin Sans", system-ui, sans-serif;
  font-size: 1.12rem;
  line-height: 1.25;
}
.workspace > small:not(.gift-bookplate), .business > small {
  display: inline-block; padding: .25em .75em; background: var(--desk-yellow);
}
.quick-make > small::before, .shelf-checkout > small::before {
  display: inline-block; content: ""; vertical-align: middle;
  width: 2.25rem; height: 2.25rem; margin-right: .4em;
  background: url("./notebook.svg") center / contain no-repeat;
}
.shelf-checkout > small::before { background-image: url("./envelope-heart.svg"); }
.album-sticker { flex: none; }

@media (prefers-reduced-motion: no-preference) {
  .paper-panel, .landing .opening-copy .eyebrow, .album-sticker {
    animation: ll-sheet-drop var(--ll-dur-sheet, .3s) ease-out both;
  }
  .paper-panel button:not(:disabled):active, .album-workshop .btn:active,
  .landing .gift-button:active { transform: translate(1px, 2px); }

}
.landing p { color: var(--ll-ink-muted, #4a433c); }
.landing .gift-table {
  background: var(--ll-kraft, #dcc8a3) url("./slip.png");
  border: 1.5px solid var(--desk-ink);
  border-radius: var(--desk-edge);
  box-shadow: var(--ll-shadow-card);
}
.workspace .story-shelf :is(.shelf-new,.shelf-volume) {
  border: 1.5px solid var(--desk-ink);
  border-radius: var(--desk-edge);
  box-shadow: 3px 3px 0 #324a3a40;
}
.workspace .story-shelf .shelf-new { background: var(--desk-apricot); color: var(--desk-ink); }
.workspace .shelf-volume strong { font-family: "Kevin Sans", system-ui, sans-serif; }

.workshop-nav { background: transparent; }
.gift-shell .paper-panel button.cta { background: var(--desk-apricot); color: var(--desk-ink); }
.landing .gift-button:hover, .paper-panel .cta:hover { background: var(--ll-sticky-yellow); }
@media (min-width: 760px) {
  .landing .opening h1 { font-size: clamp(48px, 4.65vw, 72px); }
}
.gift-shell .gift-actions > .cta {
  background: var(--desk-apricot);
  color: var(--desk-ink);
  border-radius: var(--desk-edge);
}

.landing .edition-seal .workshop-icon { position: static; width: .8em; height: .8em; inset: auto; }

/* Shared signature for app chrome, including the standalone album editor. */
a.workshop-brand {
  display: inline-flex; align-items: center; gap: .5rem; min-height: 44px;
  color: inherit; text-decoration: none; white-space: nowrap;
}
a.workshop-brand img { display: block; width: 48px; height: 45px; flex: none; }
a.workshop-brand span {
  color: inherit; font: 700 clamp(19px, 2vw, 26px)/1.15 "Kevin Sans", system-ui, sans-serif;
  letter-spacing: -.045em;
}
.landing .landing-nav nav a, nav.workshop-nav a, .landing-footer nav a,
.footer-share button, .landing .workshop-colophon summary {
  font: 700 1.05rem/1.3 "Kevin Sans", system-ui, sans-serif;
  min-height: 44px;
}
.landing .landing-footer {
  display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center;
  gap: 1rem clamp(20px, 3vw, 48px); padding-block: 2rem;
}
.footer-imprint { margin-inline-end: auto; }
.landing .footer-imprint p {
  display: flex; gap: .45rem; align-items: center; margin-top: .45rem;
  font: 400 .875rem/1.5 system-ui, sans-serif; color: #eee9d9;
}
.landing-footer nav { display: flex; flex-wrap: wrap; gap: .25rem 1.5rem; }
.landing-footer nav a, .footer-share button {
  display: inline-flex; align-items: center; gap: .4rem; color: inherit;
}
.footer-share button { border: 0; padding: .35em; background: transparent; }
.footer-share small { display: block; color: inherit; overflow-wrap: anywhere; }
.footer-share { min-width: 0; max-width: 100%; }
.landing .workshop-colophon { margin: 0; }
.landing .workshop-colophon summary::after {
  content: ""; width: .45em; height: .45em; border-inline-end: 2px solid;
  border-block-end: 2px solid; transform: rotate(45deg);
}
.landing .workshop-colophon[open] summary::after { transform: rotate(225deg); }
.landing .answers { background: var(--ll-slip); padding-inline: clamp(12px, 2vw, 28px);
  border: 1px solid var(--ll-pencil-mark); border-radius: var(--desk-edge); box-shadow: var(--ll-shadow-slip); }
.landing .answers details:first-child { border-top: 0; }
.landing .answers details:last-child { border-bottom: 0; }
.landing .answers summary { min-height: 48px; }
.landing .answers summary::after { content: ""; border-inline-end: 2px solid; border-block-end: 2px solid;
  width: .42em; height: .42em; flex: none; transform: rotate(45deg); }
.landing .answers details[open] summary::after { transform: rotate(225deg); }
.landing .closing p { margin-inline: auto; }
.workshop-skip {
  position: fixed; inset-block-start: .5rem; inset-inline-start: .5rem;
  z-index: 100; padding: .75em 1em; background: #fffdf4; color: #213b33;
  transform: translateY(-180%);
}
.workshop-skip:focus { transform: none; }
:where(.landing,.paper-panel,.business,.album-workshop,.workshop-nav,.gift-actions,.story-shelf) :focus-visible,
.workshop-brand:focus-visible,.workshop-skip:focus-visible,.album-workshop .picker:focus-within {
  outline: 3px solid #2653a0; outline-offset: 3px;
}
.landing .landing-footer :focus-visible { outline-color: #ffe693; }
@media (max-width: 720px) {
  .landing .landing-nav { flex-wrap: wrap; gap: .2rem 1rem; }
  .landing .landing-nav nav { flex-wrap: wrap; gap: .2rem 1rem; }
  .landing .landing-nav nav a { display: inline-flex; }
  .landing-footer .footer-imprint { flex-basis: 100%; }
  .landing-footer nav { flex-basis: 100%; }
}
@media (forced-colors: active) {
  a.workshop-brand img { background: #fff9e8; forced-color-adjust: none; border-radius: 5px; }
  .landing-footer .workshop-icon { filter: none; }
  .workshop-skip:focus, .workshop-brand:focus-visible, .landing :focus-visible,
  .paper-panel :focus-visible, .business :focus-visible, .album-workshop :focus-visible,
  .workshop-nav :focus-visible { outline-color: Highlight; }
  .landing .answers summary::after { border-color: ButtonText; }
}
.album-workshop .fine { color: var(--ll-ink-soft, #4a423b); }
.workshop-icon:dir(rtl):is([data-icon="arrow-right"], [data-icon="arrow-up-right"], [data-icon^="chevron-"]) {
  transform: scaleX(-1);
}

/* Each word keeps its natural line box. The marker sits under the baseline. */
.workshop-lettering {
  --pen-dry: var(--ll-ink-you, #2c4f9e);
  --pen-wet: #713748;
  --pen-mark: var(--ll-sticky-yellow, #f7e38a);
  color: var(--pen-dry);
}
.workshop-lettering .ink-word {
  display: inline-block;
  position: relative;
  isolation: isolate;
}
.workshop-lettering .ink-word:last-child::before {
  content: ""; position: absolute; pointer-events: none; z-index: -1;
  inset: auto -.035em .03em; height: .21em;
  background: var(--pen-mark);
  clip-path: polygon(1% 15%, 97% 0%, 100% 72%, 2% 100%);
  transform-origin: left center;
}
.workshop-lettering .ink-word:dir(rtl):last-child::before { transform-origin: right center; }
.landing .opening h1 em::after { content: none; }
.landing .library-head .workshop-lettering, .album-workshop .album-ink { --pen-dry: #285846; }
.landing .closing .workshop-lettering { --pen-dry: #87394a; }
.landing .jacket-sample {
  margin: 0 0 1.25rem; padding: clamp(.7rem, 2vw, 1.15rem);
  background: var(--ll-card); border: 1px solid var(--ll-line-soft);
}
.jacket-sample img { display: block; width: 100%; height: auto; box-shadow: var(--ll-shadow-slip); }
.landing .jacket-sample figcaption {
  font: 700 .94rem/1.4 "Kevin Sans", system-ui, sans-serif;
  text-transform: none; letter-spacing: .02em; margin: .7rem 0 0;
}
.gift-table .peek-paper img.peek-bookplate {
  inset: auto auto 2% 7%; width: 35%; height: auto; object-fit: contain;
  border-radius: 0; transform: rotate(-3deg);
}
@media (prefers-reduced-motion: no-preference) and (forced-colors: none) {
  .workshop-lettering[data-draw] .ink-word, .album-workshop .album-ink {
    animation: workshop-write var(--pen-time, .38s) cubic-bezier(.28,.35,.45,1) var(--pen-delay, 0s) both;
  }
  .workshop-lettering[data-draw] .ink-word:last-child::before {
    animation: workshop-marker .33s ease-out calc(var(--pen-delay, 0s) + var(--pen-time, .38s)) both;
  }
  .cover-peek[aria-pressed="true"] .peek-bookplate {
    animation: workshop-stamp .36s cubic-bezier(.18,.78,.25,1) .28s both;
  }
  .cover-peek:not([aria-pressed="true"]):hover .peek-cover { transform: rotateY(-8deg); }
  @keyframes workshop-write {
    from { color: var(--pen-wet); clip-path: inset(-.2em 100% -.2em -.05em); }
    70% { color: var(--pen-wet); }
    to { color: var(--pen-dry); clip-path: inset(-.2em -.05em); }
  }
  .workshop-lettering[data-draw] .ink-word:dir(rtl) { animation-name: workshop-write-rtl; }
  @keyframes workshop-write-rtl {
    from { color: var(--pen-wet); clip-path: inset(-.2em -.05em -.2em 100%); }
    to { color: var(--pen-dry); clip-path: inset(-.2em -.05em); }
  }
  @keyframes workshop-marker { from { transform: scaleX(0); } to { transform: scaleX(1); } }
  @keyframes workshop-stamp {
    from { opacity: 0; transform: translateY(-4px) rotate(-9deg) scale(1.09); }
    68% { opacity: 1; transform: rotate(-3deg) scale(.98); }
    to { opacity: 1; transform: rotate(-3deg) scale(1); }
  }
}
@media (forced-colors: active) {
  .workshop-lettering .ink-word:last-child::before { display: none; }
}
/* A longer viewing distance keeps the open board inside the tabletop. */
.gift-table .cover-peek { perspective: 2200px; }
.album-workshop .drop > div { min-inline-size: 0; overflow-wrap: anywhere; }
@media (max-width: 520px) {
  .album-workshop .drop { flex-direction: column; align-items: flex-start; gap: .75rem; }
  .album-workshop .album-sticker { width: 48px; height: 48px; }
}

/* Longfable's approved Lights Up wordmark, shared across the workshop. */
a.workshop-brand.longfable-brand img { width: clamp(160px, 19vw, 216px); height: auto; }
.landing-footer a.longfable-brand img { width: 192px; }

/* Approved Longfable motion; cream ink on the evergreen footer. */
@keyframes lf-wand{0%{transform:matrix(1,0,0,1,0,0)}1%{transform:matrix(1,0,0,1,0,0)}2%{transform:matrix(1,0,0,1,0,0)}3%{transform:matrix(1,0,0,1,0,0)}4%{transform:matrix(1,0,0,1,0,0)}5%{transform:matrix(1,0,0,1,0,0)}6%{transform:matrix(1,0,0,1,0,0)}7%{transform:matrix(1,0,0,1,0,0)}8%{transform:matrix(1,-0.0015,0.0015,1,-0.8004,2.6155)}9%{transform:matrix(0.9999,-0.0127,0.0127,0.9999,-6.6398,22.1398)}10%{transform:matrix(0.9995,-0.033,0.033,0.9995,-16.6587,57.6695)}11%{transform:matrix(0.9982,-0.0602,0.0602,0.9982,-28.9429,105.5615)}12%{transform:matrix(0.9958,-0.092,0.092,0.9958,-41.678,162.1055)}13%{transform:matrix(0.992,-0.1262,0.1262,0.992,-53.3769,223.4703)}14%{transform:matrix(0.987,-0.1605,0.1605,0.987,-63.0276,285.6973)}15%{transform:matrix(0.9813,-0.1927,0.1927,0.9813,-70.1561,344.7321)}16%{transform:matrix(0.9753,-0.2207,0.2207,0.9753,-74.7997,396.4719)}17%{transform:matrix(0.9702,-0.2423,0.2423,0.9702,-77.3886,436.8118)}18%{transform:matrix(0.9668,-0.2556,0.2556,0.9668,-78.5359,461.6741)}19%{transform:matrix(0.9664,-0.2571,0.2571,0.9664,-78.6466,464.5304)}20%{transform:matrix(0.9754,-0.2206,0.2206,0.9754,-74.7907,395.9013)}21%{transform:matrix(0.989,-0.1481,0.1481,0.989,-59.7903,261.8839)}22%{transform:matrix(0.9984,-0.0557,0.0557,0.9984,-26.9998,95.251)}23%{transform:matrix(0.9992,0.0393,-0.0393,0.9992,22.2877,-71.2996)}24%{transform:matrix(0.9929,0.1192,-0.1192,0.9929,75.9059,-207.592)}25%{transform:matrix(0.986,0.1669,-0.1669,0.986,113.3378,-287.3843)}26%{transform:matrix(0.9856,0.1689,-0.1689,0.9856,114.9884,-290.6423)}27%{transform:matrix(0.9907,0.1359,-0.1359,0.9907,88.5741,-235.3849)}28%{transform:matrix(0.9966,0.0825,-0.0825,0.9966,49.9117,-144.6494)}29%{transform:matrix(0.9998,0.0221,-0.0221,0.9998,12.2022,-40.1342)}30%{transform:matrix(0.9995,-0.0316,0.0316,0.9995,-15.9891,54.4247)}31%{transform:matrix(0.9979,-0.065,0.065,0.9979,-30.9548,113.8623)}32%{transform:matrix(0.9976,-0.0688,0.0688,0.9976,-32.558,120.7835)}33%{transform:matrix(0.9981,-0.062,0.062,0.9981,-29.7232,108.7983)}34%{transform:matrix(0.9987,-0.0506,0.0506,0.9987,-24.7504,88.5977)}35%{transform:matrix(0.9993,-0.0367,0.0367,0.9993,-18.3924,64.1125)}36%{transform:matrix(0.9997,-0.0225,0.0225,0.9997,-11.5585,39.2376)}37%{transform:matrix(0.9999,-0.0102,0.0102,0.9999,-5.3663,17.813)}38%{transform:matrix(1,-0.0021,0.0021,1,-1.1085,3.6258)}39%{transform:matrix(1,0,0,1,0,0)}40%{transform:matrix(1,0,0,1,0,0)}41%{transform:matrix(1,0,0,1,0,0)}42%{transform:matrix(1,0,0,1,0,0)}43%{transform:matrix(1,0,0,1,0,0)}44%{transform:matrix(1,0,0,1,0,0)}45%{transform:matrix(1,0,0,1,0,0)}46%{transform:matrix(1,0,0,1,0,0)}47%{transform:matrix(1,0,0,1,0,0)}48%{transform:matrix(1,0,0,1,0,0)}49%{transform:matrix(1,0,0,1,0,0)}50%{transform:matrix(1,0,0,1,0,0)}51%{transform:matrix(1,0,0,1,0,0)}52%{transform:matrix(1,0,0,1,0,0)}53%{transform:matrix(1,0,0,1,0,0)}54%{transform:matrix(1,0,0,1,0,0)}55%{transform:matrix(1,0,0,1,0,0)}56%{transform:matrix(1,0,0,1,0,0)}57%{transform:matrix(1,0,0,1,0,0)}58%{transform:matrix(1,0,0,1,0,0)}59%{transform:matrix(1,0,0,1,0,0)}60%{transform:matrix(1,0,0,1,0,0)}61%{transform:matrix(1,0,0,1,0,0)}62%{transform:matrix(1,0,0,1,0,0)}63%{transform:matrix(1,0,0,1,0,0)}64%{transform:matrix(1,0,0,1,0,0)}65%{transform:matrix(1,0,0,1,0,0)}66%{transform:matrix(1,0,0,1,0,0)}67%{transform:matrix(1,0,0,1,0,0)}68%{transform:matrix(1,0,0,1,0,0)}69%{transform:matrix(1,0,0,1,0,0)}70%{transform:matrix(1,0,0,1,0,0)}71%{transform:matrix(1,0,0,1,0,0)}72%{transform:matrix(1,0,0,1,0,0)}73%{transform:matrix(1,0,0,1,0,0)}74%{transform:matrix(1,0,0,1,0,0)}75%{transform:matrix(1,0,0,1,0,0)}76%{transform:matrix(1,0,0,1,0,0)}77%{transform:matrix(1,0,0,1,0,0)}78%{transform:matrix(1,0,0,1,0,0)}79%{transform:matrix(1,0,0,1,0,0)}80%{transform:matrix(1,0,0,1,0,0)}81%{transform:matrix(1,0,0,1,0,0)}82%{transform:matrix(1,0,0,1,0,0)}83%{transform:matrix(1,0,0,1,0,0)}84%{transform:matrix(1,0,0,1,0,0)}85%{transform:matrix(1,0,0,1,0,0)}86%{transform:matrix(1,0,0,1,0,0)}87%{transform:matrix(1,0,0,1,0,0)}88%{transform:matrix(1,0,0,1,0,0)}89%{transform:matrix(1,0,0,1,0,0)}90%{transform:matrix(1,0,0,1,0,0)}91%{transform:matrix(1,0,0,1,0,0)}92%{transform:matrix(1,0,0,1,0,0)}93%{transform:matrix(1,0,0,1,0,0)}94%{transform:matrix(1,0,0,1,0,0)}95%{transform:matrix(1,0,0,1,0,0)}96%{transform:matrix(1,0,0,1,0,0)}97%{transform:matrix(1,0,0,1,0,0)}98%{transform:matrix(1,0,0,1,0,0)}99%{transform:matrix(1,0,0,1,0,0)}100%{transform:matrix(1,0,0,1,0,0)}}
@keyframes lf-wand-hello{0%{transform:matrix(1,0,0,1,0,0)}1%{transform:matrix(1,0,0,1,0,0)}2%{transform:matrix(1,0,0,1,0,0)}3%{transform:matrix(1,0,0,1,0,0)}4%{transform:matrix(1,0,0,1,0,0)}5%{transform:matrix(1,0,0,1,0,0)}6%{transform:matrix(1,0,0,1,0,0)}7%{transform:matrix(1,0,0,1,0,0)}8%{transform:matrix(1,-0.0015,0.0015,1,-0.8004,2.6155)}9%{transform:matrix(0.9999,-0.0127,0.0127,0.9999,-6.6398,22.1398)}10%{transform:matrix(0.9995,-0.033,0.033,0.9995,-16.6587,57.6695)}11%{transform:matrix(0.9982,-0.0602,0.0602,0.9982,-28.9429,105.5615)}12%{transform:matrix(0.9958,-0.092,0.092,0.9958,-41.678,162.1055)}13%{transform:matrix(0.992,-0.1262,0.1262,0.992,-53.3769,223.4703)}14%{transform:matrix(0.987,-0.1605,0.1605,0.987,-63.0276,285.6973)}15%{transform:matrix(0.9813,-0.1927,0.1927,0.9813,-70.1561,344.7321)}16%{transform:matrix(0.9753,-0.2207,0.2207,0.9753,-74.7997,396.4719)}17%{transform:matrix(0.9702,-0.2423,0.2423,0.9702,-77.3886,436.8118)}18%{transform:matrix(0.9668,-0.2556,0.2556,0.9668,-78.5359,461.6741)}19%{transform:matrix(0.9664,-0.2571,0.2571,0.9664,-78.6466,464.5304)}20%{transform:matrix(0.9754,-0.2206,0.2206,0.9754,-74.7907,395.9013)}21%{transform:matrix(0.989,-0.1481,0.1481,0.989,-59.7903,261.8839)}22%{transform:matrix(0.9984,-0.0557,0.0557,0.9984,-26.9998,95.251)}23%{transform:matrix(0.9992,0.0393,-0.0393,0.9992,22.2877,-71.2996)}24%{transform:matrix(0.9929,0.1192,-0.1192,0.9929,75.9059,-207.592)}25%{transform:matrix(0.986,0.1669,-0.1669,0.986,113.3378,-287.3843)}26%{transform:matrix(0.9856,0.1689,-0.1689,0.9856,114.9884,-290.6423)}27%{transform:matrix(0.9907,0.1359,-0.1359,0.9907,88.5741,-235.3849)}28%{transform:matrix(0.9966,0.0825,-0.0825,0.9966,49.9117,-144.6494)}29%{transform:matrix(0.9998,0.0221,-0.0221,0.9998,12.2022,-40.1342)}30%{transform:matrix(0.9995,-0.0316,0.0316,0.9995,-15.9891,54.4247)}31%{transform:matrix(0.9979,-0.065,0.065,0.9979,-30.9548,113.8623)}32%{transform:matrix(0.9976,-0.0688,0.0688,0.9976,-32.558,120.7835)}33%{transform:matrix(0.9981,-0.062,0.062,0.9981,-29.7232,108.7983)}34%{transform:matrix(0.9987,-0.0506,0.0506,0.9987,-24.7504,88.5977)}35%{transform:matrix(0.9993,-0.0367,0.0367,0.9993,-18.3924,64.1125)}36%{transform:matrix(0.9997,-0.0225,0.0225,0.9997,-11.5585,39.2376)}37%{transform:matrix(0.9999,-0.0102,0.0102,0.9999,-5.3663,17.813)}38%{transform:matrix(1,-0.0021,0.0021,1,-1.1085,3.6258)}39%{transform:matrix(1,0,0,1,0,0)}40%{transform:matrix(1,0,0,1,0,0)}41%{transform:matrix(1,0,0,1,0,0)}42%{transform:matrix(1,0,0,1,0,0)}43%{transform:matrix(1,0,0,1,0,0)}44%{transform:matrix(1,0,0,1,0,0)}45%{transform:matrix(1,0,0,1,0,0)}46%{transform:matrix(1,0,0,1,0,0)}47%{transform:matrix(1,0,0,1,0,0)}48%{transform:matrix(1,0,0,1,0,0)}49%{transform:matrix(1,0,0,1,0,0)}50%{transform:matrix(1,0,0,1,0,0)}51%{transform:matrix(1,0,0,1,0,0)}52%{transform:matrix(1,0,0,1,0,0)}53%{transform:matrix(1,0,0,1,0,0)}54%{transform:matrix(1,0,0,1,0,0)}55%{transform:matrix(1,0,0,1,0,0)}56%{transform:matrix(1,0,0,1,0,0)}57%{transform:matrix(1,0,0,1,0,0)}58%{transform:matrix(1,0,0,1,0,0)}59%{transform:matrix(1,0,0,1,0,0)}60%{transform:matrix(1,0,0,1,0,0)}61%{transform:matrix(1,0,0,1,0,0)}62%{transform:matrix(1,0,0,1,0,0)}63%{transform:matrix(1,0,0,1,0,0)}64%{transform:matrix(1,0,0,1,0,0)}65%{transform:matrix(1,0,0,1,0,0)}66%{transform:matrix(1,0,0,1,0,0)}67%{transform:matrix(1,0,0,1,0,0)}68%{transform:matrix(1,0,0,1,0,0)}69%{transform:matrix(1,0,0,1,0,0)}70%{transform:matrix(1,0,0,1,0,0)}71%{transform:matrix(1,0,0,1,0,0)}72%{transform:matrix(1,0,0,1,0,0)}73%{transform:matrix(1,0,0,1,0,0)}74%{transform:matrix(1,0,0,1,0,0)}75%{transform:matrix(1,0,0,1,0,0)}76%{transform:matrix(1,0,0,1,0,0)}77%{transform:matrix(1,0,0,1,0,0)}78%{transform:matrix(1,0,0,1,0,0)}79%{transform:matrix(1,0,0,1,0,0)}80%{transform:matrix(1,0,0,1,0,0)}81%{transform:matrix(1,0,0,1,0,0)}82%{transform:matrix(1,0,0,1,0,0)}83%{transform:matrix(1,0,0,1,0,0)}84%{transform:matrix(1,0,0,1,0,0)}85%{transform:matrix(1,0,0,1,0,0)}86%{transform:matrix(1,0,0,1,0,0)}87%{transform:matrix(1,0,0,1,0,0)}88%{transform:matrix(1,0,0,1,0,0)}89%{transform:matrix(1,0,0,1,0,0)}90%{transform:matrix(1,0,0,1,0,0)}91%{transform:matrix(1,0,0,1,0,0)}92%{transform:matrix(1,0,0,1,0,0)}93%{transform:matrix(1,0,0,1,0,0)}94%{transform:matrix(1,0,0,1,0,0)}95%{transform:matrix(1,0,0,1,0,0)}96%{transform:matrix(1,0,0,1,0,0)}97%{transform:matrix(1,0,0,1,0,0)}98%{transform:matrix(1,0,0,1,0,0)}99%{transform:matrix(1,0,0,1,0,0)}100%{transform:matrix(1,0,0,1,0,0)}}
@keyframes lf-spark{0%{transform:matrix(0,0,0,0,1745,135)}1%{transform:matrix(0,0,0,0,1745,135)}2%{transform:matrix(0,0,0,0,1745,135)}3%{transform:matrix(0,0,0,0,1745,135)}4%{transform:matrix(0,0,0,0,1745,135)}5%{transform:matrix(0,0,0,0,1745,135)}6%{transform:matrix(0,0,0,0,1745,135)}7%{transform:matrix(0,0,0,0,1745,135)}8%{transform:matrix(0,0,0,0,1745,135)}9%{transform:matrix(0,0,0,0,1745,135)}10%{transform:matrix(0,0,0,0,1745,135)}11%{transform:matrix(0,0,0,0,1745,135)}12%{transform:matrix(0,0,0,0,1745,135)}13%{transform:matrix(0,0,0,0,1745,135)}14%{transform:matrix(0,0,0,0,1745,135)}15%{transform:matrix(0,0,0,0,1745,135)}16%{transform:matrix(0,0,0,0,1745,135)}17%{transform:matrix(0,0,0,0,1745,135)}18%{transform:matrix(0,0,0,0,1745,135)}19%{transform:matrix(0,0,0,0,1745,135)}20%{transform:matrix(0.0224,0.0002,-0.0002,0.0224,1705.9742,131.7126)}21%{transform:matrix(0.1802,0.0099,-0.0099,0.1802,1431.9043,93.3419)}22%{transform:matrix(0.4391,0.0597,-0.0597,0.4391,986.7862,-28.5385)}23%{transform:matrix(0.7348,0.1723,-0.1723,0.7348,486.0615,-264.7927)}24%{transform:matrix(1.0044,0.3364,-0.3364,1.0044,37.7196,-587.6704)}25%{transform:matrix(1.1999,0.503,-0.503,1.1999,-280.8513,-904.7757)}26%{transform:matrix(1.2919,0.5997,-0.5997,1.2919,-428.3604,-1085.804)}27%{transform:matrix(1.2858,0.5763,-0.5763,1.2858,-420.9664,-1044.2796)}28%{transform:matrix(1.2414,0.4723,-0.4723,1.2414,-357.5474,-856.8039)}29%{transform:matrix(1.1623,0.3318,-0.3318,1.1623,-238.4545,-600.9203)}30%{transform:matrix(1.0566,0.1944,-0.1944,1.0566,-72.5912,-346.8934)}31%{transform:matrix(0.9449,0.0874,-0.0874,0.9449,107.9616,-145.0464)}32%{transform:matrix(0.8559,0.0222,-0.0222,0.8559,254.4282,-19.2283)}33%{transform:matrix(0.82,0,0,0.82,314.1,24.3)}34%{transform:matrix(0.8344,0,0,0.8344,288.9038,22.3507)}35%{transform:matrix(0.8702,0,0,0.8702,226.533,17.5255)}36%{transform:matrix(0.9159,0,0,0.9159,146.8141,11.3581)}37%{transform:matrix(0.9601,0,0,0.9601,69.5734,5.3825)}38%{transform:matrix(0.9916,0,0,0.9916,14.6375,1.1324)}39%{transform:matrix(1,0,0,1,0,0)}40%{transform:matrix(1,0,0,1,0,0)}41%{transform:matrix(1,0,0,1,0,0)}42%{transform:matrix(1,0,0,1,0,0)}43%{transform:matrix(1,0,0,1,0,0)}44%{transform:matrix(1,0,0,1,0,0)}45%{transform:matrix(1,0,0,1,0,0)}46%{transform:matrix(1,0,0,1,0,0)}47%{transform:matrix(1,0,0,1,0,0)}48%{transform:matrix(1,0,0,1,0,0)}49%{transform:matrix(1,0,0,1,0,0)}50%{transform:matrix(1,0,0,1,0,0)}51%{transform:matrix(1,0,0,1,0,0)}52%{transform:matrix(1,0,0,1,0,0)}53%{transform:matrix(1,0,0,1,0,0)}54%{transform:matrix(1,0,0,1,0,0)}55%{transform:matrix(1,0,0,1,0,0)}56%{transform:matrix(1,0,0,1,0,0)}57%{transform:matrix(1,0,0,1,0,0)}58%{transform:matrix(1,0,0,1,0,0)}59%{transform:matrix(1,0,0,1,0,0)}60%{transform:matrix(1,0,0,1,0,0)}61%{transform:matrix(1,0,0,1,0,0)}62%{transform:matrix(1,0,0,1,0,0)}63%{transform:matrix(1,0,0,1,0,0)}64%{transform:matrix(1,0,0,1,0,0)}65%{transform:matrix(1,0,0,1,0,0)}66%{transform:matrix(1,0,0,1,0,0)}67%{transform:matrix(1,0,0,1,0,0)}68%{transform:matrix(1,0,0,1,0,0)}69%{transform:matrix(1,0,0,1,0,0)}70%{transform:matrix(1,0,0,1,0,0)}71%{transform:matrix(1,0,0,1,0,0)}72%{transform:matrix(1,0,0,1,0,0)}73%{transform:matrix(1,0,0,1,0,0)}74%{transform:matrix(1,0,0,1,0,0)}75%{transform:matrix(1,0,0,1,0,0)}76%{transform:matrix(1,0,0,1,0,0)}77%{transform:matrix(1,0,0,1,0,0)}78%{transform:matrix(1,0,0,1,0,0)}79%{transform:matrix(1,0,0,1,0,0)}80%{transform:matrix(1,0,0,1,0,0)}81%{transform:matrix(1,0,0,1,0,0)}82%{transform:matrix(1,0,0,1,0,0)}83%{transform:matrix(1,0,0,1,0,0)}84%{transform:matrix(1,0,0,1,0,0)}85%{transform:matrix(1,0,0,1,0,0)}86%{transform:matrix(1,0,0,1,0,0)}87%{transform:matrix(1,0,0,1,0,0)}88%{transform:matrix(1,0,0,1,0,0)}89%{transform:matrix(1,0,0,1,0,0)}90%{transform:matrix(1,0,0,1,0,0)}91%{transform:matrix(1,0,0,1,0,0)}92%{transform:matrix(1,0,0,1,0,0)}93%{transform:matrix(1,0,0,1,0,0)}94%{transform:matrix(1,0,0,1,0,0)}95%{transform:matrix(1,0,0,1,0,0)}96%{transform:matrix(1,0,0,1,0,0)}97%{transform:matrix(1,0,0,1,0,0)}98%{transform:matrix(1,0,0,1,0,0)}99%{transform:matrix(1,0,0,1,0,0)}100%{transform:matrix(1,0,0,1,0,0)}}
@keyframes lf-spark-hello{0%{transform:matrix(0,0,0,0,1745,135)}1%{transform:matrix(0,0,0,0,1745,135)}2%{transform:matrix(0,0,0,0,1745,135)}3%{transform:matrix(0,0,0,0,1745,135)}4%{transform:matrix(0,0,0,0,1745,135)}5%{transform:matrix(0,0,0,0,1745,135)}6%{transform:matrix(0,0,0,0,1745,135)}7%{transform:matrix(0,0,0,0,1745,135)}8%{transform:matrix(0,0,0,0,1745,135)}9%{transform:matrix(0,0,0,0,1745,135)}10%{transform:matrix(0,0,0,0,1745,135)}11%{transform:matrix(0,0,0,0,1745,135)}12%{transform:matrix(0,0,0,0,1745,135)}13%{transform:matrix(0,0,0,0,1745,135)}14%{transform:matrix(0,0,0,0,1745,135)}15%{transform:matrix(0,0,0,0,1745,135)}16%{transform:matrix(0,0,0,0,1745,135)}17%{transform:matrix(0,0,0,0,1745,135)}18%{transform:matrix(0,0,0,0,1745,135)}19%{transform:matrix(0,0,0,0,1745,135)}20%{transform:matrix(0.0224,0.0002,-0.0002,0.0224,1705.9742,131.7126)}21%{transform:matrix(0.1802,0.0099,-0.0099,0.1802,1431.9043,93.3419)}22%{transform:matrix(0.4391,0.0597,-0.0597,0.4391,986.7862,-28.5385)}23%{transform:matrix(0.7348,0.1723,-0.1723,0.7348,486.0615,-264.7927)}24%{transform:matrix(1.0044,0.3364,-0.3364,1.0044,37.7196,-587.6704)}25%{transform:matrix(1.1999,0.503,-0.503,1.1999,-280.8513,-904.7757)}26%{transform:matrix(1.2919,0.5997,-0.5997,1.2919,-428.3604,-1085.804)}27%{transform:matrix(1.2858,0.5763,-0.5763,1.2858,-420.9664,-1044.2796)}28%{transform:matrix(1.2414,0.4723,-0.4723,1.2414,-357.5474,-856.8039)}29%{transform:matrix(1.1623,0.3318,-0.3318,1.1623,-238.4545,-600.9203)}30%{transform:matrix(1.0566,0.1944,-0.1944,1.0566,-72.5912,-346.8934)}31%{transform:matrix(0.9449,0.0874,-0.0874,0.9449,107.9616,-145.0464)}32%{transform:matrix(0.8559,0.0222,-0.0222,0.8559,254.4282,-19.2283)}33%{transform:matrix(0.82,0,0,0.82,314.1,24.3)}34%{transform:matrix(0.8344,0,0,0.8344,288.9038,22.3507)}35%{transform:matrix(0.8702,0,0,0.8702,226.533,17.5255)}36%{transform:matrix(0.9159,0,0,0.9159,146.8141,11.3581)}37%{transform:matrix(0.9601,0,0,0.9601,69.5734,5.3825)}38%{transform:matrix(0.9916,0,0,0.9916,14.6375,1.1324)}39%{transform:matrix(1,0,0,1,0,0)}40%{transform:matrix(1,0,0,1,0,0)}41%{transform:matrix(1,0,0,1,0,0)}42%{transform:matrix(1,0,0,1,0,0)}43%{transform:matrix(1,0,0,1,0,0)}44%{transform:matrix(1,0,0,1,0,0)}45%{transform:matrix(1,0,0,1,0,0)}46%{transform:matrix(1,0,0,1,0,0)}47%{transform:matrix(1,0,0,1,0,0)}48%{transform:matrix(1,0,0,1,0,0)}49%{transform:matrix(1,0,0,1,0,0)}50%{transform:matrix(1,0,0,1,0,0)}51%{transform:matrix(1,0,0,1,0,0)}52%{transform:matrix(1,0,0,1,0,0)}53%{transform:matrix(1,0,0,1,0,0)}54%{transform:matrix(1,0,0,1,0,0)}55%{transform:matrix(1,0,0,1,0,0)}56%{transform:matrix(1,0,0,1,0,0)}57%{transform:matrix(1,0,0,1,0,0)}58%{transform:matrix(1,0,0,1,0,0)}59%{transform:matrix(1,0,0,1,0,0)}60%{transform:matrix(1,0,0,1,0,0)}61%{transform:matrix(1,0,0,1,0,0)}62%{transform:matrix(1,0,0,1,0,0)}63%{transform:matrix(1,0,0,1,0,0)}64%{transform:matrix(1,0,0,1,0,0)}65%{transform:matrix(1,0,0,1,0,0)}66%{transform:matrix(1,0,0,1,0,0)}67%{transform:matrix(1,0,0,1,0,0)}68%{transform:matrix(1,0,0,1,0,0)}69%{transform:matrix(1,0,0,1,0,0)}70%{transform:matrix(1,0,0,1,0,0)}71%{transform:matrix(1,0,0,1,0,0)}72%{transform:matrix(1,0,0,1,0,0)}73%{transform:matrix(1,0,0,1,0,0)}74%{transform:matrix(1,0,0,1,0,0)}75%{transform:matrix(1,0,0,1,0,0)}76%{transform:matrix(1,0,0,1,0,0)}77%{transform:matrix(1,0,0,1,0,0)}78%{transform:matrix(1,0,0,1,0,0)}79%{transform:matrix(1,0,0,1,0,0)}80%{transform:matrix(1,0,0,1,0,0)}81%{transform:matrix(1,0,0,1,0,0)}82%{transform:matrix(1,0,0,1,0,0)}83%{transform:matrix(1,0,0,1,0,0)}84%{transform:matrix(1,0,0,1,0,0)}85%{transform:matrix(1,0,0,1,0,0)}86%{transform:matrix(1,0,0,1,0,0)}87%{transform:matrix(1,0,0,1,0,0)}88%{transform:matrix(1,0,0,1,0,0)}89%{transform:matrix(1,0,0,1,0,0)}90%{transform:matrix(1,0,0,1,0,0)}91%{transform:matrix(1,0,0,1,0,0)}92%{transform:matrix(1,0,0,1,0,0)}93%{transform:matrix(1,0,0,1,0,0)}94%{transform:matrix(1,0,0,1,0,0)}95%{transform:matrix(1,0,0,1,0,0)}96%{transform:matrix(1,0,0,1,0,0)}97%{transform:matrix(1,0,0,1,0,0)}98%{transform:matrix(1,0,0,1,0,0)}99%{transform:matrix(1,0,0,1,0,0)}100%{transform:matrix(1,0,0,1,0,0)}}
a.longfable-brand { --longfable-ink: #41152d; --longfable-spark: #ad711a; }
a.longfable-brand .longfable-logo { display: block; width: clamp(160px, 19vw, 216px); line-height: 0; color: var(--longfable-ink); }
.longfable-logo svg { display: block; width: 100%; height: auto; overflow: visible; }
.landing-footer a.longfable-brand { --longfable-ink: #fff5df; --longfable-spark: #efbd62; }
.landing-footer a.longfable-brand .longfable-logo { width: 192px; }
.longfable-brand .lf-wand { animation: lf-wand 2.8s linear 1; }
.longfable-brand .lf-spark { animation: lf-spark 2.8s linear 1; }
.longfable-brand:is(:hover,:focus-visible) .lf-wand { animation: lf-wand-hello 1.6s linear 1; }
.longfable-brand:is(:hover,:focus-visible) .lf-spark { animation: lf-spark-hello 1.6s linear 1; }
@media (prefers-reduced-motion: reduce) {
  .longfable-brand .lf-wand, .longfable-brand .lf-spark { animation: none !important; }
}

/* A compact studio signature, with the product name given its own quiet line. */
a.workshop-brand.longfable-brand { flex-direction: column; align-items: center; gap: 0; padding-block: 3px; }
a.longfable-brand .longfable-logo { width: clamp(156px, 18vw, 204px); }
a.longfable-brand .longfable-subtitle { font: 600 10px/1.2 system-ui, sans-serif; text-transform: uppercase; letter-spacing: .22em; color: var(--longfable-ink); margin-top: -6px; padding-left: .22em; }
.landing-footer a.longfable-brand .longfable-logo { width: 204px; }
.landing-footer a.longfable-brand .longfable-subtitle { color: #efbd62; }
.landing .landing-footer { padding-block: 36px; align-items: center; gap: 24px 32px; }
.landing .footer-imprint { display: flex; flex-direction: column; align-items: flex-start; }
.landing .footer-imprint p { margin: 14px 0 0; font-size: 13px; line-height: 1.6; color: #e5e7db; }
@media(max-width:600px) {
  .landing .landing-footer { padding-block: 28px; gap: 20px; }
  .landing-footer a.longfable-brand .longfable-logo { width: 184px; }
}

/* Reusable workshop sizing, independent of the illustrated reader. */
:root {
  --workshop-space-1:.5rem;
  --workshop-space-2:1rem;
  --workshop-space-3:1.5rem;
  --workshop-title-small:clamp(1.25rem,3vw,1.5rem);
  --workshop-control:2.75rem;
}
:where(.workspace,.paper-panel,.gift-shell,.album-workshop) { overflow-wrap:break-word; }
:where(.paper-panel,.gift-shell,.album-workshop) :is(button,.cta,summary) {
  min-block-size:var(--workshop-control);
  white-space:normal;
  overflow-wrap:anywhere;
}
:where(.paper-panel,.gift-shell,.album-workshop) :is(input,textarea,select) { scroll-margin-block:5rem; }
:where(.paper-panel,.gift-shell,.album-workshop) :is(input,textarea,select):not([type=checkbox],[type=radio]) {
  font-family:system-ui,sans-serif;
  font-size:max(1rem,16px);
  font-weight:400;
  line-height:1.5;
}
.entry-header .workshop-menu nav {
  max-inline-size:calc(100vw - 2rem);
  max-block-size:calc(100dvh - 5.5rem);
  overflow:auto;
  overscroll-behavior:contain;
}
.entry-header .workshop-menu nav a { overflow-wrap:anywhere; }
@media (max-width:650px) {
  main > .workspace.creating-book { padding-block-start:1rem; }
  .workspace.creating-book { padding-inline:max(1rem,env(safe-area-inset-left)) max(1rem,env(safe-area-inset-right)); }
  .paper-panel :is(button,.cta) { max-inline-size:100%; }
}
@media (prefers-reduced-motion:reduce) {
  :where(.workspace,.gift-shell,.album-workshop) *, :where(.workspace,.gift-shell,.album-workshop) *::before,
  :where(.workspace,.gift-shell,.album-workshop) *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
}
/* Text enlargement can wrap the masthead without pushing the menu offscreen. */
.entry-header { flex-wrap:wrap; }
.entry-header .workshop-menu { margin-inline-start:auto; }
.entry-header .workshop-menu nav { min-inline-size:0; width:min(22rem,calc(100vw - 32px)); }
.entry-header .workshop-menu nav a { min-inline-size:0; }
/* Use the same quiet reading face for album instructions and studio forms. */
.album-workshop :is(.intro,.drop p,.settings label,.photo label,.field,.fine) {
  font-family:system-ui,sans-serif;
  letter-spacing:normal;
  line-height:1.5;
}
