/* AIOLI owner app — the APPROVED v2 system (design/app/owner-app.html in restaurant-ai, 19 Oct 2026):
   the restaurant's own photo, frosted glass, ink. Funnel Display + Funnel Sans. Single light theme by choice. */
:root{
  --ink:#1c1916; --muted:rgba(28,25,22,.6); --faint:rgba(28,25,22,.38);
  --glass:rgba(252,250,246,.62); --glass-strong:rgba(252,250,246,.86); --hair:rgba(28,25,22,.11); --wash:rgba(28,25,22,.07);
  --ok:#3f6b4a; --warn:#b2563a; --night:#2a2420; --on-ink:#faf7f2; --paper:#f6f2ec; --olive:#5d6b4a;
  --display:"Funnel Display",-apple-system,system-ui,sans-serif; --text:"Funnel Sans",-apple-system,system-ui,sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
html,body{background:var(--night);color:var(--ink)}
body{font:15px/1.38 var(--text);-webkit-font-smoothing:antialiased;margin:0;-webkit-tap-highlight-color:transparent}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer;padding:0;text-align:center}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
a{color:inherit}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
svg.i{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
/* A+ (Ace 21 Oct: "frosted glass is good but maybe improve it" · "clean apple style… not all should be picture backgrounds and overlays"):
   the glass keeps its blur, gets a thin light rim and a soft lift; the ground behind it is the photo's colour, not the photo */
.glass{background:var(--glass);-webkit-backdrop-filter:blur(26px) saturate(1.5);backdrop-filter:blur(26px) saturate(1.5);border-radius:24px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.65),0 1px 2px rgba(28,25,22,.04),0 10px 30px -18px rgba(28,25,22,.18)}

.app{position:relative;max-width:430px;margin:0 auto;min-height:100vh;overflow:hidden;padding-bottom:120px}
.blur{position:fixed;inset:0;background-position:50% 30%;background-size:cover;filter:blur(80px) saturate(1.05) brightness(1.04);transform:scale(1.4);z-index:0}
.blur::after{content:"";position:absolute;inset:0;background:linear-gradient(rgba(246,242,236,.78),rgba(246,242,236,.70) 45%,rgba(246,242,236,.80))}
/* Today: the picture clean, with only the small top bar on it; the cards start below it */
.hero{position:relative;z-index:1}
.hero>img{position:relative;display:block;width:100%;height:470px;object-fit:cover;object-position:50% 12%;transform:scale(1.05);transition:transform 2.4s cubic-bezier(.16,1,.3,1)}
.in .hero>img{transform:scale(1)}
.chip{position:absolute;z-index:2;top:calc(14px + env(safe-area-inset-top,0px));left:12px;right:12px;display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 16px;border-radius:999px;font-size:13px}
.chip b{font:600 16px var(--display);letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chip .live{display:inline-flex;align-items:center;gap:6px;color:var(--ink);font-weight:500;white-space:nowrap}
.dotlive{width:7px;height:7px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 0 rgba(63,107,74,.5);animation:pulse 2s infinite}
.dotlive.off{background:var(--faint);animation:none}
@keyframes pulse{70%{box-shadow:0 0 0 8px rgba(63,107,74,0)}100%{box-shadow:0 0 0 0 rgba(63,107,74,0)}}
.demo-tag{display:inline-flex;align-items:center;gap:5px;color:var(--warn);font-weight:600;font-size:12px}

/* latest: what just happened in the book */
.now{position:relative;z-index:2;margin:10px 10px 0;padding:16px 18px;overflow:hidden}
.now .k{display:flex;justify-content:space-between;font-size:12px;color:var(--muted)}
.ev{margin-top:10px;min-height:92px;position:relative}
.ev .item{position:absolute;inset:0;opacity:0;transform:translateY(14px);transition:opacity .45s,transform .6s cubic-bezier(.16,1,.3,1)}
.ev .item.on{opacity:1;transform:none}
.ev .item.out{opacity:0;transform:translateY(-14px)}
.ev .src{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted)}
.ev .src b{color:var(--ink);font-weight:600}
.ev .said{font:500 19px/1.2 var(--display);letter-spacing:-.01em;margin-top:6px}
.ev .done{display:inline-flex;align-items:center;gap:6px;margin-top:8px;font-size:13px;font-weight:600;color:var(--ok)}
.ev .done.warn{color:var(--warn)}
.ev .done svg{width:15px;height:15px}
.ev .empty{font-size:14px;color:var(--muted);line-height:1.4}
.pips{display:flex;gap:4px;margin-top:12px}
.pips i{height:2px;flex:1;background:var(--hair);border-radius:2px;overflow:hidden;position:relative}
.pips i.on::after{content:"";position:absolute;inset:0;background:var(--ink);transform-origin:left;animation:fill 3.6s linear forwards}
.pips i.past{background:var(--ink)}
@keyframes fill{from{transform:scaleX(0)}}

