:root{--kraft-1: #c4aa84;--kraft-2: #bd9968;--kraft-3: #a9824f;--kraft-deep:#8a653a;--ink: #3a2a18;--ink-soft: #5c4630;--ink-faint: #7a5f44;--ink-line: rgba(58, 42, 24, .3);--card: #e9ddc4;--card-2: #f2ead6;--card-edge: rgba(58, 42, 24, .16);--silver: #9aa0a6;--silver-lt: #c7ccd1;--silver-dk: #6f767d;--heart: #b2503f;--heart-dk: #8f3c2e;--gold: #b98a3e;--shadow-soft: 0 6px 22px rgba(58, 42, 24, .2);--shadow-card: 0 2px 10px rgba(58, 42, 24, .16);--font-script: "Great Vibes", cursive;--font-hand: "Caveat", cursive;--font-sans: "Montserrat", system-ui, sans-serif;--maxw: 460px}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;padding:0}body{font-family:var(--font-sans);color:var(--ink);background-color:#c3a886;background-image:url(/kraft-tile.jpg);background-size:560px auto;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}.kraft-bg{position:relative;background-color:#c3a886;background-image:url(/kraft-tile.jpg);background-size:560px auto;background-repeat:repeat}.kraft-bg:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(145% 125% at 50% 45%,transparent 74%,rgba(92,68,40,.1) 100%);z-index:0}.kraft-bg>*{position:relative;z-index:1}#root{min-height:100vh}.app-frame{width:100%;max-width:var(--maxw);margin:0 auto;min-height:100vh;position:relative;overflow-x:hidden}.desk{min-height:100vh;display:flex;justify-content:center}.script{font-family:var(--font-script);font-weight:400;line-height:1.22;background:linear-gradient(90deg,#2e3540,#484f57,#6a7278,#8a9299 30%,#c4ccd2 42%,#dde4ea,#c4ccd2 58%,#8a9299 70%,#6a7278,#484f57,#2e3540);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:silverWave 3.5s ease-in-out infinite}@keyframes silverWave{0%,to{background-position:100% 50%}50%{background-position:0% 50%}}.hand{font-family:var(--font-hand)}.silver-text{background:linear-gradient(158deg,#dadee2,#99a0a7 34%,#eef1f3 52%,#767d84 72%,#c3c9ce);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;text-shadow:0 1px 2px rgba(0,0,0,.28)}.label{font-family:var(--font-sans);text-transform:uppercase;letter-spacing:.34em;font-weight:600;font-size:11px;color:var(--ink-soft)}.label-lg{font-family:var(--font-sans);text-transform:uppercase;letter-spacing:.3em;font-weight:600;font-size:13px;color:var(--ink-soft)}.body{font-size:15px;line-height:1.65;color:var(--ink-soft)}.rule{display:flex;align-items:center;gap:12px;color:var(--ink-line)}.rule:before,.rule:after{content:"";height:1px;flex:1;background:linear-gradient(90deg,transparent,rgba(58,42,24,.35),transparent)}.btn{font-family:var(--font-sans);text-transform:uppercase;letter-spacing:.18em;font-weight:600;font-size:13px;border:none;cursor:pointer;border-radius:999px;padding:14px 26px;transition:transform .12s ease,box-shadow .2s ease,background .2s ease}.btn:active{transform:translateY(1px) scale(.99)}.btn-primary{background:var(--ink);color:#f3e8d2;box-shadow:var(--shadow-soft)}.btn-primary:hover{background:#2c2012}.btn-primary:disabled{opacity:.6;cursor:not-allowed}.btn-ghost{background:transparent;color:var(--ink);border:1.5px solid rgba(58,42,24,.45)}.btn-ghost:hover{background:#3a2a180f}.paper{background:var(--card);background-image:url(/paper-texture.svg);background-size:300px 300px;border-radius:4px;box-shadow:var(--shadow-card);border:1px solid var(--card-edge)}.tape{position:absolute;width:78px;height:24px;background:#d6c49e8c;box-shadow:0 1px 3px #00000026;border-left:1px dashed rgba(255,255,255,.4);border-right:1px dashed rgba(255,255,255,.4)}.polaroid{background:#f7f1e3;padding:10px 10px 0;box-shadow:0 8px 22px #281c0e52;border-radius:2px}.polaroid .photo{position:relative;overflow:hidden;background:#d9cdb2;border-radius:1px}.polaroid .caption{font-family:var(--font-hand);font-size:22px;color:var(--ink-soft);text-align:center;padding:6px 4px 12px;line-height:1}.ph{background-color:#d6c8aa;background-image:repeating-linear-gradient(45deg,rgba(58,42,24,.07) 0 8px,transparent 8px 16px);display:flex;align-items:center;justify-content:center;color:var(--ink-faint);font-family:Courier New,monospace;font-size:11px;letter-spacing:.15em;text-transform:uppercase}.field{width:100%;font-family:var(--font-sans);font-size:16px;color:var(--ink);background:#f7f1e3b3;border:1.5px solid rgba(58,42,24,.28);border-radius:10px;padding:14px 16px;outline:none;transition:border .2s,background .2s}.field:focus{border-color:var(--ink-soft);background:#f7f1e3f2}.field::placeholder{color:var(--ink-faint);opacity:.7}.nav{position:fixed;bottom:0;left:50%;transform:translate(-50%);width:min(100%,var(--maxw));z-index:40;display:grid;grid-template-columns:repeat(6,1fr);background:#3a2a18eb;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-top:1px solid rgba(255,240,210,.12);padding:8px 4px calc(8px + env(safe-area-inset-bottom))}.nav button{background:none;border:none;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:4px;color:#f3e8d29e;padding:4px 2px;transition:color .15s}.nav button.active{color:#f3e8d2}.nav button svg{width:22px;height:22px}.nav .nv-label{font-size:8.5px;letter-spacing:.12em;text-transform:uppercase;font-weight:600}.nav button.active .nv-dot{width:4px;height:4px;border-radius:50%;background:var(--silver-lt)}.nav .nv-dot{width:4px;height:4px}.topbar{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;position:sticky;top:0;z-index:30;background:linear-gradient(180deg,var(--kraft-1) 0%,var(--kraft-1) 52%,rgba(196,170,132,0) 100%);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.screen{padding:32px 18px calc(80px + env(safe-area-inset-bottom))}@keyframes fadeUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}.fade-up{animation:fadeUp .5s ease both}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes lbPop{0%{opacity:0;transform:scale(.88) rotate(var(--rot, 0deg))}to{opacity:1;transform:scale(1) rotate(var(--rot, 0deg))}}@media (prefers-reduced-motion: reduce){.fade-up{animation:none}.script{animation:none;background-position:50% 50%}}.cd-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.cd-cell{background:#f7f1e38c;border:1px solid rgba(58,42,24,.18);border-radius:10px;padding:12px 4px 8px;text-align:center}.cd-num{font-family:var(--font-sans);font-weight:300;font-size:30px;color:var(--ink);line-height:1;font-variant-numeric:tabular-nums}.cd-lbl{font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-faint);margin-top:6px;font-weight:600}.chip{font-family:var(--font-sans);font-size:12px;letter-spacing:.06em;padding:8px 14px;border-radius:999px;border:1.4px solid rgba(58,42,24,.3);background:transparent;color:var(--ink-soft);cursor:pointer;white-space:nowrap;transition:all .15s}.chip.on{background:var(--ink);color:#f3e8d2;border-color:var(--ink)}.player{position:relative;border-radius:16px;padding:22px 20px 20px;overflow:hidden}.seek{position:relative;height:6px;border-radius:999px;background:#3a2a1838;cursor:pointer}.seek .fill{position:absolute;left:0;top:0;bottom:0;border-radius:999px;background:var(--ink)}.seek .knob{position:absolute;top:50%;width:14px;height:14px;border-radius:50%;background:#f7f1e3;border:2px solid var(--ink);transform:translate(-50%,-50%);box-shadow:0 1px 4px #0000004d}.playbtn{width:64px;height:64px;border-radius:50%;background:var(--ink);color:#f3e8d2;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-soft);transition:transform .12s}.playbtn:active{transform:scale(.95)}.playbtn svg{width:26px;height:26px}.vol{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:4px;border-radius:999px;background:#3a2a1840;outline:none}.vol::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:var(--ink);cursor:pointer}.vol::-moz-range-thumb{width:14px;height:14px;border:none;border-radius:50%;background:var(--ink);cursor:pointer}.seek-range{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:44px;outline:none;display:block;background:transparent;cursor:pointer}.seek-range::-webkit-slider-runnable-track{height:6px;border-radius:999px;background:linear-gradient(to right,var(--ink) var(--seek-pct,0%),rgba(58,42,24,.22) var(--seek-pct,0%))}.seek-range::-webkit-slider-thumb{-webkit-appearance:none;width:28px;height:28px;border-radius:50%;background:#f7f1e3;border:2px solid var(--ink);cursor:pointer;box-shadow:0 1px 4px #0000004d;margin-top:-11px}.seek-range::-moz-range-track{height:6px;border-radius:999px;background:linear-gradient(to right,var(--ink) var(--seek-pct,0%),rgba(58,42,24,.22) var(--seek-pct,0%))}.seek-range::-moz-range-thumb{width:28px;height:28px;border:2px solid var(--ink);border-radius:50%;background:#f7f1e3;cursor:pointer;box-shadow:0 1px 4px #0000004d}.bubble{background:var(--card-2);border:1px solid var(--card-edge);border-radius:4px 14px 14px;padding:10px 14px;box-shadow:var(--shadow-card)}.bubble.me{border-radius:14px 4px 14px 14px;background:#e3d3ad}::-webkit-scrollbar{width:0;height:0}body[data-hidenav="1"] .nav{display:none}.linkrow{display:flex;align-items:center;gap:14px}.flank{display:none}@media (min-width: 600px){:root{--maxw: 680px}}@media (min-width: 900px){:root{--maxw: 860px}}@media (min-width: 1100px){:root{--maxw: 1020px}}@media (min-width: 1400px){.flank{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:40px;width:clamp(140px,15vw,240px);color:#fff0d280;padding:40px}}