.route-skeleton{--skeleton-ink:#e8e2d9;background:#f6f4ef;min-height:100dvh;overflow:hidden}.route-skeleton__sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}.route-skeleton__header{border-bottom:1px solid #dfddd6;grid-template-columns:minmax(110px,1fr) auto minmax(110px,1fr);align-items:center;gap:24px;min-height:62px;padding:10px clamp(24px,4vw,64px);display:grid}.route-skeleton__brand,.route-skeleton__nav,.route-skeleton__action,.route-skeleton__line,.route-skeleton__control,.route-skeleton__button,.route-skeleton__showcase,.route-skeleton__article-lines span{background:var(--skeleton-ink);border-radius:8px;display:block}.route-skeleton__brand{width:min(172px,100%);height:34px}.route-skeleton__nav{width:180px;height:18px}.route-skeleton__action{border-radius:999px;justify-self:end;width:116px;height:38px}.route-skeleton__landing{grid-template-columns:minmax(0,.92fr) minmax(0,1fr);align-items:center;gap:clamp(36px,5vw,76px);width:min(100% - 64px,1320px);min-height:min(620px,100dvh - 62px);margin-inline:auto;padding-block:48px;display:grid}.route-skeleton__landing-copy{justify-items:start;gap:17px;display:grid}.route-skeleton__line--short{width:36%;height:12px}.route-skeleton__line--title{border-radius:12px;width:78%;height:clamp(42px,5vw,68px)}.route-skeleton__line--wide{width:92%}.route-skeleton__line--body{width:72%;height:14px}.route-skeleton__button{border-radius:999px;width:178px;height:46px;margin-top:10px}.route-skeleton__showcase{aspect-ratio:16/10;background:#eee8df;border:1px solid #dfddd6;border-radius:20px;width:100%;padding:12px}.route-skeleton__showcase>span{background:#e2dbd1;border-radius:12px;width:100%;height:100%;display:block}.route-skeleton__control{background:#fffdf9;border:1px solid #d7c8bd;border-radius:11px;width:100%;height:42px}.route-skeleton__reference{width:min(100% - 48px,840px);margin:clamp(50px,9vh,104px) auto}.route-skeleton__line--eyebrow{width:100px;height:12px;margin-bottom:18px}.route-skeleton__line--reference-title{width:min(100%,580px);height:clamp(38px,5vw,58px);margin-bottom:20px}.route-skeleton__profile-form{background:#fffdf8;border:1px solid #dfddd6;border-radius:16px;gap:14px;width:min(100%,520px);margin-top:40px;padding:24px;display:grid}.route-skeleton__profile-form .route-skeleton__button{margin-top:4px}.route-skeleton__article-lines{gap:14px;margin-top:40px;display:grid}.route-skeleton__article-lines span{width:100%;height:16px}.route-skeleton__article-lines span:last-child{width:66%}@media (max-width:900px) and (min-width:761px){.route-skeleton__landing{grid-template-columns:1fr 1fr;gap:36px}}@media (max-width:760px){.route-skeleton__header{grid-template-columns:minmax(90px,1fr) auto;gap:10px;min-height:60px;padding-inline:18px}.route-skeleton__nav{display:none}.route-skeleton__landing{flex-direction:column;align-items:stretch;gap:42px;width:min(100% - 36px,560px);padding-block:58px;display:flex}.route-skeleton__landing-copy{gap:14px}.route-skeleton__showcase{align-self:end;width:calc(100% - 14px)}.route-skeleton__reference{margin-block:44px}.route-skeleton__profile-form{padding:18px}}.route-load-error{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:1rem;min-height:100vh;padding:2rem;display:flex}.route-load-error p{margin:0}.app-shell{background:#f6f4ef;flex-direction:column;height:100dvh;min-height:100dvh;display:flex;overflow:hidden}.topbar{border-bottom:1px solid #dfddd6;flex:none;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;padding:12px clamp(24px,3vw,48px);display:grid;position:relative}.brand-mark{color:#303545;letter-spacing:-.03em;align-items:center;gap:10px;width:min(172px,100%);min-width:0;max-width:172px;font-size:14px;font-weight:900;text-decoration:none;display:flex}.brand-mark:visited{color:#303545;text-decoration:none}.brand-mark:hover{color:#bf563f;text-decoration:none}.brand-mark:focus-visible{outline-offset:4px;border-radius:8px;outline:2px solid #ef815e}.brand-mark>img{border-radius:10px;place-items:center;width:34px;height:34px;display:grid}.brand-mark>span{text-overflow:ellipsis;white-space:nowrap;min-width:0;margin:0;display:block;overflow:hidden}.github-link{color:#303545;font-size:13px;font-weight:800;text-decoration:none}.header-profile-link{color:#303545;font-size:12px;font-weight:800;text-decoration:none}.header-profile-link:hover,.header-profile-link:focus-visible{color:#bf563f}.icon-button{color:#303545;cursor:pointer;width:36px;min-width:36px;height:36px;min-height:36px;font:inherit;background:#fffdf8;border:1px solid #cecbc2;border-radius:999px;flex:none;place-items:center;padding:0;transition:border-color .12s,background-color .12s,color .12s,box-shadow .12s,transform .16s cubic-bezier(.2,.8,.2,1);display:inline-grid;position:relative}.icon-button:hover:not(:disabled){color:#9a3d31;background:#fff7ef;border-color:#ef815e;transform:translateY(-1px);box-shadow:0 4px 12px #3035451c}.icon-button[data-icon-motion=nudge]:hover:not(:disabled)>svg{transform:scale(1.06)}.icon-button[data-icon-motion=rotate]:hover:not(:disabled)>svg{transform:rotate(14deg)scale(1.03)}.icon-button[data-icon-motion=scale]:hover:not(:disabled)>svg{transform:scale(1.08)}.icon-button>svg{transform-origin:50%;transition:transform .12s}.icon-button:focus-visible{outline-offset:-2px;border-color:#9a3d31;outline:2px solid #9a3d31}.icon-button:active:not(:disabled){transform:scale(.97)}.icon-button:disabled{cursor:not-allowed;opacity:.52}.export-header-button{color:#fff;background:#ef815e;border:0;box-shadow:0 5px 12px #ef815e38}.topbar-export-actions{align-items:center;gap:8px;display:flex;position:absolute;left:calc(50% - 18px)}.share-header-button{background:#fffdf8}.icon-button.export-header-button:hover:not(:disabled){background:#d96547}.icon-button.export-header-button:hover:not(:disabled),.icon-button.export-header-button:focus-visible{color:#fff7ef}.icon-button[data-icon-motion=nudge]:active:not(:disabled)>svg{transform:translate(1px)scale(.94)}.icon-button[data-icon-motion=rotate]:active:not(:disabled)>svg{transform:rotate(-28deg)scale(.94)}.icon-button[data-icon-motion=scale]:active:not(:disabled)>svg{transform:scale(.9)}.account-menu{position:relative}.account-button,.account-popover button{color:#303545;background:#fffdf8;border:1px solid #cecbc2;border-radius:8px;padding:6px 9px;font-size:11px;font-weight:800}.account-button:hover,.account-popover button:hover{border-color:#ef815e}.account-popover{z-index:20;color:#303545;background:#fffdf8;border:1px solid #d5d0c7;border-radius:12px;width:230px;padding:12px;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 14px 36px #3035452b}.account-form,.project-list{gap:7px;display:grid}.account-form input{color:#303545;background:#fff;border:1px solid #cecbc2;border-radius:7px;width:100%;min-height:32px;padding:5px 7px;font-size:11px}.account-form button,.project-list button{width:100%}.account-error{color:#b33d2f;line-height:1.25}.project-list{max-height:180px;margin:8px 0;overflow:auto}.topbar-actions{grid-column:3;justify-self:end;align-items:center;gap:12px;display:flex}.randomize-header-button,.undo-header-button{background:#fffdf8}.language-picker{flex:none;display:inline-flex;position:relative}.language-picker-trigger{white-space:nowrap;justify-content:center;align-items:center;gap:6px;width:auto;min-width:76px;max-width:100%;padding:0 10px;font-size:11px;font-weight:800;display:inline-flex}.language-picker-trigger[aria-expanded=true]>svg{transform:rotate(180deg)}.language-picker-flag,.language-picker-option-flag{font-size:17px;line-height:1}.language-picker-code{color:#555b68;letter-spacing:.08em;font-size:10px}.language-picker-menu{z-index:30;background:#fffdf8;border:1px solid #cecbc2;border-radius:14px;gap:3px;width:max-content;min-width:190px;padding:7px;display:grid;position:absolute;top:calc(100% + 8px);right:0;box-shadow:0 14px 36px #3035452b}.language-picker-option{color:#303545;cursor:pointer;min-height:42px;font:inherit;border:1px solid #0000;border-radius:9px;align-items:center;gap:9px;padding:7px 10px;font-size:11px;font-weight:800;display:flex}.language-picker-option svg{color:#bf563f;margin-left:auto}.language-picker-option:hover,.language-picker-option:focus-visible,.language-picker-option.selected{color:#9a3d31;background:#fff7ef;border-color:#ef815e}.language-picker-option:focus-visible{outline:none;box-shadow:inset 0 0 0 2px #ef815e}@media (prefers-reduced-motion:reduce){.icon-button,.icon-button>svg{transition:none}.icon-button:active:not(:disabled){transform:none}.icon-button:hover:not(:disabled){box-shadow:none;transform:none}.icon-button[data-icon-action=randomize]:active:not(:disabled) svg,.icon-button[data-icon-action=reset]:active:not(:disabled) svg,.icon-button[data-icon-motion=nudge]:hover:not(:disabled)>svg,.icon-button[data-icon-motion=rotate]:hover:not(:disabled)>svg,.icon-button[data-icon-motion=scale]:hover:not(:disabled)>svg,.icon-button[data-icon-motion=nudge]:active:not(:disabled)>svg,.icon-button[data-icon-motion=rotate]:active:not(:disabled)>svg,.icon-button[data-icon-motion=scale]:active:not(:disabled)>svg{transform:none}}@media (max-width:760px){.icon-button{width:44px;min-width:44px;height:44px;min-height:44px}}.analytics-consent{z-index:20;color:#fff9ef;background:#202735;border:1px solid #566174;border-radius:1rem;align-items:center;gap:1.25rem;max-width:min(42rem,100vw - 2rem);padding:1rem 1.1rem;display:flex;position:fixed;bottom:1rem;right:1rem;box-shadow:0 1rem 3rem #12161f61}.analytics-consent h2,.analytics-consent p{margin:0}.analytics-consent h2{font-size:.95rem}.analytics-consent p{color:#d7dbe2;max-width:30rem;margin-top:.25rem;font-size:.8rem;line-height:1.45}.analytics-consent a{color:#ffd1bd;font-weight:800}.analytics-consent a:hover,.analytics-consent a:focus-visible{color:#fff}.analytics-consent-actions{flex-shrink:0;gap:.5rem;display:flex}.analytics-consent-actions button{min-height:2.4rem;font:inherit;cursor:pointer;border-radius:.6rem;padding:.45rem .75rem;font-size:.78rem;font-weight:700}.analytics-consent-decline{color:#f1f3f5;background:0 0;border:1px solid #8791a2}.analytics-consent-accept{color:#fff;background:#a33e33;border:1px solid #a33e33}.analytics-consent-actions button:focus-visible{outline-offset:2px;outline:2px solid #ffd1bd}.analytics-consent-accept:hover,.analytics-consent-accept:focus-visible{background:#8f342d;border-color:#8f342d}@media (max-width:640px){.analytics-consent{flex-direction:column;align-items:stretch;gap:.75rem;bottom:.75rem;right:.75rem}.analytics-consent-actions{justify-content:flex-end}}:root{--color-cream:#f6f4ef;--color-surface:#fffdf8;--color-ink:#202433;--color-slate:#303545;--color-muted:#8a8d95;--color-terracotta:#ef815e;--color-terracotta-dark:#9a3d31;--radius-control:9px;--radius-pill:999px;--focus-ring:2px solid var(--color-terracotta-dark)}@font-face{font-family:OpenNunito;src:url(/fonts/nunito.ttf)format("truetype");font-weight:100 900;font-display:swap}@font-face{font-family:OpenQuicksand;src:url(/fonts/quicksand.ttf)format("truetype");font-weight:100 900;font-display:swap}@font-face{font-family:OpenFredoka;src:url(/fonts/fredoka.ttf)format("truetype");font-weight:100 900;font-display:swap}@font-face{font-family:OpenOswald;src:url(/fonts/oswald.ttf)format("truetype");font-weight:100 900;font-display:swap}@font-face{font-family:OpenBree;src:url(/fonts/bree-serif.ttf)format("truetype");font-display:swap}@font-face{font-family:OpenBaloo;src:url(/fonts/baloo2.ttf)format("truetype");font-weight:100 900;font-display:swap}@font-face{font-family:OpenKalam;src:url(/fonts/kalam.ttf)format("truetype");font-weight:100 900;font-display:swap}@font-face{font-family:OpenBungee;src:url(/fonts/bungee.ttf)format("truetype");font-display:swap}@font-face{font-family:OpenRubik;src:url(/fonts/rubik.ttf)format("truetype");font-weight:100 900;font-display:swap}@font-face{font-family:OpenMontserrat;src:url(/fonts/montserrat.ttf)format("truetype");font-weight:100 900;font-display:swap}@font-face{font-family:OpenCaveat;src:url(/fonts/caveat.ttf)format("truetype");font-weight:100 900;font-display:swap}@font-face{font-family:OpenMarck;src:url(/fonts/marck-script.ttf)format("truetype");font-display:swap}@font-face{font-family:OpenBadScript;src:url(/fonts/bad-script.ttf)format("truetype");font-display:swap}@font-face{font-family:OpenNeucha;src:url(/fonts/neucha.ttf)format("truetype");font-display:swap}@font-face{font-family:OpenAmatic;src:url(/fonts/amatic-sc.ttf)format("truetype");font-weight:400 700;font-display:swap}@font-face{font-family:OpenLobster;src:url(/fonts/lobster.ttf)format("truetype");font-display:swap}@font-face{font-family:OpenPangolin;src:url(/fonts/pangolin.ttf)format("truetype");font-display:swap}@font-face{font-family:OpenPlaypen;src:url(/fonts/playpen-sans.ttf)format("truetype");font-weight:100 800;font-display:swap}@font-face{font-family:OpenShantell;src:url(/fonts/shantell-sans.ttf)format("truetype");font-weight:300 800;font-display:swap}@font-face{font-family:OpenBalsamiq;src:url(/fonts/balsamiq-sans.ttf)format("truetype");font-weight:400;font-display:swap}@font-face{font-family:OpenComforter;src:url(/fonts/comforter.ttf)format("truetype");font-weight:400;font-display:swap}@font-face{font-family:OpenComforterBrush;src:url(/fonts/comforter-brush.ttf)format("truetype");font-weight:400;font-display:swap}@font-face{font-family:OpenUnderdog;src:url(/fonts/underdog.ttf)format("truetype");font-weight:400;font-display:swap}:root{color:#202433;font-synthesis:none;background:#f6f4ef;font-family:OpenNunito,system-ui,sans-serif}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}button,input{font:inherit}button{cursor:pointer}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}