.page{position:relative;z-index:1;padding:10px 10px 0;display:flex;flex-direction:column;gap:10px}
.card{padding:18px}
.h{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:12px;color:var(--muted)}
.h b{font:600 13px var(--text);color:var(--ink)}
.h button{font-size:12px;color:var(--ink);font-weight:600}

/* this week */
.week .top{display:flex;align-items:flex-end;justify-content:space-between;margin-top:8px}
.big{font:600 68px/.82 var(--display);letter-spacing:-.045em}
.big small{font:500 15px var(--text);letter-spacing:0;margin-left:6px}
.up{font-size:13px;font-weight:600;color:var(--ok);text-align:right}
.up.down{color:var(--warn)}
.up span{display:block;font-weight:400;color:var(--muted)}
.bars{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;align-items:end;height:64px;margin-top:16px}
.bars i{display:block;background:var(--ink);border-radius:4px;transform-origin:bottom;transition:transform .9s cubic-bezier(.16,1,.3,1);min-height:3px}
html:not(.in) .bars i{transform:scaleY(0)}
.bars i.q{background:transparent;box-shadow:inset 0 0 0 1.5px var(--warn)}
.bars i.zero{opacity:.25}
.bars i.future{opacity:.55}
.days{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;font-size:10px;color:var(--muted);text-align:center;margin-top:6px}
.days .t{color:var(--ink);font-weight:600}.days .qd{color:var(--warn);font-weight:600}
.srcs{display:grid;grid-template-columns:repeat(4,1fr);margin-top:14px;padding-top:12px;border-top:1px solid var(--hair)}
.srcs b{display:block;font:600 20px var(--display)}
.srcs span{font-size:11px;color:var(--muted)}

/* needs you */
.ask{display:grid;grid-template-columns:86px minmax(0,1fr);gap:14px;margin-top:12px;animation:rise .5s cubic-bezier(.16,1,.3,1)}
@keyframes rise{from{opacity:0;transform:translateY(10px)}}
.ask .pic{width:86px;height:110px;border-radius:14px;object-fit:cover}
.ask h3{font:600 21px/1.1 var(--display);letter-spacing:-.02em;margin:0}
.ask p{font-size:13px;color:var(--muted);margin:5px 0 0}
.ask .row{grid-column:1/-1;display:flex;align-items:center;gap:8px}
.pill{text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--ink);color:var(--on-ink);border-radius:999px;height:44px;padding:0 20px;font-weight:600;transition:transform .18s,opacity .18s;white-space:nowrap}
.pill:active{transform:scale(.97)}
.pill:disabled{opacity:.45;cursor:default}
.pill.wide{width:100%;height:50px}
.pill.danger{background:var(--warn)}
.ghost{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:44px;padding:0 16px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--hair);font-weight:600;font-size:14px;text-decoration:none;white-space:nowrap}
.ghost.danger{color:var(--warn);box-shadow:inset 0 0 0 1px rgba(178,86,58,.35)}
.ghost.small{height:34px;padding:0 12px;font-size:12.5px}
.of{margin-left:auto;font-size:12px;color:var(--muted)}
.cleared{display:flex;align-items:center;gap:10px;margin-top:12px;font:500 17px var(--display)}

