/* Napkeen coming soon: shared look (Clear Look kit) */
:root{
  --indigo:#1F2A5C; --night:#141B3D; --marigold:#F2A33A; --cream:#F6F1E7; --paper:#FAF6EE;
  --mist:#E4E7F1; --glow:#FCE6C2; --sand:#E3D8C3; --white:#FFFFFF;
  --ink-soft:rgba(31,42,92,.72); --ink-faint:rgba(31,42,92,.16); --ink-hair:rgba(31,42,92,.08);
  --cream-soft:rgba(246,241,231,.74); --cream-faint:rgba(246,241,231,.18);
  --sans:"Outfit","Avenir Next","Segoe UI",system-ui,sans-serif;
  --serif:"Fraunces","Iowan Old Style",Georgia,serif;
}
*{box-sizing:border-box}
html,body{margin:0}
body{font-family:var(--sans);font-size:17px;line-height:1.5;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%}
h1,h2,h3,p,ul,ol,figure{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit}
button{font:inherit;color:inherit}
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--marigold);outline-offset:3px;border-radius:4px}
.wm{display:block;line-height:0}
.wm svg{display:block;width:100%;height:auto}
.btn{display:inline-flex;align-items:center;gap:10px;background:var(--marigold);color:var(--indigo);font:600 15.5px/1 var(--sans);padding:15px 20px;border-radius:8px;text-decoration:none;border:0;cursor:pointer;transition:transform .2s,box-shadow .2s;white-space:nowrap}
.btn:hover{transform:translateY(-1px);box-shadow:0 10px 22px -12px rgba(5,8,25,.55)}
.tlink{display:inline-flex;align-items:center;gap:8px;font-weight:500;text-decoration:none;white-space:nowrap}
.tlink i{font-style:normal;display:inline-block;transition:transform .25s}
.tlink:hover i{transform:translateX(4px)}
.kd{display:inline-block;width:16px;height:8px;border-radius:8px 8px 0 0;background:var(--marigold);flex:none}
/* intro plumbing */
.catch{position:fixed;inset:0;z-index:70;display:none;cursor:pointer}
html.intro-on .catch{display:block}
.skip{position:fixed;z-index:81;right:max(18px,env(safe-area-inset-right,0px));bottom:calc(18px + env(safe-area-inset-bottom,0px));display:none;background:none;border:0;font:500 13px var(--sans);color:var(--skip,currentColor);opacity:.75;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
html.intro-on .skip{display:block}
.toast{position:fixed;z-index:82;left:50%;top:18px;transform:translate(-50%,-14px);opacity:0;pointer-events:none;background:var(--night);color:var(--cream);font-size:13.5px;padding:10px 16px;border-radius:999px;box-shadow:0 10px 26px -10px rgba(5,8,25,.6);transition:opacity .25s,transform .35s cubic-bezier(.2,.8,.2,1);max-width:calc(100% - 32px)}
.toast.on{opacity:1;transform:translate(-50%,0)}
/* review bar (for choosing a concept; not part of the design) */
.review{position:fixed;z-index:80;left:max(12px,env(safe-area-inset-left,0px));bottom:calc(12px + env(safe-area-inset-bottom,0px));display:flex;align-items:center;gap:3px;background:var(--night);color:var(--cream);border-radius:999px;padding:5px;font-size:12.5px;box-shadow:0 10px 26px -10px rgba(5,8,25,.7),inset 0 0 0 1px rgba(246,241,231,.12);max-width:calc(100% - 24px);overflow-x:auto;scrollbar-width:none}
.review::-webkit-scrollbar{display:none}
.review .k{padding:0 6px 0 9px;color:var(--cream-soft);white-space:nowrap}
.review a,.review button{background:transparent;border:0;color:var(--cream);border-radius:999px;padding:7px 11px;font:500 12.5px var(--sans);cursor:pointer;white-space:nowrap;text-decoration:none}
.review [aria-current]{background:var(--cream);color:var(--indigo)}
.review .sep{width:1px;height:18px;background:var(--cream-faint);margin:0 3px;flex:none}
.review.center{left:50%;transform:translateX(-50%)}
@media (max-width:620px){.review .k,.review .nm{display:none}.review.center{left:max(12px,env(safe-area-inset-left,0px));transform:none}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.btn.ink{background:var(--indigo);color:var(--cream)}
/* the notify form */
.notify{position:relative;display:flex;align-items:center;gap:8px;width:min(100%,470px);padding:6px;border-radius:12px;background:#fff;box-shadow:inset 0 0 0 1.5px rgba(31,42,92,.18),0 18px 34px -26px rgba(31,42,92,.45);transition:box-shadow .25s}
.notify:focus-within{box-shadow:inset 0 0 0 1.5px var(--indigo),0 18px 34px -26px rgba(31,42,92,.45)}
.notify.bad{box-shadow:inset 0 0 0 1.5px #C2551F,0 18px 34px -26px rgba(31,42,92,.45)}
.notify input{flex:1;min-width:0;border:0;outline:0;background:transparent;font:400 16px var(--sans);color:var(--indigo);padding:10px 12px}
.notify input::placeholder{color:rgba(31,42,92,.42)}
.notify .btn{position:relative;overflow:hidden;padding:13px 18px;font-size:15px}
.notify .btn span{display:block;transition:transform .45s cubic-bezier(.2,.8,.2,1),opacity .3s}
.notify .btn .t2{position:absolute;left:0;right:0;top:50%;transform:translateY(60%);opacity:0;text-align:center}
.notify.ok .btn .t1{transform:translateY(-140%);opacity:0}
.notify.ok .btn .t2{transform:translateY(-50%);opacity:1}
.notify.ok input{opacity:.55}
.notify-note{margin-top:10px;font-size:12.5px;color:var(--ink-soft)}
.notify-note .ok{display:none}
.notify.ok+.notify-note .ok{display:inline}
.notify.ok+.notify-note .wait{display:none}
@media (max-width:520px){.notify{flex-direction:column;align-items:stretch;padding:8px}.notify .btn{justify-content:center}}