/* Плотинка · контент-план */
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0}
img{max-width:100%}

@font-face{font-family:"TT Firs Text";src:url("fonts/TTFirsText-Regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"TT Firs Text";src:url("fonts/TTFirsText-DemiBold.woff2") format("woff2");font-weight:600;font-display:swap}
/* Layout: three sections behind a top tab bar — Feed (Instagram-style grid per platform), Calendar (day rows), Projects & ideas (list with comment threads) */
:root{
  --bg:#F7F5F6; --surface:#FFFFFF; --fg:#1F1E1E; --muted:#6E6A6C; --faint:#A8A2A5; --line:#E6E6E6;
  --pink:#F1B1D1; --pink-ink:#8C2F5F; --pink-soft:#FBE6F0;
  --ok:#2F7A4F; --ok-soft:#E3F2E8; --warn:#9A5B00; --warn-soft:#FBEED8; --todo:#4B4F9A; --todo-soft:#E7E8F7; --pub:#1F1E1E; --pub-soft:#E6E6E6;
  --scrim:rgba(31,30,30,.55);
  --font:"TT Firs Text", "Manrope", "Segoe UI", system-ui, sans-serif;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#1F1E1E; --surface:#292727; --fg:#F2EEF0; --muted:#A39CA0; --faint:#6F696C; --line:#3A3738;
  --pink:#F1B1D1; --pink-ink:#F5C4DD; --pink-soft:#4A2F3C;
  --ok:#8FD3A8; --ok-soft:#24392C; --warn:#F2C27A; --warn-soft:#3E3120; --todo:#B8BCF5; --todo-soft:#2E2F48; --pub:#F2EEF0; --pub-soft:#3A3738; --scrim:rgba(0,0,0,.7); color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#1F1E1E; --surface:#292727; --fg:#F2EEF0; --muted:#A39CA0; --faint:#6F696C; --line:#3A3738;
  --pink:#F1B1D1; --pink-ink:#F5C4DD; --pink-soft:#4A2F3C;
  --ok:#8FD3A8; --ok-soft:#24392C; --warn:#F2C27A; --warn-soft:#3E3120; --todo:#B8BCF5; --todo-soft:#2E2F48; --pub:#F2EEF0; --pub-soft:#3A3738; --scrim:rgba(0,0,0,.7); color-scheme:dark}
*{box-sizing:border-box}
body{background:var(--bg);color:var(--fg);font-family:var(--font);font-size:15px;line-height:1.5;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));padding-block:28px 64px}
.wrap{max-width:980px;margin:0 auto;display:flex;flex-direction:column;gap:28px}
h1,h2,h3{font-weight:600;margin:0;text-wrap:balance;letter-spacing:-.01em}
h1{font-size:clamp(26px,4.6vw,36px);line-height:1.1}
h2{font-size:20px}
button{font:inherit;color:inherit}
button:focus-visible,textarea:focus-visible,input:focus-visible,select:focus-visible,label.up:focus-within,a:focus-visible{outline:2px solid var(--pink-ink);outline-offset:2px}
.note{font-size:12px;color:var(--muted)}
.smile{display:inline-block;width:.9em;height:.9em;border-radius:50%;background:var(--pink);vertical-align:-.08em;margin-right:.25em;position:relative}
.smile::after{content:"";position:absolute;left:24%;right:24%;top:40%;height:30%;border:3px solid #1F1E1E;border-top:none;border-radius:0 0 999px 999px}
header.top{display:flex;flex-direction:column;gap:14px}
.headrow{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;flex-wrap:wrap}
.sync{font-size:13px;color:var(--muted)}
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);overflow-x:auto}
.tabs a{padding:10px 14px;text-decoration:none;color:var(--muted);font-weight:600;font-size:15px;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
.tabs a[aria-current="page"]{color:var(--fg);border-bottom-color:var(--fg)}
.stats{display:flex;flex-wrap:wrap;gap:6px 18px;font-variant-numeric:tabular-nums}
.stat{display:flex;align-items:center;gap:8px;font-size:13px}
.stat b{font-weight:600}
.dot{width:9px;height:9px;border-radius:50%;flex:none}
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pills button,.toggle{font-size:14px;border:1px solid var(--line);background:var(--surface);color:var(--fg);padding:6px 14px;border-radius:999px;cursor:pointer}
.pills button[aria-pressed="true"],.toggle[aria-pressed="true"]{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.btn,label.up{font-size:13px;border:1px solid var(--fg);background:var(--fg);color:var(--bg);padding:7px 14px;border-radius:999px;cursor:pointer;position:relative;text-decoration:none;display:inline-block}
.btn.ghost{background:transparent;color:var(--fg);border-color:var(--line)}
.btn.danger{background:transparent;color:#B3261E;border-color:#B3261E}
label.up input{position:absolute;opacity:0;width:1px;height:1px}
select.sel{font:inherit;font-size:14px;color:var(--fg);background:var(--surface);border:1px solid var(--line);border-radius:999px;padding:6px 12px}
section[data-view]{display:flex;flex-direction:column;gap:20px}
section[data-view][hidden]{display:none}

/* ---------- FEED ---------- */
.feed-bar{display:flex;flex-direction:column;gap:12px}
.feed-filters{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.profile{display:grid;grid-template-columns:auto minmax(0,1fr);gap:16px 20px;align-items:center;padding:4px 0}
.profile .ava{width:72px;height:72px}
.profile .ava::after{border-width:4px}
.profile h2{font-size:20px}
.profile .pstats{display:flex;gap:20px;flex-wrap:wrap;font-size:14px;font-variant-numeric:tabular-nums}
.profile .pstats b{font-weight:600}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px}
.tile{position:relative;aspect-ratio:3/4;max-width:100%;border:none;padding:0;cursor:pointer;background:var(--pink-soft) center/cover no-repeat;overflow:hidden;color:var(--pink-ink);text-align:left}
.tile .ph{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;gap:6px;padding:12px;font-size:clamp(11px,1.7vw,14px);font-weight:600;line-height:1.25}
.tile .ph small{font-weight:400;opacity:.8}
.tile.free{background:var(--surface);outline:1.5px dashed var(--pink-ink);outline-offset:-6px}
.tile .badge{position:absolute;top:6px;right:6px;background:rgba(31,30,30,.72);color:#fff;font-size:11px;padding:2px 7px;border-radius:999px}
.tile .when{position:absolute;left:6px;bottom:6px;background:rgba(255,255,255,.92);color:#1F1E1E;font-size:11px;font-weight:600;padding:2px 8px;border-radius:999px;font-variant-numeric:tabular-nums}
.tile .sdot{position:absolute;top:8px;left:8px;width:10px;height:10px;border-radius:50%;box-shadow:0 0 0 2px rgba(255,255,255,.9)}
.tile:hover{filter:brightness(.95)}
.empty-feed{padding:40px 16px;text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:12px}
.legend{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12px;color:var(--muted)}
.legend span{display:flex;align-items:center;gap:6px}

/* modal */
.modal{position:fixed;inset:0;z-index:20;background:var(--scrim);display:grid;place-items:center;padding:max(16px,env(safe-area-inset-top,0px)) max(16px,env(safe-area-inset-right,0px)) max(16px,env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px))}
.modal[hidden]{display:none!important}
.mbox{background:var(--surface);border-radius:14px;max-width:760px;width:100%;max-height:100%;overflow:auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.mbox .ig{border:none;border-radius:0}
.mside{padding:18px;display:flex;flex-direction:column;gap:12px;border-left:1px solid var(--line);min-width:0}
.mside dl{margin:0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:6px 12px;font-size:13px}
.mside dt{color:var(--muted)}
.mside dd{margin:0}
.mside .cap{white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px}
.mside .acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:auto}
.mclose{position:absolute;top:10px;right:10px}

/* ---------- CALENDAR ---------- */
.bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between}
.weeks{display:flex;flex-direction:column;gap:28px}
.week{display:flex;flex-direction:column}
.wk-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;border-bottom:1px solid var(--fg);padding-bottom:6px;margin-bottom:2px;flex-wrap:wrap}
.wk-head h3{font-size:15px}
.wk-count{font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums}
.wk-count.max{color:var(--warn)}
.wk-count.over{color:#B3261E}
.wk-head .room{color:var(--pink-ink)}
.day{border-bottom:1px solid var(--line);transition:background .15s}
.day.drop{background:var(--pink-soft)}
.day.today .d-num,.day.today .date{color:var(--pink-ink)}
.empty-day{display:grid;grid-template-columns:64px minmax(0,1fr);gap:16px;align-items:center;min-height:30px;padding:2px 0}
.empty-day .d-num{font-size:12px;color:var(--faint);font-variant-numeric:tabular-nums}
.empty-day .d-num small{margin-left:6px}
.adds{display:flex;gap:16px;flex-wrap:wrap}
.add{font-size:12px;color:var(--faint);background:none;border:none;padding:4px 0;cursor:pointer;opacity:0;transition:opacity .15s}
.day:hover .add,.add:focus-visible{opacity:1}
@media (hover:none){.add{opacity:1}}
.weekend .d-num{opacity:.7}
.new{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto auto;gap:8px;padding:8px 0 12px 80px;align-items:center}
.new input,.new select,.edit input,.edit select,.idea-new input,.idea-new select,.cform textarea{font:inherit;font-size:14px;color:var(--fg);background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:7px 10px;min-width:0}
.day .item+.item{border-top:1px dashed var(--line)}
.row{display:grid;grid-template-columns:64px 88px minmax(0,1fr) 168px 112px 44px;gap:8px 16px;align-items:start;padding:12px 0}
.item[draggable="true"] .row{cursor:grab}
.item.dragging{opacity:.4}
.item.free .row{background:var(--pink-soft);border:1.5px dashed var(--pink-ink);border-radius:10px;padding-inline:12px;margin-block:6px}
.item.free .t{color:var(--pink-ink)}
.item.flash .row{animation:flash 1.6s ease-out}
@keyframes flash{0%{background:var(--pink)}100%{background:transparent}}
.date{font-variant-numeric:tabular-nums;font-weight:600}
.date small{display:block;font-weight:400;color:var(--muted);font-size:12px}
.acc{font-size:12px;font-weight:600;padding:3px 10px;border-radius:999px;justify-self:start;white-space:nowrap}
.acc.buro{background:var(--fg);color:var(--bg)}
.acc.design{background:var(--pink-soft);color:var(--pink-ink)}
.item.free .acc.design{background:var(--surface)}
.acc.collab{background:var(--pink);color:#1F1E1E}
.what{min-width:0}
.what .t{font-weight:600}
.what .n{color:var(--muted);font-size:13px;margin-top:2px}
.what .marks{display:flex;gap:10px;flex-wrap:wrap;font-size:12px;margin-top:6px;color:var(--muted)}
.marks .has{color:var(--ok)}
.fmt{display:inline-block;font-size:11px;font-weight:600;padding:1px 7px;border-radius:4px;background:var(--fg);color:var(--bg);vertical-align:2px}
.st{font-size:12px;font-weight:600;padding:3px 10px;border-radius:6px;justify-self:start;white-space:nowrap}
.st.ok{background:var(--ok-soft);color:var(--ok)}
.st.collect{background:var(--warn-soft);color:var(--warn)}
.st.work{background:var(--pink-soft);color:var(--pink-ink)}
.st.create{background:var(--todo-soft);color:var(--todo)}
.st.free{background:var(--surface);color:var(--pink-ink);border:1px dashed var(--pink-ink)}
.st.published{background:var(--pub-soft);color:var(--pub)}
select.st{appearance:none;-webkit-appearance:none;border:1px solid transparent;cursor:pointer;font:inherit;font-size:12px;font-weight:600;padding:3px 22px 3px 10px;background-image:linear-gradient(45deg,transparent 50%,currentColor 50%),linear-gradient(135deg,currentColor 50%,transparent 50%);background-position:calc(100% - 11px) 55%,calc(100% - 7px) 55%;background-size:4px 4px;background-repeat:no-repeat;max-width:100%}
select.st.free{border:1px dashed var(--pink-ink)}
select.st option{color:var(--fg);background:var(--surface)}
.pls{display:flex;flex-wrap:wrap;gap:4px;min-width:0}
.pl{font-size:11px;padding:2px 7px;border-radius:999px;border:1px dashed var(--faint);background:transparent;color:var(--faint);cursor:pointer;white-space:nowrap}
.pl.on{border:1px solid var(--fg);color:var(--fg)}
.pl:disabled{cursor:default}
.pl:disabled:not(.on){display:none}
.unfree{margin-top:8px;font-size:12px;color:var(--pink-ink);background:none;border:none;padding:0;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.thumb{width:44px;height:55px;border-radius:6px;border:1px solid var(--line);background:var(--surface) center/cover no-repeat;cursor:pointer;padding:0;display:grid;place-items:center;color:var(--muted);font-size:18px}
.thumb[aria-expanded="true"]{border-color:var(--fg)}
.panel{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:24px;padding:4px 0 20px}
.panel[hidden]{display:none!important}
.ig{background:var(--surface);border:1px solid var(--line);border-radius:12px;overflow:hidden;min-width:0;align-self:start}
.ig-head{display:flex;align-items:center;gap:8px;padding:10px 12px;font-size:13px;font-weight:600}
.ava{width:28px;height:28px;border-radius:50%;background:var(--pink);flex:none;position:relative}
.ava::after{content:"";position:absolute;left:24%;right:24%;top:40%;height:28%;border:2px solid #1F1E1E;border-top:none;border-radius:0 0 999px 999px}
.ava.dark{background:#1F1E1E}.ava.dark::after{border-color:var(--pink)}
.media{position:relative;aspect-ratio:4/5;max-width:100%;background:var(--pink-soft);display:grid;place-items:center;color:var(--pink-ink);font-size:13px;text-align:center}
.media img,.media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.media .empty{padding:24px}
.nav{position:absolute;top:50%;transform:translateY(-50%);width:30px;height:30px;border-radius:50%;border:none;background:rgba(255,255,255,.85);color:#1F1E1E;cursor:pointer;font-size:16px;line-height:1}
.nav.prev{left:8px}.nav.next{right:8px}
.count{position:absolute;top:8px;right:8px;background:rgba(31,30,30,.7);color:#fff;font-size:11px;padding:2px 8px;border-radius:999px}
.ig-cap{padding:10px 12px 14px;font-size:13px;white-space:pre-wrap;overflow-wrap:anywhere}
.ig-cap b{font-weight:600}
.phc{color:var(--muted)}
.edit{display:flex;flex-direction:column;gap:12px;min-width:0}
.fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}
.fields label,.lab{display:flex;flex-direction:column;gap:4px;font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.fields .wide{grid-column:1/-1}
textarea{width:100%;min-height:160px;resize:vertical;font:inherit;font-size:14px;line-height:1.5;color:var(--fg);background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:12px}
.meta{display:flex;justify-content:space-between;gap:12px;font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums;flex-wrap:wrap}
.meta .over{color:var(--warn)}
.tools{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.strip{display:flex;gap:8px;flex-wrap:wrap}
.strip .s{position:relative;width:56px;height:70px;border-radius:6px;overflow:hidden;border:1px solid var(--line);background:var(--surface)}
.strip .s img,.strip .s video{width:100%;height:100%;object-fit:cover}
.strip .s button{position:absolute;top:2px;right:2px;width:20px;height:20px;border-radius:50%;border:none;background:rgba(31,30,30,.75);color:#fff;font-size:12px;line-height:1;cursor:pointer}
.strip .s button.l{left:2px;right:auto}
.strip .s button.dl{top:auto;bottom:2px;left:2px;right:auto;background:var(--pink);color:#1F1E1E;font-weight:600}
.slots{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;width:100%}
.slot{display:grid;grid-template-columns:72px minmax(0,1fr);gap:12px;align-items:start;border:1px solid var(--line);border-radius:10px;padding:10px;background:var(--surface)}
.slot-prev{width:72px;aspect-ratio:9/16;border-radius:6px;overflow:hidden;background:var(--pink-soft);display:grid;place-items:center;color:var(--pink-ink)}
.slot-prev img,.slot-prev video{width:100%;height:100%;object-fit:cover}
.slot-body{display:flex;flex-direction:column;gap:6px;min-width:0}
.more{align-self:flex-start}
details.routes-box{border:1px solid var(--line);border-radius:10px;padding:10px 14px;background:var(--surface)}
details.routes-box summary{cursor:pointer;font-size:13px;color:var(--muted)}
.routes{width:100%;border-collapse:collapse;font-size:13px;margin-top:10px}
.routes th,.routes td{text-align:left;padding:7px 10px 7px 0;border-bottom:1px solid var(--line);vertical-align:top}
.routes th{font-weight:600;color:var(--muted);font-size:12px}
.scroll{overflow-x:auto}

/* ---------- PROJECTS & IDEAS ---------- */
.idea-new{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px}
.ideas{display:flex;flex-direction:column}
.idea{border-bottom:1px solid var(--line);padding:10px 0}
.idea-row{display:grid;grid-template-columns:24px minmax(0,1fr) auto auto 28px;gap:10px;align-items:start}
.idea input[type=checkbox]{width:18px;height:18px;margin:4px 0 0;accent-color:var(--pink-ink);cursor:pointer}
.idea .txt{min-height:1.6em;field-sizing:content;height:auto;resize:none;border:1px solid transparent;background:transparent;padding:2px 6px;border-radius:6px;font-size:15px;overflow:hidden}
.idea .txt:hover:not([readonly]),.idea .txt:focus{border-color:var(--line);background:var(--surface)}
.idea.done .txt{text-decoration:line-through;color:var(--muted)}
.kind{font-size:12px;font-weight:600;padding:3px 10px;border-radius:999px;border:1px solid var(--line);background:var(--surface);cursor:pointer;white-space:nowrap}
.kind.kind-project{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.kind.kind-idea{background:var(--pink-soft);color:var(--pink-ink);border-color:transparent}
.ctoggle{font-size:12px;color:var(--muted);background:none;border:none;cursor:pointer;padding:3px 4px;white-space:nowrap}
.ctoggle.has{color:var(--pink-ink);font-weight:600}
.x{background:none;border:none;color:var(--faint);font-size:18px;cursor:pointer;line-height:1;padding:2px}
.x:hover{color:#B3261E}
.thread{margin:10px 0 4px 34px;display:flex;flex-direction:column;gap:10px}
.thread[hidden]{display:none!important}
.cmt{display:grid;grid-template-columns:28px minmax(0,1fr) 24px;gap:10px;align-items:start}
.cmt img{width:28px;height:28px;border-radius:50%}
.cmt .who{font-size:12px;color:var(--muted)}
.cmt .who b{color:var(--fg);font-weight:600}
.cmt .body{white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px}
.cform{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:end}
.cform textarea{min-height:44px;resize:vertical}
.sub{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-top:18px;padding-bottom:4px}

@media (max-width:680px){
  .row{grid-template-columns:56px minmax(0,1fr) 44px;grid-template-areas:"d a th" "d w th" "d pl th" "d s th"}
  .row .date{grid-area:d}.row .acc{grid-area:a}.row .what{grid-area:w}.row .st{grid-area:s}.row .thumb{grid-area:th}.row .pls{grid-area:pl}
  .empty-day{grid-template-columns:56px minmax(0,1fr)}
  .panel{grid-template-columns:minmax(0,1fr)}
  .new{grid-template-columns:minmax(0,1fr) minmax(0,1fr);padding-left:0}
  .new input{grid-column:1/-1}
  .mbox{grid-template-columns:minmax(0,1fr)}
  .mside{border-left:none;border-top:1px solid var(--line)}
  .profile .ava{width:56px;height:56px}
  .idea-row{grid-template-columns:24px minmax(0,1fr) 28px;grid-template-areas:"c t x" ". k k"}
  .idea-row>input{grid-area:c}.idea-row .txt{grid-area:t}.idea-row .x{grid-area:x}
  .idea-row .kind,.idea-row .ctoggle{grid-area:k;justify-self:start}
  .idea-row .ctoggle{margin-left:110px}
  .thread{margin-left:0}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
/* ===== App shell in Plotinka style ===== */
.cal-bar{position:sticky;top:calc(var(--appbar-h,68px) + env(safe-area-inset-top,0px));z-index:7;transition:box-shadow .2s}
.cal-bar.stuck{box-shadow:0 8px 24px rgba(31,30,30,.12);border-radius:0 0 var(--radius) var(--radius)}
.bar-right{display:flex;gap:8px;flex:none}
.bar-right .ico{display:flex}.bar-right .full{display:none}
.bar-right .toggle{padding:6px 12px;min-height:36px}
.ico{display:none;align-items:center}
.mini{display:inline-block;width:18px;height:18px;border-radius:50%;position:relative;flex:none}
.mini::after{content:"";position:absolute;left:24%;right:24%;top:42%;height:26%;border:2px solid;border-top:none;border-radius:0 0 999px 999px}
.mini.buro{background:var(--pink)}.mini.buro::after{border-color:#1F1E1E}
.mini.design{background:#1F1E1E;box-shadow:0 0 0 1.5px var(--surface)}.mini.design::after{border-color:var(--pink)}
.mini.ov{margin-left:-7px}
.ico svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8}
.past button{width:100%;border:1px dashed var(--faint);background:transparent;color:var(--muted);border-radius:var(--radius);padding:12px;cursor:pointer;font-size:14px}
.past button:hover{color:var(--fg);border-color:var(--fg)}
.week.is-past{opacity:.6}

:root{--bg:#F2F2F2;--line:#E6E6E6;--radius:16px;--appbar:#1F1E1E;--appbar-fg:#FFFFFF}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--bg:#141313;--surface:#1F1E1E;--line:#333031;--appbar:#0E0D0D}}
:root[data-theme="dark"]{--bg:#141313;--surface:#1F1E1E;--line:#333031;--appbar:#0E0D0D}
body{padding-top:0}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--appbar)}
.wrap{gap:24px}
.appbar{position:sticky;top:env(safe-area-inset-top,0px);z-index:9;margin:0 calc(-1*max(16px,env(safe-area-inset-right,0px))) 20px calc(-1*max(16px,env(safe-area-inset-left,0px)));padding-block:12px;padding-left:max(16px,env(safe-area-inset-left,0px),calc((100% - 980px)/2 + 16px));padding-right:max(16px,env(safe-area-inset-right,0px),calc((100% - 980px)/2 + 16px));background:var(--appbar);color:var(--appbar-fg);display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px}
.brand{display:flex;align-items:center;gap:10px}
.logo{width:34px;height:34px;border-radius:50%;background:var(--pink);position:relative;flex:none}
.logo::after{content:"";position:absolute;left:25%;right:25%;top:42%;height:28%;border:3px solid #1F1E1E;border-top:none;border-radius:0 0 999px 999px}
.brand-name{font-weight:600;letter-spacing:.12em;font-size:14px;line-height:1.1}
.brand-sub{font-size:12px;opacity:.6;line-height:1.2}
.appbar .sync{color:rgba(255,255,255,.6);font-size:12px;text-align:right}
.tabs{justify-self:center;display:flex;gap:4px;background:rgba(255,255,255,.08);padding:4px;border-radius:999px;border:none;overflow:visible}
.tabs a{display:flex;align-items:center;gap:8px;padding:8px 16px;border-radius:999px;color:rgba(255,255,255,.7);font-weight:600;font-size:14px;text-decoration:none;border:none;margin:0;white-space:nowrap}
.tabs a svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8}
.tabs a[aria-current="page"]{background:var(--pink);color:#1F1E1E}
.tabs a:hover:not([aria-current]){color:#fff}
.sec-head{display:flex;flex-direction:column;gap:6px;padding-top:8px}
.sec-head h2{font-size:clamp(30px,5vw,44px);text-transform:uppercase;letter-spacing:.01em;line-height:1}
.sec-head p{margin:0;color:var(--muted);max-width:62ch;font-size:14px}
.feed-bar,section[data-view="calendar"]>.bar,section[data-view="ideas"]>.bar{background:var(--surface);border-radius:var(--radius);padding:12px}
.pills button,.toggle,select.sel{border-color:var(--line);background:var(--bg)}
.pills button[aria-pressed="true"],.toggle[aria-pressed="true"]{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.profile{background:var(--surface);border-radius:var(--radius);padding:16px}
.profile,.grid,.legend{width:100%;max-width:720px;margin-inline:auto}
.grid{border-radius:var(--radius);overflow:hidden;gap:2px;background:var(--surface)}
.tile{background-color:var(--line)}
.tile .ph{color:var(--fg)}
.tile.free{background:var(--pink-soft)}
.week{background:var(--surface);border-radius:var(--radius);padding:14px 16px 6px}
.wk-head{border-bottom:none;padding-bottom:10px}
.wk-head h3{font-size:16px;text-transform:uppercase;letter-spacing:.04em}
.day{border-bottom:1px solid var(--line)}
.day:last-child{border-bottom:none}
.ig{border-radius:var(--radius)}
.panel{background:var(--bg);border-radius:var(--radius);padding:16px;margin-bottom:12px}
.stats{background:var(--surface);border-radius:var(--radius);padding:12px 16px}
details.routes-box{border:none;border-radius:var(--radius)}
.ideas{background:var(--surface);border-radius:var(--radius);padding:4px 16px}
.idea:last-child{border-bottom:none}
.idea-new{background:var(--surface);border-radius:var(--radius);padding:12px}
.sub{padding-top:12px}
.empty-feed{background:var(--surface);border:none}
.mbox{border-radius:20px}
.totop{position:fixed;right:max(20px,env(safe-area-inset-right,0px));bottom:calc(24px + env(safe-area-inset-bottom,0px));z-index:8;width:52px;height:52px;border:none;background:var(--pink);color:#1F1E1E;cursor:pointer;display:grid;place-items:center;box-shadow:0 6px 20px rgba(31,30,30,.18)}
.totop svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2}
.totop[hidden]{display:none!important}
@media (max-width:760px){
  .appbar{grid-template-columns:1fr auto}
  .appbar .sync{max-width:140px;font-size:11px}
  .tabs{position:fixed;left:0;right:0;bottom:0;z-index:9;justify-self:stretch;width:100%;justify-content:space-around;border-radius:0;background:var(--appbar);padding:6px max(8px,env(safe-area-inset-left,0px)) calc(6px + env(safe-area-inset-bottom,0px))}
  .tabs a{flex-direction:column;gap:3px;font-size:11px;padding:6px 10px;border-radius:12px}
  .tabs a svg{width:22px;height:22px}
  body{padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))}
  .totop{bottom:calc(84px + env(safe-area-inset-bottom,0px))}
  .week{padding:12px}
  .cal-bar{flex-wrap:nowrap;gap:6px;padding:8px;overflow-x:auto;scrollbar-width:none}
  .cal-bar::-webkit-scrollbar{display:none}
  .cal-bar .pills{flex-wrap:nowrap;gap:6px}
  .cal-bar button{font-size:13px;padding:5px 11px;white-space:nowrap;flex:none;min-height:34px}
  .cal-bar .ico{display:flex}
  .cal-bar .full{display:none}
  .cal-bar{justify-content:space-between}
}


/* statuses from settings */
.st.cst{background:color-mix(in srgb,var(--c) 16%,var(--surface));color:color-mix(in srgb,var(--c) 78%,var(--fg))}
select.st.cst{background-color:color-mix(in srgb,var(--c) 16%,var(--surface))}
.what .marks .warn{color:var(--warn)}
.card{background:var(--surface);border-radius:var(--radius);padding:16px;display:flex;flex-direction:column;gap:12px}
.card h3{font-size:18px}
#settings-body{display:flex;flex-direction:column;gap:20px}
.st-list,.mem-list{display:flex;flex-direction:column}
.st-row,.mem-row{display:grid;grid-template-columns:40px minmax(0,1fr) auto auto 28px 28px 28px;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line)}
.mem-row{grid-template-columns:minmax(0,1fr) auto auto 28px}
.st-row input[type=color]{width:36px;height:32px;border:1px solid var(--line);border-radius:8px;padding:2px;background:var(--surface)}
.st-row input:not([type]),.mem-row select{font:inherit;font-size:14px;color:var(--fg);background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:6px 10px;min-width:0}
.x:disabled{opacity:.3;cursor:default}
.cmt .initial{width:28px;height:28px;border-radius:50%;background:var(--pink);color:#1F1E1E;display:grid;place-items:center;font-size:13px;font-weight:600}
@media (max-width:760px){.st-row{grid-template-columns:40px minmax(0,1fr) 28px 28px 28px}.st-row>.st,.st-row>.note{display:none}.tabs a{padding:6px 6px}}

/* settings button, right side of the app bar */
.appbar-right{display:flex;align-items:center;gap:12px;justify-self:end;min-width:0}
.gear{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:rgba(255,255,255,.75);background:rgba(255,255,255,.08);flex:none}
.gear svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7}
.gear:hover{color:#fff}
.gear.on{background:rgba(255,255,255,.18);color:#fff}
.gear[hidden]{display:none!important}

/* status caption is shown only for problems */
.appbar .sync{display:none}
.appbar .sync.alert{display:block;color:#F2C27A}