/* tiles */
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.tile{position:relative;padding:15px;min-height:148px;display:flex;flex-direction:column;text-align:left;overflow:hidden;transition:transform .18s}
button.tile:active{transform:scale(.98)}
.tile .lab{display:flex;align-items:center;gap:7px;font-size:12px;color:var(--muted)}
.tile .n{font:600 34px/1 var(--display);letter-spacing:-.035em;margin-top:auto;padding-top:14px}
.tile .d{font-size:12.5px;color:var(--muted);margin-top:4px;line-height:1.3}
.tile .d b{color:var(--ink);font-weight:600}
.tile.wide{grid-column:1/-1;min-height:0}
.tile.photo{color:#fff;min-height:220px;grid-row:span 2}
.tile.photo .lab,.tile.photo .d{color:rgba(255,255,255,.86)}
.tile.photo .d b{color:#fff}
.tile.photo .shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.34) 0,rgba(0,0,0,0) 28%,rgba(0,0,0,.05) 45%,rgba(0,0,0,.64))}
.tile.photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tile.photo>*:not(img):not(.shade){position:relative}
.tile.soon{min-height:0;background:rgba(250,247,242,.42)}
.tile.soon .n{font-size:15px;font-family:var(--text);font-weight:600;letter-spacing:0;padding-top:10px}
.tile .tag{margin-left:auto}
.next{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.next .tile{min-height:96px;padding:13px}

/* tonight + the book rows */
.tbl{display:grid;grid-template-columns:52px minmax(0,1fr) auto;gap:10px;align-items:center;padding:11px 0;border-top:1px solid var(--hair);width:100%;text-align:left}
.tbl:first-of-type{margin-top:10px}
.tbl .time{font:600 17px var(--display)}
.tbl .who{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tbl .note{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tbl.off .time,.tbl.off .who{opacity:.45}
.tbl.off .who{text-decoration:line-through}
.tag{font-size:11px;font-weight:600;padding:4px 8px;border-radius:999px;background:rgba(28,25,22,.07);white-space:nowrap}
.tag.ink{background:var(--ink);color:var(--on-ink)}
.tag.ok{background:rgba(63,107,74,.13);color:var(--ok)}
.tag.warn{background:rgba(178,86,58,.13);color:var(--warn)}
.tag.olive{background:rgba(93,107,74,.14);color:var(--olive)}
.more{display:block;width:100%;text-align:left;margin-top:10px;padding-top:11px;border-top:1px solid var(--hair);font-size:13px;font-weight:600}
.emptyrow{padding:14px 0 4px;color:var(--muted);font-size:14px;border-top:1px solid var(--hair);margin-top:10px}

/* the add bar */
.tell{display:flex;align-items:center;gap:10px;padding:10px 10px 10px 18px;border-radius:999px;width:100%}
.tell>span:first-child{flex:1;color:var(--muted);font-size:14px;text-align:left}
.round{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:var(--on-ink);flex:none}
.round.light{background:rgba(28,25,22,.07);color:var(--ink)}

/* dock */
.dock{position:fixed;z-index:5;left:50%;transform:translateX(-50%);bottom:calc(12px + env(safe-area-inset-bottom,0px));width:min(410px,calc(100% - 20px));display:grid;grid-template-columns:repeat(5,1fr);padding:8px 6px;border-radius:26px;background:var(--glass-strong);box-shadow:inset 0 0 0 1px rgba(255,255,255,.75),0 12px 30px -14px rgba(28,25,22,.25)}
.dock button{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:10.5px;color:var(--muted);position:relative;padding:4px 0}
.dock button.on{color:var(--ink);font-weight:600}
.dock .badge{position:absolute;top:0;right:calc(50% - 18px);min-width:16px;height:16px;border-radius:8px;background:var(--warn);color:#fff;font-size:9.5px;font-weight:600;display:grid;place-items:center;padding:0 4px}
.fab{position:fixed;z-index:5;right:max(20px,calc(50% - 195px));bottom:calc(92px + env(safe-area-inset-bottom,0px));height:50px;padding:0 20px;box-shadow:0 10px 26px -8px rgba(0,0,0,.45)}

/* screens other than Today: a glass page header over the blurred photo */
.screen{position:relative;z-index:1;padding:calc(14px + env(safe-area-inset-top,0px)) 10px 0;display:flex;flex-direction:column;gap:10px}
.title{padding:8px 8px 4px}
.title h2{font:600 34px/1 var(--display);letter-spacing:-.035em;margin:0;color:var(--ink)}
.title p{margin:6px 0 0;font-size:13px;color:rgba(28,25,22,.68)}
.strip{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:2px 2px 4px;scroll-snap-type:x proximity}
.strip::-webkit-scrollbar{display:none}
.dayb{flex:none;width:56px;padding:8px 0 7px;border-radius:16px;text-align:center;background:var(--glass);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);scroll-snap-align:center}
.dayb small{display:block;font-size:10.5px;color:var(--muted)}
.dayb b{display:block;font:600 19px/1.15 var(--display)}
.dayb span{display:block;font-size:10px;color:var(--muted);height:13px}
.dayb.on{background:var(--ink);color:var(--on-ink)}
.dayb.on small,.dayb.on span{color:rgba(250,247,242,.7)}
.dayb.closed{opacity:.5}
.search{display:flex;align-items:center;gap:10px;padding:0 16px;height:48px;border-radius:999px}
.search input{flex:1;border:0;background:transparent;outline:none;font-size:16px;min-width:0}
.chips{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:0 2px}
.chips::-webkit-scrollbar{display:none}
.chips button{flex:none;height:34px;padding:0 14px;border-radius:999px;font-size:13px;font-weight:600;background:var(--glass);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}
.chips button.on{background:var(--ink);color:var(--on-ink)}
.grow{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:12px;align-items:center;padding:11px 0;border-top:1px solid var(--hair);width:100%;text-align:left}
.grow:first-child{border-top:0}
.av{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:rgba(28,25,22,.07);font:600 15px var(--display)}
.grow .t{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.grow .s{font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tags{display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-end}

/* sheets */
.veil{position:fixed;inset:0;z-index:8;background:rgba(20,16,14,.38);opacity:0;pointer-events:none;transition:opacity .25s}
.veil.on{opacity:1;pointer-events:auto}
.sheet{position:fixed;z-index:9;left:50%;bottom:0;width:min(430px,100%);max-height:92vh;max-height:92dvh;overflow:auto;overscroll-behavior:contain;transform:translate(-50%,104%);transition:transform .42s cubic-bezier(.16,1,.3,1);border-radius:28px 28px 0 0;background:var(--paper);padding:10px 18px calc(28px + env(safe-area-inset-bottom,0px))}
.sheet.on{transform:translate(-50%,0)}
.grab{width:40px;height:5px;border-radius:3px;background:var(--hair);margin:0 auto 12px}
.st{display:flex;justify-content:space-between;align-items:center;gap:12px}
.sheet h2{font:600 28px/1.05 var(--display);letter-spacing:-.03em;margin:0}
.x{width:34px;height:34px;border-radius:50%;background:rgba(28,25,22,.07);display:grid;place-items:center;flex:none}
.sub{color:var(--muted);font-size:13px;margin:6px 0 0}
.box{margin-top:14px;padding:16px;border-radius:20px;background:#fff}
.box.flat{background:rgba(255,255,255,.6)}
.kv{display:grid;grid-template-columns:110px minmax(0,1fr);gap:10px;font-size:14px;padding:9px 0;border-top:1px solid var(--hair)}
.kv:first-child{border-top:0;padding-top:0}
.kv>span{color:var(--muted);font-size:13px}
.kv b{font-weight:600;overflow-wrap:anywhere}
.kv a{font-weight:600;text-decoration:none}
.status{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:14px}
.status button{height:44px;border-radius:14px;font-size:13px;font-weight:600;box-shadow:inset 0 0 0 1px var(--hair);background:rgba(255,255,255,.6)}
.status button.on{background:var(--ink);color:var(--on-ink);box-shadow:none}
.status button.on.cx{background:var(--warn)}
.bigtime{font:600 52px/.9 var(--display);letter-spacing:-.045em}
.line{display:flex;justify-content:space-between;gap:10px;font-size:13px;padding:8px 0;border-top:1px solid var(--hair)}
.line:first-child{border-top:0}
.line span:first-child{color:var(--muted)}
.mail{margin-top:8px;padding:12px;border-radius:14px;background:var(--paper);font-size:12.5px;white-space:pre-wrap;max-height:220px;overflow:auto;font-family:var(--text)}
.sect{font:600 13px var(--text);margin:20px 2px 0;display:flex;justify-content:space-between;align-items:baseline}
.sect span{font-weight:400;color:var(--muted);font-size:12px}
.partyrow{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:2px 0}
.partyrow::-webkit-scrollbar{display:none}
.partyrow button{flex:none;width:44px;height:44px;border-radius:50%;font:600 16px var(--display);box-shadow:inset 0 0 0 1px var(--hair);background:#fff}
.partyrow button.on{background:var(--ink);color:var(--on-ink);box-shadow:none}
.daysrow{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:2px 0}
.daysrow::-webkit-scrollbar{display:none}
.daysrow button{flex:none;width:54px;padding:7px 0;border-radius:14px;text-align:center;box-shadow:inset 0 0 0 1px var(--hair);background:#fff}
.daysrow button small{display:block;font-size:10.5px;color:var(--muted)}
.daysrow button b{display:block;font:600 18px/1.2 var(--display)}
.daysrow button.on{background:var(--ink);color:var(--on-ink);box-shadow:none}
.daysrow button.on small{color:rgba(250,247,242,.7)}
.timegrid{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.timegrid button{height:40px;border-radius:12px;font:600 14px var(--display);background:#fff;box-shadow:inset 0 0 0 1px var(--hair)}
.timegrid button.on{background:var(--ink);color:var(--on-ink);box-shadow:none}
.timegrid button.full{color:var(--faint);background:transparent}
.timegrid button.full.on{background:var(--warn);color:#fff}
.fields{display:grid;gap:8px;margin-top:10px}
.field{position:relative}
.field input,.field textarea,.field select{width:100%;border:0;border-radius:14px;background:#fff;box-shadow:inset 0 0 0 1px var(--hair);padding:20px 14px 8px;font-size:16px;outline:none;-webkit-appearance:none;appearance:none}
.field textarea{min-height:70px;resize:vertical;line-height:1.35}
.field input:focus,.field textarea:focus,.field select:focus{box-shadow:inset 0 0 0 1.5px var(--ink)}
.field label{position:absolute;left:14px;top:7px;font-size:11px;color:var(--muted);pointer-events:none}
.two{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.two.stack{grid-template-columns:1fr}
.check{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 14px;border-radius:14px;background:#fff;box-shadow:inset 0 0 0 1px var(--hair);font-size:13.5px;cursor:pointer}
.switch{position:relative;width:46px;height:28px;flex:none}
.switch input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
.switch i{position:absolute;inset:0;border-radius:999px;background:rgba(28,25,22,.16);transition:background .2s}
.switch i::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:transform .22s cubic-bezier(.16,1,.3,1)}
.switch input:checked+i{background:var(--ok)}
.switch input:checked+i::after{transform:translateX(18px)}
.alert{margin-top:12px;padding:11px 14px;border-radius:14px;background:rgba(178,86,58,.1);color:var(--warn);font-size:13.5px;font-weight:500}
.okmsg{margin-top:12px;padding:11px 14px;border-radius:14px;background:rgba(63,107,74,.1);color:var(--ok);font-size:13.5px;font-weight:500}
.btnrow{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}
.btnrow .pill,.btnrow .ghost{flex:1}
.hours-row{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:8px;align-items:center;padding:8px 0;border-top:1px solid var(--hair);font-size:14px}
.hours-row:first-child{border-top:0}
.hours-row input[type=time]{border:0;background:var(--paper);border-radius:10px;padding:7px 8px;font-size:15px;width:100%}
.hours-row .times{display:flex;gap:6px;align-items:center}
.code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px;background:var(--paper);border-radius:12px;padding:10px 12px;overflow-wrap:anywhere;white-space:pre-wrap;margin-top:8px;user-select:all}
.toast{position:fixed;z-index:20;left:50%;bottom:calc(96px + env(safe-area-inset-bottom,0px));transform:translate(-50%,20px);opacity:0;background:var(--ink);color:var(--on-ink);padding:11px 18px;border-radius:999px;font-size:14px;font-weight:600;transition:opacity .25s,transform .35s cubic-bezier(.16,1,.3,1);pointer-events:none;white-space:nowrap}
.toast.on{opacity:1;transform:translate(-50%,0)}
.loading{display:grid;place-items:center;min-height:60vh;color:rgba(250,247,242,.7);font-size:14px}

/* sign in: warm paper, the AIOLI mark */
.signin{min-height:100vh;min-height:100svh;background:var(--paper);display:flex;flex-direction:column;justify-content:space-between;padding:calc(28px + env(safe-area-inset-top,0px)) 24px calc(28px + env(safe-area-inset-bottom,0px));max-width:480px;margin:0 auto}
.brand{display:flex;align-items:center;gap:10px;font:600 15px var(--display);letter-spacing:.02em}
.brand svg{width:28px;height:28px}
.signin h2{font:600 44px/1 var(--display);letter-spacing:-.04em;margin:0}
.signin p{color:var(--muted);margin:10px 0 0;font-size:15px}
.signin form{margin-top:26px}
.codebox input{letter-spacing:.4em;font:600 26px var(--display);text-align:center;padding:16px 14px}
.signin .fine{font-size:12px;color:var(--muted)}
.linkish{font-size:13px;font-weight:600;text-decoration:underline;text-underline-offset:3px;margin-top:14px;display:inline-block}

/* one app (step 8): the parts outside the book — v2's Inbox, Phone, Website sheets in the same glass, ink and hairlines */
.callrow{display:flex;align-items:flex-end;gap:12px;margin-top:10px}
.callrow .n{margin:0;padding:0;flex:none}
.callrow .d{margin:0 0 2px}
.wave{display:inline-flex;gap:2px;align-items:center;height:26px;margin-left:auto;flex:none}
.wave i{width:2px;background:var(--ink);border-radius:2px;animation:wv 1s ease-in-out infinite}
@keyframes wv{50%{transform:scaleY(.35)}}
.langs{display:flex;gap:4px;flex-wrap:wrap;margin-top:10px}
.langs span{font-size:10px;font-weight:600;padding:3px 6px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--hair)}
.tile .lab .tag{margin-left:auto;font-size:10.5px;padding:3px 7px}
.tile .n.word{font-size:26px;letter-spacing:-.03em}
.tile .d.later{margin-top:10px;padding-top:10px;border-top:1px solid var(--hair)}
.tile.quiet .n{font-size:30px}
.tile.studio{flex-direction:row;align-items:center;gap:14px}
.tile.studio .sthumb{width:72px;height:90px;border-radius:14px;object-fit:cover;flex:none;box-shadow:0 6px 16px -10px rgba(28,25,22,.4)}
.tile.studio .si{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--wash);flex:none}
.tile.studio .stx{flex:1;min-width:0;display:flex;flex-direction:column}
.soonlist{padding:16px 18px 8px;background:rgba(250,247,242,.5)}
.soonrow{display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:10px;align-items:center;padding:11px 0;border-top:1px solid var(--hair)}
.soonlist .h+.soonrow{margin-top:8px}
.soonlist>.soonrow:first-child{border-top:0}
.soonrow .si{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--wash);color:var(--muted)}
.soonrow .si svg{width:15px;height:15px}
.soonrow b{display:block;font-size:13.5px;font-weight:600}
.soonrow div span{display:block;font-size:12.5px;color:var(--muted);line-height:1.32;margin-top:1px}
.soonrow .ghost{background:rgba(255,255,255,.55)}
.ask.ic{grid-template-columns:44px minmax(0,1fr)}
.askic{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:var(--on-ink)}
.ask .row a.pill{text-decoration:none}
.conv .av{color:var(--ink)}
.conv.unread .t::after{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--warn);margin-left:7px;vertical-align:middle}
.callbox .meta{display:flex;justify-content:space-between;font-size:12px;color:var(--muted)}
.calline{position:relative;height:8px;margin:14px 0 4px;border-radius:4px;background:var(--wash)}
.calline i{position:absolute;top:0;display:block;height:100%;border-radius:4px;background:rgba(28,25,22,.3)}
.calline i.ai{background:var(--ink)}
.callends{display:flex;justify-content:space-between;font-size:10.5px;color:var(--muted);margin-bottom:8px;font-variant-numeric:tabular-nums}
.tline{display:grid;grid-template-columns:44px minmax(0,1fr);gap:8px;font-size:14px;padding:5px 0}
.tline .w{font-size:11px;color:var(--muted);padding-top:2px}
.tline.ai .w{color:var(--ink);font-weight:600}
.booked{display:flex;align-items:center;gap:8px;width:100%;margin-top:10px;padding:10px 12px;border-radius:14px;background:rgba(63,107,74,.1);color:var(--ok);font-weight:600;font-size:14px;text-align:left}
.ch{font-size:13px;padding:9px 0;border-bottom:1px solid var(--hair);color:var(--muted)}
.ch b{display:block;font-weight:600;font-size:14px;color:var(--ink)}
.notesum{font:600 20px/1.2 var(--display);letter-spacing:-.015em}
.thread{display:flex;flex-direction:column;gap:6px;margin-top:14px}
.bub{max-width:82%;padding:9px 12px 7px;border-radius:18px;font-size:14.5px;line-height:1.35;white-space:pre-wrap;overflow-wrap:anywhere}
.bub small{display:block;font-size:10.5px;margin-top:3px;color:var(--muted)}
.bub.in{align-self:flex-start;background:#fff;border-bottom-left-radius:6px}
.bub.out{align-self:flex-end;background:rgba(28,25,22,.08);border-bottom-right-radius:6px}
.bub.out.ai{background:var(--ink);color:var(--on-ink)}
.bub.out.ai small{color:rgba(250,247,242,.62)}
.tnote{align-self:center;font-size:11.5px;color:var(--muted);padding:2px 10px;border-radius:999px;background:var(--wash)}
.composer{display:flex;align-items:flex-end;gap:8px;margin-top:14px;padding:6px 6px 6px 14px;border-radius:24px;background:#fff;box-shadow:inset 0 0 0 1px var(--hair)}
.composer textarea{flex:1;border:0;outline:none;resize:none;background:transparent;font-size:16px;line-height:1.35;padding:8px 0;max-height:140px}
.composer textarea:disabled{opacity:.5}
.round:disabled{opacity:.35;cursor:default}
.sitehost .bigsite{font:600 26px/1.05 var(--display);letter-spacing:-.03em;overflow-wrap:anywhere;margin-bottom:14px}
.sitehost form{margin:0}

@media (min-width:900px){
  .app{margin:0 auto;box-shadow:0 0 0 1px rgba(255,255,255,.04)}
}
@media (prefers-reduced-motion:reduce){*,*::after,*::before{animation:none!important;transition:none!important}}