/* Imediato — night-watch chart room. Ink and brass after dark, chart paper by day.
   Big type and big targets: read at arm's length on a moving deck, one thumb. */
:root{
  --bg:#efe8da; --bg2:#e6dcc8; --card:#fbf7ee; --card2:#f4ecdc; --line:#d3c6ac; --fg:#13202e; --mut:#56616b; --dim:#8d9196;
  --brass:#9a5f0c; --brass2:#c07a14; --sea:#0d7466; --ask:#8a6a00; --askbg:#fff3c4; --sig:#c8361a; --sigbg:#fde3da; --off:#9aa0a6;
  --grid:rgba(19,32,46,.055); --shadow:0 1px 0 rgba(255,255,255,.7) inset,0 6px 18px -10px rgba(40,30,10,.35);
  --disp:"Big Shoulders Display","Arial Narrow",sans-serif; --body:"Atkinson Hyperlegible",system-ui,sans-serif; --mono:"JetBrains Mono",ui-monospace,monospace;
  --r:14px;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#0a0f14; --bg2:#0e151c; --card:#111a23; --card2:#15202b; --line:#22313f; --fg:#ece5d6; --mut:#8e9aa5; --dim:#55626f;
  --brass:#e3a94e; --brass2:#f3c77a; --sea:#4fc6b3; --ask:#f2d35e; --askbg:#2a2510; --sig:#ff6a48; --sigbg:#2c1510; --off:#4a5560;
  --grid:rgba(227,169,78,.045); --shadow:0 1px 0 rgba(255,255,255,.03) inset,0 10px 28px -14px rgba(0,0,0,.9);
}}
:root[data-theme="dark"]{
  --bg:#0a0f14; --bg2:#0e151c; --card:#111a23; --card2:#15202b; --line:#22313f; --fg:#ece5d6; --mut:#8e9aa5; --dim:#55626f;
  --brass:#e3a94e; --brass2:#f3c77a; --sea:#4fc6b3; --ask:#f2d35e; --askbg:#2a2510; --sig:#ff6a48; --sigbg:#2c1510; --off:#4a5560;
  --grid:rgba(227,169,78,.045); --shadow:0 1px 0 rgba(255,255,255,.03) inset,0 10px 28px -14px rgba(0,0,0,.9);
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{
  background:var(--bg); color:var(--fg); font:17px/1.45 var(--body); -webkit-text-size-adjust:100%; overflow-x:hidden;
  -webkit-tap-highlight-color:transparent;
  background-image:
    radial-gradient(120% 60% at 50% 110%, color-mix(in srgb,var(--brass) 10%,transparent), transparent 60%),
    linear-gradient(var(--grid) 1px, transparent 1px), linear-gradient(90deg, var(--grid) 1px, transparent 1px);
  background-size:100% 100%, 44px 44px, 44px 44px; background-attachment:fixed;
}
body::after{ /* grain */
  content:""; position:fixed; inset:0; pointer-events:none; opacity:.07; mix-blend-mode:overlay; z-index:50;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
a{color:var(--brass)}
button{font:inherit;color:inherit}
[hidden]{display:none!important}
svg{display:block}

.app{display:flex;flex-direction:column;min-height:100dvh;max-width:640px;margin:0 auto;padding:0 16px}

/* header */
.top{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:10px;padding:max(10px,env(safe-area-inset-top)) 0 10px;
  background:linear-gradient(var(--bg) 70%, transparent)}
.brand{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--fg)}
.rose{width:26px;height:26px;color:var(--brass)}
.word{font:800 22px/1 var(--disp);letter-spacing:.22em}
.light{width:10px;height:10px;border-radius:50%;background:var(--sig);box-shadow:0 0 10px var(--sig);transition:background .3s,box-shadow .3s}
.light.on{background:#3fd27a;box-shadow:0 0 10px #3fd27a}   /* starboard green */
.light.wait{background:var(--brass);box-shadow:0 0 8px var(--brass);animation:blink 1s steps(2) infinite}
.sp{flex:1}
.navbtn{width:44px;height:44px;display:grid;place-items:center;border-radius:12px;color:var(--mut)}
.navbtn svg{width:24px;height:24px}
.navbtn:active{background:var(--card2)}

.view{flex:1;padding-bottom:16px;animation:rise .35s cubic-bezier(.2,.8,.2,1)}
#v-board{padding-bottom:12px}

/* section headers */
.sec-h{display:flex;align-items:baseline;gap:10px;margin:14px 2px 8px;font:700 13px/1 var(--disp);letter-spacing:.24em;text-transform:uppercase;color:var(--mut);list-style:none;cursor:default}
.sec-h::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--line),transparent);transform:translateY(-3px)}
.sec-h b{font:600 12px/1 var(--mono);letter-spacing:0;color:var(--dim);order:2}
.sec-h span{order:0}
details.recent > summary{cursor:pointer}
details.recent > summary::-webkit-details-marker{display:none}
details.recent > summary span::before{content:"▸ ";display:inline-block;transition:transform .2s}
details.recent[open] > summary span::before{content:"▾ "}

