:root{--paper: #f4eee0;--paper-deep: #e9dfca;--sheet: #fcf8ec;--ink: #26211a;--ink-soft: #6e6557;--ink-faint: rgba(38, 33, 26, .16);--accent: #b02031;--accent-wash: rgba(176, 32, 49, .13);--font-display: "Fraunces", "Iowan Old Style", Georgia, serif;--font-mono: "Courier Prime", "Courier New", monospace;--font-script: "La Belle Aurore", "Bradley Hand", cursive;--ease-out: cubic-bezier(.22, 1, .36, 1);--ease-spring: cubic-bezier(.34, 1.56, .64, 1)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;-webkit-tap-highlight-color:transparent}body{font-family:var(--font-mono);background-color:var(--paper);color:var(--ink);min-height:100vh;overflow-x:hidden}::selection{background:var(--accent);color:var(--paper)}:focus-visible{outline:2px dashed var(--accent);outline-offset:3px}body:after{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background:radial-gradient(55vmax 55vmax at 88% -8%,var(--accent-wash),transparent 62%),radial-gradient(45vmax 45vmax at -8% 108%,var(--accent-wash),transparent 62%);pointer-events:none;z-index:0}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");opacity:.06;mix-blend-mode:multiply;pointer-events:none;z-index:10}.ticker{position:relative;z-index:1;background:var(--ink);color:var(--paper);overflow:hidden;padding:9px 0}.ticker-track{display:flex;width:max-content;animation:tickerScroll 48s linear infinite}.ticker:hover .ticker-track{animation-play-state:paused}.ticker-group{display:flex}.ticker-item{display:flex;align-items:center;white-space:nowrap;font-size:.62rem;font-weight:700;letter-spacing:.3em;text-transform:uppercase}.ticker-star{margin:0 2.4em;opacity:.45;letter-spacing:0}@keyframes tickerScroll{to{transform:translate(-50%)}}.webpage{position:relative;z-index:1;max-width:1180px;margin:0 auto;padding:48px 40px 40px}header{position:relative;margin-bottom:72px;animation:riseIn .9s var(--ease-out) .1s backwards}.masthead-rule{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;border-top:2px solid var(--ink);border-bottom:1px solid var(--ink-faint);padding:10px 2px;font-size:.62rem;font-weight:700;letter-spacing:.32em;text-transform:uppercase;color:var(--ink-soft)}h1{font-family:var(--font-display);font-optical-sizing:auto;font-size:clamp(3.6rem,11vw,8rem);font-weight:540;letter-spacing:-.035em;line-height:.98;margin-top:28px}h1 em{font-style:italic;font-weight:440;color:var(--accent)}h1:after{content:"✦";display:inline-block;font-size:.22em;vertical-align:super;margin-left:.5em;color:var(--accent);animation:spinStar 14s linear infinite}.subtitle{font-family:var(--font-script);font-size:clamp(1.5rem,3.2vw,2.1rem);color:var(--accent);transform:rotate(-2deg);transform-origin:left center;margin:10px 0 0 10px;animation:riseIn .9s var(--ease-out) .35s backwards}.header-note{display:none;position:absolute;right:6px;bottom:2px;font-family:var(--font-script);font-size:1.4rem;color:var(--ink-soft);transform:rotate(-2.5deg);text-decoration:underline wavy var(--accent) 1px;text-underline-offset:7px;animation:riseIn .9s var(--ease-out) .55s backwards}@media (min-width: 900px){.header-note{display:block}}.container{display:grid;gap:48px;animation:riseIn .9s var(--ease-out) .25s backwards}.section-heading{display:flex;align-items:center;gap:14px;font-size:.64rem;font-weight:700;letter-spacing:.32em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:26px}.section-heading:after{content:"";flex:1;height:1px;background:var(--ink-faint)}#generator-form{display:flex;flex-direction:column;gap:26px}.field{display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px dashed var(--ink-faint);padding-bottom:22px}label{font-size:.8rem;font-weight:700;letter-spacing:.12em;text-transform:lowercase;color:var(--ink-soft);cursor:pointer;transition:color .3s ease}.field:hover label,.field:focus-within label{color:var(--ink)}.stepper{display:flex;align-items:center;gap:6px}.step-btn{width:34px;height:34px;border-radius:50%;border:1.5px solid var(--ink);background:transparent;color:var(--ink);font-family:var(--font-mono);font-size:1.05rem;line-height:1;cursor:pointer;transition:background .2s ease,color .2s ease,transform .2s var(--ease-spring)}.step-btn:hover{background:var(--ink);color:var(--paper);transform:translateY(-1px)}.step-btn:active{transform:translateY(1px)}input[type=number]{width:76px;text-align:center;font-family:var(--font-display);font-optical-sizing:auto;font-size:2rem;font-weight:520;color:var(--ink);background:transparent;border:none;-moz-appearance:textfield;-webkit-appearance:textfield;appearance:textfield}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]:focus{outline:none}.stepper:focus-within{outline:2px dashed var(--accent);outline-offset:5px;border-radius:4px}input[type=checkbox]{-moz-appearance:none;appearance:none;-webkit-appearance:none;flex-shrink:0;width:56px;height:30px;border:1.5px solid var(--ink);border-radius:999px;background:var(--sheet);position:relative;cursor:pointer;transition:background .3s ease}input[type=checkbox]:after{content:"";position:absolute;top:3px;left:3px;width:21px;height:21px;border-radius:50%;background:var(--ink);transition:left .3s var(--ease-spring),background .3s ease}input[type=checkbox]:checked{background:var(--accent)}input[type=checkbox]:checked:after{left:29px;background:var(--paper)}.ticket-btn{position:relative;margin-top:6px;padding:21px 24px;font-family:var(--font-mono);font-size:.78rem;font-weight:700;letter-spacing:.34em;text-transform:uppercase;color:var(--paper);border:none;cursor:pointer;background:radial-gradient(circle 8px at 0 50%,var(--paper) 7px,transparent 8px),radial-gradient(circle 8px at 100% 50%,var(--paper) 7px,transparent 8px),var(--ink);box-shadow:5px 5px 0 var(--accent);transition:transform .25s var(--ease-spring),box-shadow .25s var(--ease-spring),opacity .2s ease}.ticket-btn:before{content:"";position:absolute;top:6px;right:14px;bottom:6px;left:14px;border:1px dashed rgba(244,238,224,.45);pointer-events:none}.ticket-btn:hover:not(:disabled){transform:translate(-2px,-2px);box-shadow:8px 8px 0 var(--accent)}.ticket-btn:active:not(:disabled){transform:translate(2px,2px);box-shadow:1px 1px 0 var(--accent)}.ticket-btn:disabled{opacity:.6;cursor:progress}.polaroid{width:min(248px,78%);margin:52px auto 0 4px;background:#fffdf6;padding:12px 12px 14px;box-shadow:0 2px 6px #26211a1f,0 14px 34px #26211a2e;transform:rotate(-3deg);position:relative;transition:transform .4s var(--ease-spring),box-shadow .4s ease;animation:polaroidDrop .8s var(--ease-spring) .6s backwards}.polaroid:hover{transform:rotate(-.5deg) translateY(-5px);box-shadow:0 4px 10px #26211a1f,0 22px 44px #26211a38}.polaroid img{width:100%;aspect-ratio:1;object-fit:cover;display:block;filter:saturate(.94) contrast(1.02)}.polaroid figcaption{font-family:var(--font-script);font-size:1.3rem;line-height:1.1;color:var(--ink-soft);text-align:center;padding-top:12px}.polaroid-tape{position:absolute;top:-13px;left:50%;width:92px;height:28px;transform:translate(-50%) rotate(-4deg);background:#e9dfcabf;border-left:1px dashed rgba(38,33,26,.18);border-right:1px dashed rgba(38,33,26,.18);box-shadow:0 1px 2px #26211a1a}.sheet{position:relative;overflow:hidden;background:var(--sheet);border:1px solid var(--ink-faint);box-shadow:0 1px 2px #26211a0f,0 24px 48px -24px #26211a66}.sheet:focus-within{outline:2px dashed var(--accent);outline-offset:5px}.sheet:before{content:"";position:absolute;top:0;bottom:0;left:58px;width:1px;background:var(--accent);opacity:.4;pointer-events:none}.hole-strip{position:absolute;top:0;bottom:0;left:18px;display:flex;flex-direction:column;justify-content:space-evenly;pointer-events:none}.sheet-hole{width:15px;height:15px;border-radius:50%;background:var(--paper);box-shadow:inset 0 1px 3px #26211a47,0 1px #ffffffb3}#generated-text{display:block;width:100%;height:clamp(420px,62vh,640px);padding:44px 48px 44px 88px;background:transparent;border:none;resize:none;font-family:var(--font-display);font-optical-sizing:auto;font-size:1.06rem;font-weight:420;line-height:2;letter-spacing:.005em;color:var(--ink);transition:opacity .3s ease}#generated-text:focus{outline:none}#generated-text::placeholder{color:var(--ink-soft);opacity:.75;font-style:italic}#generated-text::-webkit-scrollbar{width:10px}#generated-text::-webkit-scrollbar-track{background:transparent}#generated-text::-webkit-scrollbar-thumb{background:var(--ink-faint);border-radius:999px;border:2px solid var(--sheet)}#generated-text::-webkit-scrollbar-thumb:hover{background:var(--ink-soft)}.sheet.is-loading #generated-text{opacity:.45}.sheet.is-loading:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(100deg,transparent 32%,rgba(255,255,255,.55) 50%,transparent 68%);animation:sheen 1.5s ease-in-out infinite;pointer-events:none}@keyframes sheen{0%{transform:translate(-100%)}to{transform:translate(100%)}}.copy-btn{position:absolute;top:16px;right:16px;z-index:5;padding:9px 15px;font-family:var(--font-mono);font-size:.66rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--ink);background:var(--paper);border:1.5px solid var(--ink);box-shadow:2.5px 2.5px 0 var(--ink);cursor:pointer;transition:transform .15s var(--ease-out),box-shadow .15s var(--ease-out),background .2s ease,color .2s ease}.copy-btn:hover{transform:translate(-1px,-1px);box-shadow:3.5px 3.5px 0 var(--ink)}.copy-btn:active{transform:translate(2px,2px);box-shadow:0 0 0 var(--ink)}.copy-btn.copied{background:var(--accent);color:var(--paper)}.sheet-meta{margin-top:14px;text-align:right;font-size:.66rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-soft)}footer{margin-top:84px;border-top:2px solid var(--ink);padding:16px 2px 6px;display:flex;justify-content:space-between;gap:12px 24px;flex-wrap:wrap;font-size:.64rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-soft);animation:riseIn .9s var(--ease-out) .45s backwards}footer a{color:var(--ink);text-decoration:none;border-bottom:1.5px solid var(--accent);padding-bottom:2px;transition:color .2s ease}footer a:hover{color:var(--accent)}@keyframes riseIn{0%{opacity:0;transform:translateY(26px)}}@keyframes polaroidDrop{0%{opacity:0;transform:rotate(4deg) translateY(-26px)}}@keyframes spinStar{to{transform:rotate(360deg)}}@media (min-width: 900px){.webpage{padding:64px 56px 48px}.container{grid-template-columns:360px 1fr;gap:80px;align-items:start}.control-column{position:sticky;top:28px}}@media (min-width: 1280px){.webpage{max-width:1240px}.container{gap:96px}#generated-text{height:clamp(460px,64vh,700px);padding:48px 56px 48px 96px;font-size:1.125rem;line-height:2.05}.sheet:before{left:62px}.polaroid{width:min(264px,78%)}}@media (max-width: 899px){.webpage{padding:36px 20px 32px}header{margin-bottom:44px}.masthead-rule{font-size:.56rem;letter-spacing:.24em}.control-column{display:contents}#generator-form{order:1}.output-section{order:2}.polaroid{order:3;margin:12px auto 0;width:min(232px,84%)}.step-btn{width:42px;height:42px;font-size:1.15rem}.copy-btn{top:12px;right:12px;padding:10px 14px}#generated-text{height:min(440px,60vh);padding:52px 20px 28px 56px;font-size:1rem}.sheet:before{left:40px}.hole-strip{left:10px}.sheet-hole{width:12px;height:12px}footer{margin-top:56px;flex-direction:column;gap:10px}}@media (max-width: 600px){h1{font-size:clamp(4rem,20vw,5.5rem);margin-top:24px}h1 em{display:block}h1:after{content:none}h1 em:after{content:"✦";display:inline-block;font-style:normal;font-size:.24em;vertical-align:super;margin-left:.45em;animation:spinStar 14s linear infinite}.subtitle{font-size:1.3rem;margin-left:6px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.ticker-track{animation:none}}@media print{body:before,body:after,.ticker,.polaroid,.ticket-btn,.step-btn,.copy-btn,#generator-form{display:none}.webpage{max-width:100%;padding:20px}.sheet{border:1px solid #ddd;box-shadow:none}#generated-text{height:auto;min-height:400px}}