/* cards */
.cards{display:flex;flex-direction:column;gap:10px}
.card{position:relative;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px 12px 18px;box-shadow:var(--shadow);
  overflow:hidden;animation:rise .4s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i,0)*50ms)}
.card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--flag,var(--dim))}
.card .tap{position:absolute;inset:0;z-index:0}
.card .body > *:not(.tap),.card > form{position:relative;z-index:1}
.card .hd{display:flex;align-items:center;gap:8px;flex-wrap:wrap;pointer-events:none}
.label{font:800 21px/1.05 var(--disp);letter-spacing:.06em;text-transform:uppercase}
.chip{font:600 11px/1 var(--mono);padding:4px 7px;border-radius:6px;border:1px solid var(--line);color:var(--mut);text-transform:lowercase}
.chip.host{border-style:dashed}
.chip.host.down{color:var(--sig);border-color:color-mix(in srgb,var(--sig) 50%,transparent)}
.chip.quiet{color:var(--brass);border-color:color-mix(in srgb,var(--brass) 45%,transparent)}
.when{margin-left:auto;font:400 12px/1 var(--mono);color:var(--dim);font-variant-numeric:tabular-nums}
.title{margin:4px 0 0;color:var(--mut);font-size:15px;pointer-events:none}
.act{margin:8px 0 0;font-size:16px;pointer-events:none;overflow-wrap:anywhere}
.act .tl{display:block;margin-top:2px;font:400 12px/1.3 var(--mono);color:var(--dim)}
.st{display:flex;margin-top:6px;align-items:center;gap:6px;font:700 12px/1 var(--disp);letter-spacing:.18em;text-transform:uppercase;color:var(--flag)}
.btns{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.btn{appearance:none;border:1px solid var(--line);background:var(--card2);color:var(--fg);min-height:44px;padding:0 16px;border-radius:12px;font:700 15px/1 var(--body);cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;touch-action:manipulation}
.btn:active{transform:translateY(1px)}
.btn:disabled{opacity:.4}
.btn.primary{background:var(--brass);border-color:var(--brass);color:var(--bg)}
.btn.ghost{background:transparent}
.btn.allow{background:var(--sea);border-color:var(--sea);color:var(--bg);flex:1;font-size:17px;min-height:52px}
.btn.deny{background:transparent;border-color:var(--sig);color:var(--sig);flex:1;font-size:17px;min-height:52px}
.btn.sm{min-height:38px;padding:0 12px;font-size:14px}

/* states (Table 8) */
.s-starting{--flag:var(--dim)}
.s-running{--flag:var(--sea)}
.s-running .st i,.s-starting .st i{width:8px;height:8px;border-radius:50%;background:var(--flag);animation:pulse 1.6s ease-in-out infinite}
.s-running.is-quiet{--flag:color-mix(in srgb,var(--sea) 45%,var(--dim))}
.s-running.is-quiet .st i{animation-duration:4s}
.s-waiting_user{--flag:var(--ask)}
.card.s-waiting_user{border-color:var(--ask);background:linear-gradient(180deg,var(--askbg),var(--card) 70%);box-shadow:0 0 0 1px var(--ask),var(--shadow)}
.s-waiting_user .q{font-size:18px;font-style:italic;margin:8px 0 0;pointer-events:none}
.s-waiting_user .q::before{content:"“"}.s-waiting_user .q::after{content:"”"}
.s-waiting_approval{--flag:var(--sig)}
.card.s-waiting_approval{border-color:var(--sig);background:var(--sigbg);box-shadow:0 0 0 1px var(--sig),var(--shadow)}
.card.s-waiting_approval::before{width:7px;background:repeating-linear-gradient(-45deg,var(--sig) 0 6px,var(--bg) 6px 12px)}
.perm{margin:10px 0 0;padding:10px 12px;border-radius:10px;background:color-mix(in srgb,var(--bg) 60%,transparent);border:1px solid color-mix(in srgb,var(--sig) 40%,transparent);font:400 14px/1.4 var(--mono);white-space:pre-wrap;overflow-wrap:anywhere;max-height:9em;overflow:auto}
.count{font:600 13px/1 var(--mono);color:var(--sig)}
.s-done.unread{--flag:var(--brass);border-color:color-mix(in srgb,var(--brass) 60%,var(--line))}
.s-done.unread .label::after{content:"";display:inline-block;width:9px;height:9px;margin-left:8px;border-radius:50%;background:var(--brass);box-shadow:0 0 10px var(--brass);vertical-align:middle}
.branch{display:inline-flex;align-items:center;gap:6px;margin-top:8px;font:600 13px/1 var(--mono);color:var(--sea);pointer-events:none}
.branch::before{content:"⑂";font-size:15px}
.s-failed,.s-cancelled{--flag:var(--dim)}
.card.s-failed,.card.s-cancelled{opacity:.78}
.s-failed .label,.s-cancelled .label{text-decoration:line-through;text-decoration-thickness:2px;color:var(--mut)}
.s-failed .err{color:var(--sig);font:400 13px/1.35 var(--mono);margin-top:6px;pointer-events:none}
.s-unreachable{--flag:var(--off)}
.card.s-unreachable{filter:grayscale(1);opacity:.6}

.reply{display:flex;gap:8px;margin-top:10px}
.reply input{flex:1;min-width:0;font:inherit;font-size:16px;padding:12px 14px;border-radius:12px;border:1px solid var(--line);background:var(--bg);color:var(--fg)}
.reply input:focus,textarea:focus,input:focus{outline:2px solid var(--brass);outline-offset:1px}
.reply button{border:0;border-radius:12px;padding:0 18px;background:var(--brass);color:var(--bg);font-weight:700;min-height:46px;cursor:pointer}

/* compact rows (done/read, recent) */
.rows{display:flex;flex-direction:column}
.rowi{display:grid;grid-template-columns:auto 1fr auto;gap:2px 10px;align-items:baseline;padding:11px 4px;border-bottom:1px dashed var(--line);text-decoration:none;color:var(--fg);min-height:48px}
.rowi .label{font-size:16px;letter-spacing:.08em}
.rowi .sum{grid-column:1/-1;color:var(--mut);font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rowi .when{margin:0}
.rowi .mk{font:600 11px/1 var(--mono);color:var(--dim)}
.rowi .mk.br{color:var(--sea)}
.rowi.x .label{text-decoration:line-through;color:var(--mut)}

.empty{text-align:center;color:var(--mut);padding:34px 10px 10px}
.empty svg{width:64px;height:64px;margin:0 auto 10px;color:var(--brass);opacity:.6;animation:spin 60s linear infinite}
.empty p{font:800 24px/1 var(--disp);letter-spacing:.1em;text-transform:uppercase;color:var(--fg);margin:0 0 6px}

/* talk dock */
.dock{position:sticky;bottom:0;z-index:6;margin:0 -16px;padding:26px 16px max(10px,env(safe-area-inset-bottom));
  background:linear-gradient(transparent,var(--bg) 28px);}
.dock::before{content:"";position:absolute;left:16px;right:16px;top:30px;height:1px;background:linear-gradient(90deg,transparent,var(--line),transparent)}
.line{position:relative;min-height:56px;padding:10px 4px 4px;text-align:center}
.line .you{font-size:14px;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.line .you.partial{font-style:italic;color:var(--dim)}
.line .you:not(:empty)::before{content:"you · ";font:600 11px var(--mono);color:var(--dim)}
.line .mate{font-size:18px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.line .mate.idle{color:var(--mut);font-size:15px}
.line .tool{min-height:16px;font:400 12px/1.3 var(--mono);color:var(--brass)}
.typed{margin:2px 0 6px}
.typed input{width:100%;font:inherit;font-size:16px;padding:10px 14px;border-radius:22px;border:1px solid var(--line);background:var(--card);color:var(--fg)}
.controls{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px}
.side{justify-self:center;width:62px;height:62px;border-radius:50%;border:1px solid var(--line);background:var(--card);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;cursor:pointer;touch-action:manipulation;box-shadow:var(--shadow)}
.side svg{width:22px;height:22px}
.side span{font:700 10px/1 var(--disp);letter-spacing:.18em;text-transform:uppercase;color:var(--mut)}
.side:disabled{opacity:.35}
.side[aria-pressed="true"]{background:var(--ask);border-color:var(--ask);color:#111}
.side[aria-pressed="true"] span{color:#111}
#plus{background:var(--card2);color:var(--brass)}
.talkwrap{display:flex;flex-direction:column;align-items:center;gap:6px}
.talk{--lvl:0;--c:var(--brass);position:relative;width:118px;height:118px;border-radius:50%;border:0;cursor:pointer;touch-action:manipulation;
  background:radial-gradient(circle at 50% 38%,color-mix(in srgb,var(--c) 85%,#fff 15%),var(--c) 60%,color-mix(in srgb,var(--c) 70%,#000) 100%);
  color:var(--bg);box-shadow:0 0 0 calc(6px + var(--lvl)*26px) color-mix(in srgb,var(--c) 22%,transparent),0 14px 30px -12px color-mix(in srgb,var(--c) 70%,#000);
  transition:box-shadow 80ms linear,transform .15s}
.talk:active{transform:scale(.97)}
.talk .ticks{position:absolute;inset:-14px;border-radius:50%;pointer-events:none;opacity:.55;
  background:repeating-conic-gradient(var(--c) 0 1.2deg,transparent 1.2deg 10deg);
  -webkit-mask:radial-gradient(circle,transparent 62%,#000 63%,#000 70%,transparent 71%);mask:radial-gradient(circle,transparent 62%,#000 63%,#000 70%,transparent 71%)}
.talk .lbl{position:relative;font:900 26px/1 var(--disp);letter-spacing:.12em;text-transform:uppercase}
.talk.on{--c:var(--sea)}
.talk.on.thinking{--c:var(--brass2)}
.talk.on.thinking .ticks{animation:spin 3s linear infinite;opacity:.9}
.talk.on.speaking{--c:var(--brass)}
.talk.on.speaking .ticks{animation:spin 9s linear infinite reverse}
.talk.on.connecting .ticks{animation:spin 1.2s linear infinite}
.talk:disabled{--c:var(--dim);cursor:default}
.state{font:800 13px/1 var(--disp);letter-spacing:.3em;text-transform:uppercase;color:var(--mut);min-height:13px}
.state.listening{color:var(--sea)}.state.thinking{color:var(--brass2)}.state.speaking{color:var(--brass)}

/* detail */
.back{display:inline-flex;align-items:center;min-height:44px;font:700 15px var(--disp);letter-spacing:.16em;text-transform:uppercase;text-decoration:none;color:var(--mut)}
.d-head{border-left:5px solid var(--flag,var(--dim));padding:2px 0 2px 12px;margin:4px 0 12px}
.d-head .label{font-size:32px}
.d-head .meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px;align-items:center}
.d-head .ttl{color:var(--mut);margin-top:6px}
.log{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.log li{padding:10px 12px;border-radius:12px;background:var(--card);border:1px solid var(--line);white-space:pre-wrap;overflow-wrap:anywhere;font-size:16px}
.log li .ts{display:block;font:400 11px/1 var(--mono);color:var(--dim);margin-bottom:4px}
.log li.agent{white-space:normal}
.log .md>:first-child{margin-top:0}.log .md>:last-child{margin-bottom:0}
.log .md p,.log .md ul,.log .md ol,.log .md pre,.log .md blockquote,.log .md h3,.log .md h4,.log .md h5,.log .md h6{margin:0 0 10px}
.log .md ul,.log .md ol{padding-left:22px}.log .md li{margin:3px 0}
.log .md h3,.log .md h4,.log .md h5,.log .md h6{font-size:16px;font-weight:600;line-height:1.3}.log .md h3{font-size:17px}
.log .md code{font:400 14px/1.4 var(--mono);background:color-mix(in srgb,var(--line) 60%,transparent);padding:1px 5px;border-radius:5px;overflow-wrap:anywhere}
.log .md pre{background:color-mix(in srgb,var(--line) 45%,transparent);border:1px solid var(--line);border-radius:10px;padding:10px 12px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.log .md pre code{background:none;padding:0;white-space:pre;overflow-wrap:normal}
.log .md blockquote{border-left:3px solid var(--line);padding:2px 12px;color:var(--dim)}
.log .md a{color:var(--brass);text-decoration:underline}
.log .md hr{border:0;border-top:1px solid var(--line);margin:10px 0}
.log .md input[type=checkbox]{vertical-align:middle;margin:0 4px 0 0}
.log li.user{background:transparent;border-style:dashed;margin-left:12%}
.log li.user .ts::after{content:" · you"}
.log li.tool{background:transparent;border:0;padding:2px 12px;font:400 13px/1.35 var(--mono);color:var(--brass)}
.log li.tool .ts{display:inline;margin-right:8px}
.log li.tool::before{content:"⚙ "}
.log li.system{background:transparent;border:0;text-align:center;color:var(--mut);font-size:13px}
.d-actions{display:flex;gap:8px;margin:14px 0}
.sticky{position:sticky;bottom:calc(178px + env(safe-area-inset-bottom));z-index:4;padding:8px;margin:0 -8px;border-radius:16px;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(6px)}

/* settings + memory */
.pg{font:900 40px/1 var(--disp);letter-spacing:.08em;text-transform:uppercase;margin:6px 0 14px}
.note{color:var(--mut);margin:-6px 0 14px}
.settings{display:flex;flex-direction:column;gap:2px}
.fld{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 2px;border-bottom:1px dashed var(--line);min-height:60px}
.fld > span:first-child{flex:1}
.fld small{display:block;color:var(--dim);font-size:13px}
.num{display:inline-flex;align-items:center;gap:6px}
.num input{width:84px;text-align:right;font:600 18px var(--mono);padding:9px 10px;border-radius:10px;border:1px solid var(--line);background:var(--card);color:var(--fg)}
.num i{font:400 13px var(--mono);font-style:normal;color:var(--mut);width:32px}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--card)}
.seg button{background:none;border:0;color:var(--mut);font:700 14px var(--body);padding:0 14px;min-height:42px;cursor:pointer}
.seg button[aria-pressed="true"]{background:var(--brass);color:var(--bg)}
.sw{cursor:pointer;position:relative}
.sw input{position:absolute;opacity:0;width:1px;height:1px}
.sw .knob{width:54px;height:32px;border-radius:16px;background:var(--line);position:relative;transition:background .2s;flex:none}
.sw .knob::after{content:"";position:absolute;left:3px;top:3px;width:26px;height:26px;border-radius:50%;background:var(--fg);transition:transform .2s}
.sw input:checked + .knob{background:var(--sea)}
.sw input:checked + .knob::after{transform:translateX(22px);background:var(--bg)}
.sw input:focus-visible + .knob{outline:2px solid var(--brass);outline-offset:2px}
.settings .btn.primary{margin-top:18px;align-self:flex-start;min-width:120px}
.saved{font:400 13px var(--mono);color:var(--sea);margin-left:10px}
.out{margin-top:26px}
.mem-h{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin:18px 0 8px}
.mem-h b{font:800 20px var(--disp);letter-spacing:.12em;text-transform:uppercase}
.mem-h code{font:400 13px var(--mono);color:var(--brass)}
.mem-h small{color:var(--dim);font-size:13px;flex-basis:100%}
.mem{width:100%;min-height:44vh;font:400 14px/1.5 var(--mono);padding:12px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--fg);resize:vertical;white-space:pre-wrap;overflow-wrap:anywhere}
.mem.ro{min-height:0;max-height:50vh;overflow:auto;margin:0;color:var(--mut);background:transparent;border-style:dashed}
.row-end{display:flex;justify-content:flex-end;align-items:center;gap:10px;margin-top:10px}

/* sheet */
.sheet{border:0;padding:0;margin:auto auto 0;width:100%;max-width:640px;background:var(--card);color:var(--fg);border-radius:22px 22px 0 0;box-shadow:0 -20px 60px -20px #000}
.sheet::backdrop{background:rgba(5,8,12,.6);backdrop-filter:blur(2px)}
.sheet[open]{animation:sheet .3s cubic-bezier(.2,.8,.2,1)}
.sheet form{display:flex;flex-direction:column;gap:12px;padding:10px 16px max(16px,env(safe-area-inset-bottom))}
.sheet .grab{width:44px;height:5px;border-radius:3px;background:var(--line);margin:0 auto 4px}
.sheet h3{font:900 28px/1 var(--disp);letter-spacing:.1em;text-transform:uppercase;margin:0}
.sheet .kinds{display:flex}
.sheet .kinds button{flex:1;min-height:48px;font-size:16px}
.sheet select{font:inherit;font-size:17px;padding:12px 14px;border-radius:12px;border:1px solid var(--line);background:var(--bg);color:var(--fg)}
.sheet select:focus{outline:2px solid var(--brass);outline-offset:1px}
.sheet textarea,.sheet input{font:inherit;font-size:17px;padding:12px 14px;border-radius:12px;border:1px solid var(--line);background:var(--bg);color:var(--fg);resize:vertical}
.sheet .err{color:var(--sig);font-size:14px;min-height:0}
.sheet .err:empty{display:none}

/* toasts */
.toasts{position:fixed;left:0;right:0;top:max(64px,calc(env(safe-area-inset-top) + 56px));z-index:20;display:flex;flex-direction:column;align-items:center;gap:8px;pointer-events:none;padding:0 16px}
.toast{pointer-events:auto;max-width:600px;width:100%;padding:12px 14px;border-radius:12px;background:var(--fg);color:var(--bg);font-size:15px;box-shadow:0 10px 30px -10px #000;animation:drop .3s cubic-bezier(.2,.8,.2,1);cursor:pointer}
.toast b{font:800 14px var(--disp);letter-spacing:.14em;text-transform:uppercase;margin-right:6px}
.toast.err{background:var(--sig);color:#fff}
.toast.out{opacity:0;transform:translateY(-8px);transition:all .3s}

@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes drop{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}
@keyframes sheet{from{transform:translateY(100%)}to{transform:none}}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.7)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes blink{50%{opacity:.3}}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important}}
@media (min-width:700px){.app{padding:0 24px}}