@import url('https://fonts.googleapis.com/css2?family=Dela+Gothic+One&family=Golos+Text:wght@400..800&family=Yomogi&display=swap');

:root {
  --display-font: 'Dela Gothic One', 'Golos Text', 'Segoe UI', sans-serif;
  --note-font: 'Yomogi', 'Golos Text', 'Segoe UI', sans-serif;
}
:root{--bg:#f7f5f0;--surface:#fff;--ink:#292923;--muted:#605e54;--green:#3f5f53;--green-dark:#304c41;--line:#dfd9ce;--soft:#eef3ed;--accent:#d67d60;--tg-safe-top:0px;--tg-safe-bottom:0px;--sidebar:#eae6df;--paper:#fffdf6;--paper-grid:#dedbd066;--tape:#d8c6a4b8;--paper-shadow:#41382430;color-scheme:light}
*{box-sizing:border-box}body{margin:0;font-family:'Golos Text','Segoe UI',sans-serif!important;background:var(--bg);color:var(--ink);font-size:14px}button,input,textarea,select{font:inherit}button,a,input,textarea,select{outline-offset:4px}button{cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}a{color:var(--green);text-decoration:none}a:hover{text-decoration:underline}button{border:0}h1,h2,h3,p{margin:0}button .mud-icon-root,a .mud-icon-root{flex-shrink:0}.primary-button,.soft-button,.icon-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:9px;padding:11px 16px;line-height:1.4;font-weight:700;transition:background .15s,transform .15s}.primary-button{background:var(--green);color:white;border:1px solid var(--green)}.primary-button:hover{background:var(--green-dark);text-decoration:none}.soft-button{background:var(--surface);border:1px solid var(--line);color:var(--ink)}.soft-button:hover{background:var(--soft)}.icon-button{padding:9px;background:transparent;color:var(--muted)}.icon-button:hover{background:var(--soft);color:var(--green)}.full{width:100%}.brand{display:flex;align-items:center;gap:9px;color:var(--ink);font-size:30px;font-weight:800;letter-spacing:-1.7px;line-height:1}.brand:hover{text-decoration:none}.brand-icon{background:var(--green);color:#fff;display:inline-flex;border-radius:11px;padding:8px}.brand-icon .mud-icon-root{font-size:25px}.brand-dot{color:var(--accent);margin-left:-8px}.app-shell{display:flex;min-height:100vh}.sidebar{width:246px;position:fixed;inset:0 auto 0 0;background:var(--sidebar);border-right:1px solid var(--line);padding:37px 23px 20px;display:flex;flex-direction:column;z-index:2}.sidebar .brand{margin:0 7px 38px}.company-name{display:flex;align-items:center;gap:9px;padding:13px 10px 29px}.company-name strong{font-size:13px;overflow-wrap:anywhere}nav{display:flex;flex-direction:column;gap:7px}.nav-item{display:flex;align-items:center;gap:12px;padding:14px 13px;border-radius:9px;background:transparent;color:var(--muted);text-align:left;font-weight:600;font-size:13px}.nav-item .mud-icon-root{font-size:21px}.nav-item.active{color:var(--green);background:var(--soft)}.nav-item:hover{background:var(--soft)}.nav-count{margin-left:auto;font-size:11px;background:#e2eadd;padding:1px 6px;border-radius:5px}.sidebar-bottom{margin-top:auto;padding-top:24px}.user-button{display:flex;align-items:center;gap:10px;padding:12px 6px;background:transparent;color:var(--ink);width:100%;text-align:left}.user-button>span:nth-child(2){display:flex;flex:1;flex-direction:column;gap:3px}.user-button strong{font-size:12px}.user-button small{font-size:10px;color:var(--muted)}.logout-button{background:transparent;color:var(--muted);font-size:10px;margin-left:52px;padding:5px}.avatar{height:37px;width:37px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:#ebe2d8;color:#8c7862;font-size:14px;font-weight:800;flex-shrink:0}.avatar.small{width:29px;height:29px;font-size:10px;border:2px solid var(--surface)}.avatar-stack{display:flex;padding-left:6px}.avatar-stack .avatar{margin-left:-6px}.avatar-stack .avatar:nth-child(2n){background:#e1e8dc;color:#62825c}.avatar-stack .avatar:nth-child(3n){background:#e9e3d6;color:#625b4c}.main-area{margin-left:246px;flex:1;min-width:0}.topbar{height:83px;display:flex;align-items:center;justify-content:space-between;padding:0 42px;border-bottom:1px solid var(--line);background:var(--surface);padding-top:var(--tg-safe-top)}.breadcrumb{font-size:11px;color:var(--muted)}.breadcrumb span{padding:0 12px;color:#c5cbc2}.top-actions{display:flex;align-items:center;gap:16px}.invite-button{font-size:11px;padding:8px 11px}.notice-button{position:relative;border-left:1px solid var(--line);border-radius:0;padding-left:17px}.unread-dot{position:absolute;top:9px;right:8px;width:6px;height:6px;border-radius:50%;background:var(--accent);border:1px solid var(--surface)}.page-content{max-width:1450px;margin:auto;padding:41px 42px 24px}.eyebrow{color:#969c90;letter-spacing:1.5px;font-size:9px;font-weight:800}.people-filter{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:26px}.person-chip{display:flex;align-items:center;gap:9px;background:transparent;border:1px solid transparent;border-radius:30px;padding:5px 13px 5px 5px;font-size:11px;color:var(--muted)}.person-chip .avatar{width:31px;height:31px;font-size:11px}.person-chip.selected{background:var(--surface);border-color:#d6dfd2;color:var(--ink);box-shadow:0 2px 4px #293d3405}.person-chip:hover{background:var(--surface)}.all-avatar{background:var(--soft);color:var(--green)}.filter-bar{display:flex;justify-content:space-between;gap:13px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:17px 0}.search-box{display:flex;align-items:center;gap:8px;min-width:170px;color:#929b90;flex:1;margin:0}.search-box input{width:100%;max-width:300px;border:0!important;background:transparent!important;padding:7px 0!important;color:var(--ink);font-size:11px}.search-box input::placeholder{color:#9ca297}.select-filters{display:flex;gap:10px}.select-filters select{background:var(--surface);border:1px solid var(--line);border-radius:7px;color:#626f62;padding:9px 27px 9px 10px;font-size:10px;max-width:160px}.list-caption{display:flex;justify-content:space-between;align-items:center;margin:19px 0 28px;font-size:10px;color:var(--muted)}.archive-toggle{display:flex;align-items:center;gap:6px;margin:0;font-size:10px}.archive-toggle input{accent-color:var(--green)}.section-heading{display:flex;align-items:center;gap:9px;margin-bottom:17px}.section-heading .avatar{width:28px;height:28px;font-size:10px}.section-heading h2{font-size:14px;font-weight:800}.section-count{background:#eaece5;color:#8b9485;border-radius:5px;padding:2px 6px;font-size:9px}.section-line{height:1px;background:var(--line);flex:1;margin-left:7px}.person-section{margin-bottom:30px}.gift-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px 24px}.page-footer{display:flex;align-items:center;justify-content:center;gap:7px;padding:23px 0 4px;color:#9da494;font-size:9px;text-align:center}.page-footer .mud-icon-root{font-size:14px}.empty-state{text-align:center;padding:45px 15px;color:var(--muted)}.empty-state>span{font-size:40px}.empty-state h2{font-size:18px;color:var(--ink);margin:14px 0}.empty-state p{font-size:12px;line-height:1.9;margin:8px 0 20px}.empty-state .soft-button{font-size:11px}.error-box,.success-box,.change-warning{padding:13px 16px;border-radius:9px;font-size:12px;line-height:1.8;margin-bottom:18px;background:#fff0e9;color:#9c5039;overflow-wrap:anywhere}.error-box button{color:inherit;background:transparent;text-decoration:underline}.success-box{background:#edf5e9;color:var(--green)}.change-warning{background:#fff8e6;color:#8a7139}.change-warning p{margin-top:7px;font-size:11px}dialog{border:1px solid var(--line);border-radius:18px;padding:27px;width:min(490px,calc(100% - 30px));max-height:88dvh;overflow:auto;background:var(--surface);color:var(--ink);box-shadow:0 25px 100px #14291e33}dialog::backdrop{background:#1c302658;backdrop-filter:blur(3px)}.dialog-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px;gap:10px}.dialog-heading h2{font-size:21px;font-weight:800;letter-spacing:-.5px}dialog p{line-height:1.85;font-size:13px;margin-bottom:15px}label{display:flex;flex-direction:column;gap:7px;font-size:11px;font-weight:600;margin-bottom:16px}label input:not([type=checkbox]),label select,label textarea,form>input{width:100%;border:1px solid #dfe4da;background:var(--surface);color:var(--ink);border-radius:8px;padding:12px 11px;font-size:12px;line-height:1.5}input:focus,textarea:focus,select:focus{outline:2px solid #8cae8d66;border-color:#8cae8d}textarea{resize:vertical}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:15px}.dialog-hint{color:var(--muted);font-size:11px!important;line-height:1.9!important}.dialog-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:24px}.participant-list{margin:20px 0;border-top:1px solid var(--line)}.participant-list>div{display:flex;align-items:center;gap:11px;padding:13px 0;border-bottom:1px solid var(--line)}.participant-list>div>span:nth-child(2){display:flex;flex-direction:column;gap:5px;flex:1;min-width:0}.participant-list strong{font-size:12px}.participant-list small{font-size:11px;color:var(--muted);overflow-wrap:anywhere}.transfer-form{margin:22px 0 7px}.text-danger{display:block;margin:15px auto 0;background:transparent;color:#b2715f;font-size:11px;padding:10px}.split-preview{font-size:31px;font-weight:800;color:var(--green);margin:22px 0}.split-preview span{font-size:12px;font-weight:500;color:var(--muted)}.notice-item{padding:14px 0;border-bottom:1px solid var(--line)}.notice-item p{margin-bottom:5px;font-size:12px}.notice-item small{color:var(--muted);font-size:10px}.onboarding{padding:40px 0}.onboarding h1{font-size:37px;margin:15px 0}.onboarding>p{color:var(--muted);line-height:1.9}.onboarding-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:35px}.onboarding-grid form{background:var(--surface);border:1px solid var(--line);padding:25px;border-radius:13px}.onboarding-grid h2{font-size:18px;margin-bottom:22px}.welcome{max-width:1200px;padding:45px;margin:auto}.welcome-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:50px;align-items:center;min-height:75vh}.welcome h1{font-size:61px;line-height:1.15;letter-spacing:-3px;font-weight:800;margin:23px 0}.welcome em{font-style:normal;color:var(--green)}.welcome-grid>div>p{max-width:440px;font-size:15px;line-height:1.9;color:var(--muted);margin-bottom:28px}.login-button{font-size:14px;padding:15px 24px}.welcome-points{display:flex;gap:16px;flex-wrap:wrap;margin-top:30px;font-size:10px;color:#82917d}.welcome-illustration{height:410px;position:relative;display:flex;align-items:center;justify-content:center;background:#edf0e4;border-radius:48% 45% 42% 49%;isolation:isolate}.present-box{font-size:150px;transform:rotate(-13deg);filter:drop-shadow(0 20px 12px #a18f6530)}.floating-note{position:absolute;border-radius:10px;background:var(--surface);padding:15px 18px;box-shadow:0 10px 30px #36452e0a;font-size:12px;font-weight:700;z-index:2}.note-one{top:39px;left:-20px;transform:rotate(-6deg)}.note-two{bottom:47px;right:-18px;transform:rotate(5deg)}.circle{position:absolute;border:1px solid #d6dfc8;border-radius:50%;z-index:-1}.c1{width:290px;height:290px;left:70px;top:40px}.c2{width:320px;height:320px;left:30px;top:70px}.demo-panel{border:1px dashed #c6d4be;border-radius:11px;padding:15px;max-width:420px;margin-top:22px}.demo-panel>span{font-size:11px;color:var(--green);font-weight:700}.demo-panel>div{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}.demo-panel .soft-button{font-size:11px;padding:8px 13px}.demo-panel small{display:block;color:var(--muted);font-size:9px;margin-top:11px}.boot{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;color:var(--green)}.boot-gift{font-size:65px}.boot strong{font-size:32px;font-weight:800}.boot p{font-size:12px;color:var(--muted)}.boot progress{accent-color:var(--green);height:4px;width:160px}#blazor-error-ui{display:none;position:fixed;bottom:0;width:100%;padding:15px;background:#fff0e9;color:#8c4932;z-index:10000}
@media(min-width:1600px){.gift-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1200px){.sidebar{width:215px;padding-left:15px;padding-right:15px}.main-area{margin-left:215px}.page-content{padding:32px 27px 22px}.topbar{padding-left:27px;padding-right:27px}.gift-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.filter-bar{flex-wrap:wrap}.search-box{flex-basis:100%}.select-filters{width:100%}.select-filters select{flex:1;max-width:none}}
@media(max-width:760px){.sidebar{position:fixed;inset:auto 0 0;width:100%;height:calc(67px + env(safe-area-inset-bottom) + var(--tg-safe-bottom));padding:0 8px calc(env(safe-area-inset-bottom) + var(--tg-safe-bottom));border-right:0;border-top:1px solid var(--line);flex-direction:row;z-index:10}.sidebar>.brand,.company-name{display:none}.sidebar nav{flex-direction:row;flex:1;gap:0}.nav-item{flex:1;justify-content:center;flex-direction:column;gap:3px;padding:9px 4px;font-size:8px;border-radius:0;position:relative}.nav-item .mud-icon-root{font-size:23px}.nav-count{position:absolute;top:7px;right:17%;font-size:8px;margin:0}.sidebar-bottom{margin:0;padding:0;width:52px;display:flex;align-items:center}.user-button{padding:0;justify-content:center}.user-button>.avatar{width:30px;height:30px;font-size:11px}.user-button>span:nth-child(2),.user-button>.mud-icon-root,.logout-button{display:none}.main-area{margin-left:0;margin-bottom:calc(80px + env(safe-area-inset-bottom) + var(--tg-safe-bottom))}.topbar{height:calc(64px + var(--tg-safe-top));padding-left:20px;padding-right:20px}.top-actions{gap:9px}.avatar-stack{display:none}.invite-button{font-size:10px;padding:7px 9px}.breadcrumb{font-size:10px}.breadcrumb span{padding:0 6px}.page-content{padding:27px 20px 16px}.people-filter{gap:4px;flex-wrap:nowrap;overflow:auto;margin:0 -20px 20px;padding:0 20px;scrollbar-width:none}.person-chip{flex-shrink:0;font-size:10px;padding-right:10px}.person-chip .avatar{width:29px;height:29px}.filter-bar{padding:12px 0;gap:8px}.select-filters{gap:6px}.select-filters select{min-width:0;font-size:9px;padding-left:6px;padding-right:18px}.section-heading h2{font-size:13px}.list-caption{font-size:9px;margin-bottom:21px}.page-footer{font-size:8px;line-height:1.9;align-items:flex-start}.page-footer .mud-icon-root{flex-shrink:0}.onboarding-grid{grid-template-columns:1fr}.onboarding h1{font-size:30px}.welcome{padding:27px 23px}.welcome-grid{grid-template-columns:1fr;gap:20px;min-height:0;margin-top:50px}.welcome h1{font-size:45px;letter-spacing:-2px}.welcome-grid>div>p{font-size:13px}.welcome-illustration{height:250px;max-width:350px;margin:20px auto;width:90%;grid-row:2}.present-box{font-size:110px}.floating-note{font-size:9px;padding:11px}.note-one{top:14px;left:-13px}.note-two{bottom:15px;right:-12px}.c1{width:180px;height:180px;left:50px;top:25px}.c2{width:200px;height:200px;left:30px;top:35px}dialog{padding:23px;max-height:85dvh}.dialog-heading h2{font-size:19px}}
@media(max-width:370px){}
:root[data-telegram-theme=dark]{--bg:#18221e;--surface:#222e28;--ink:#e4eae0;--muted:#a6b3a6;--line:#35443a;--soft:#2b3d31;--green:#78a68a;--green-dark:#5a856a;--sidebar:#25302a;--paper:#27352e;--paper-grid:#82968a24;--tape:#998a649e;--paper-shadow:#0008;color-scheme:dark}
:root[data-telegram-theme=dark] .primary-button{color:#15281d}:root[data-telegram-theme=dark] .person-chip.selected{border-color:#526b52}:root[data-telegram-theme=dark] label input,:root[data-telegram-theme=dark] label textarea{border-color:var(--line)}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
.search-box,.archive-toggle{flex-direction:row}

.coordinator-tag{font-size:9px;color:var(--green);background:var(--soft);padding:4px 6px;border-radius:5px}

/* Notebook paper tilts independently of the text and controls. */

.gift-card {
  --paper-angle: -0.9deg;
  --tape-angle: -4deg;
  position: relative;
  isolation: isolate;
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.gift-card:nth-child(even) {
  --paper-angle: 0.85deg;
  --tape-angle: 4deg;
}
.gift-card::before,
.gift-card::after {
  content: "";
  position: absolute;
  pointer-events: none;
  z-index: -1;
}
.gift-card::before {
  inset: 0 0 -5px;
  background-color: var(--paper);
  background-image:
    linear-gradient(to right, var(--paper-grid) 1px, transparent 1px),
    linear-gradient(to bottom, var(--paper-grid) 1px, transparent 1px);
  background-size: 18px 18px;
  transform: rotate(var(--paper-angle));
  mask: url('../paper-edge.svg') bottom / 136px 7px repeat-x,
        linear-gradient(#000 0 0) top / 100% calc(100% - 6px) no-repeat;
}
.gift-card { filter: drop-shadow(0 3px 4px var(--paper-shadow)); }
.gift-card::after {
  top: -7px;
  left: 26px;
  width: 62px;
  height: 15px;
  background: var(--tape);
  transform: rotate(var(--tape-angle));
}
.gift-content {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 24px 18px 18px;
}
.gift-eyebrow { color: var(--muted); font-size: 12px; margin-bottom: 6px; overflow-wrap: anywhere; }
.gift-content h3 { font-size: 18px; font-weight: 700; line-height: 1.3; overflow-wrap: anywhere; }
.gift-note {
  margin-top: 8px;
  font-family: var(--note-font);
  font-size: 17px;
  line-height: 1.4;
  letter-spacing: -.15em;
  color: var(--ink);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.price-row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 6px 12px;
  margin: 16px 0 10px;
}
.price-row strong { font-size: 16px; font-variant-numeric: tabular-nums; }
.price-row a { display: inline-flex; align-items: center; gap: 3px; font-size: 13px; text-decoration: underline; text-underline-offset: 3px; }
.price-row .mud-icon-root { font-size: 14px; }
.own-note, .state-line, .split-status, .card-actions .quiet-note {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.45;
}
.own-note, .state-line { display: flex; align-items: center; gap: 6px; }
.own-note .mud-icon-root, .state-line .mud-icon-root { flex-shrink: 0; font-size: 15px; }
.split-status { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 8px; }
.share-track { display: flex; gap: 4px; margin-top: 8px; }
.share-track span { height: 4px; border-radius: 3px; background: var(--line); flex: 1; }
.share-track .taken { background: var(--green); }
.card-actions { display: flex; flex-wrap: wrap; gap: 7px; margin-top: auto; }
.card-actions:not(:empty) { padding-top: 14px; }
.card-actions button { min-height: 44px; font-size: 13px; }
.card-actions .primary-button, .card-actions .soft-button { flex: 1 1 auto; padding: 8px 10px; }
.card-actions .icon-button { min-width: 44px; }
.card-actions .primary-button .mud-icon-root { font-size: 17px; }
.card-actions .soft-button { background: var(--paper); }
.card-actions .soft-button:hover { background: var(--soft); }
.quiet-note { color: var(--muted); }

.page-heading h1 { margin: 0; letter-spacing: -.035em; font-weight: 700; line-height: 1.12; }
.page-heading p { font-size: 14px; line-height: 1.55; }
.section-heading h2 { font-size: 17px; font-weight: 700; overflow-wrap: anywhere; }
.section-count { background: var(--soft); color: var(--muted); font-size: 12px; }
.person-section { margin-bottom: 36px; }
.person-chip, .list-caption, .archive-toggle { font-size: 12px; }
.person-chip, .search-box input, .select-filters select { min-height: 44px; }
.person-chip.selected { background: var(--soft); border-color: var(--green); }
.search-box input { font-size: 14px; }
.search-box input::placeholder { color: var(--muted); }
.select-filters select { color: var(--ink); font-size: 13px; }
:where(button, a, input, textarea, select):focus-visible {
  outline: 2px solid var(--green);
  outline-offset: 3px;
}
.search-box input:focus-visible { outline: 2px solid var(--green); }

@media (max-width: 760px) {
  .gift-grid { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  .gift-card { --paper-angle: -0.55deg; }
  .gift-card:nth-child(even) { --paper-angle: 0.55deg; }

  .page-heading p { font-size: 13px; max-width: 30ch; }
  .nav-item { font-size: 11px; }
  .nav-count { display: none; }
  .select-filters { flex-wrap: wrap; }
  .select-filters select { flex: 1 1 auto; max-width: 100%; }
}

/* Wishlist workspace */
.wishlist-shell {
  --cover: #203c33;
  --cover-ink: #fffaf0;
  --cover-muted: #e4e9dd;
  --ribbon: #ead09a;
  --index-tab: #fbf7ed;
  --index-ink: #4f4a3e;
  --portrait: #e2e9df;
  --portrait-ink: #365649;
}
:root[data-telegram-theme=dark] .wishlist-shell {
  --index-tab: #35443a;
  --index-ink: #e2dfd2;
  --portrait: #3b5245;
  --portrait-ink: #ecf3e7;
}
.wishlist-shell ::selection { color: #283a30; background: #eed7a8; }
.wishlist-shell .sidebar { border-right-color: var(--line); }
.brand,
.mobile-wordmark {
  color: var(--ink);
  font-family: var(--note-font);
  font-weight: 400;
  letter-spacing: -.19em;
}
.wishlist-shell .sidebar .brand { font-size: 29px; gap: 5px; margin-bottom: 34px; }
.wishlist-shell .brand-icon { padding: 7px; border-radius: 8px; margin-right: 2px; }
.wishlist-shell .brand-dot { margin-left: -7px; }
.wishlist-shell .company-name {
  gap: 11px;
  margin: 0 0 20px;
  padding: 12px 10px 15px;
  border-bottom: 1px solid var(--line);
  color: var(--index-ink);
}
.company-name > .mud-icon-root { color: var(--green); flex-shrink: 0; }
.company-name > div { display: grid; gap: 3px; }
.company-name small { color: var(--muted); font-size: 11px; }
.company-name strong { font-size: 14px; }
.wishlist-shell .nav-item {
  min-height: 46px;
  font-size: 13px;
  color: var(--index-ink);
}
.wishlist-shell .nav-item.active {
  background: var(--index-tab);
  color: var(--green);
  font-weight: 700;
}
.wishlist-shell .nav-count { color: var(--portrait-ink); background: var(--portrait); }
.wishlist-shell .sidebar-bottom { border-top: 1px solid var(--line); padding-top: 12px; }
.wishlist-shell .user-button { min-height: 44px; }
.user-button strong { overflow-wrap: anywhere; }
.wishlist-shell .logout-button { min-height: 32px; font-size: 12px; }
.wishlist-shell .topbar {
  background: var(--bg);
  height: calc(68px + var(--tg-safe-top));
  padding-top: var(--tg-safe-top);
}
.wishlist-shell .breadcrumb { font-size: 13px; }
.wishlist-shell .invite-button,
.wishlist-shell .notice-button { min-height: 44px; }
.wishlist-shell .invite-button { font-size: 13px; }
.wishlist-shell .notice-button { min-width: 44px; }
.mobile-wordmark { display: none; }
.mobile-wordmark span { color: var(--accent); }
.wishlist-shell .page-content { padding-top: 28px; }

.wishlist-cover {
  min-height: 244px;
  display: flex;
  align-items: center;
  margin-bottom: 22px;
  padding: clamp(24px, 4vw, 52px);
  border-radius: 16px;
  color: var(--cover-ink);
  background: var(--cover);
  background-image:
    linear-gradient(90deg, var(--cover) 28%, #203c33f4 38%, #203c3300 74%),
    url('../wishlist-cover.jpg');
  background-size: 100% 100%, min(76%, 760px) auto;
  background-position: center, right 55%;
  background-repeat: no-repeat;
}
.wishlist-cover-copy { width: min(56%, 520px); }
.welcome h1, .onboarding h1, .wishlist-cover h1 {
  font-family: var(--display-font);
  font-weight: 400;
  letter-spacing: -.025em;
  text-wrap: balance;
}
.wishlist-cover h1 {
  color: inherit;
  font-size: clamp(2rem, 3.9vw, 3.4rem);
  line-height: 1.12;
  overflow-wrap: anywhere;
}
.wishlist-cover p {
  max-width: 34ch;
  margin: 12px 0 21px;
  color: var(--cover-muted);
  font-size: 15px;
  line-height: 1.5;
  text-wrap: pretty;
}
.wishlist-shell .cover-add {
  min-height: 44px;
  border-color: var(--ribbon);
  background: var(--ribbon);
  color: #2d301f;
  font-size: 14px;
}
.wishlist-shell .cover-add:hover { background: #f5dfb1; }
.wishlist-shell .cover-add:focus-visible { outline-color: var(--cover-ink); }

.wishlist-shell .people-filter {
  flex-wrap: nowrap;
  gap: 8px;
  overflow-x: auto;
  padding: 5px 4px 8px;
  margin: 0 0 11px;
  scrollbar-width: thin;
  scrollbar-color: var(--line) transparent;
}
.wishlist-shell .person-chip {
  flex: 0 0 auto;
  max-width: min(220px, 75vw);
  padding: 4px 12px 4px 5px;
  background: var(--surface);
  border-color: var(--line);
  text-align: left;
}
.wishlist-shell .person-chip > span:last-child:not(.avatar) {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wishlist-shell .person-chip .avatar,
.wishlist-shell .section-heading .avatar {
  background: var(--portrait);
  color: var(--portrait-ink);
}
.wishlist-shell .person-chip:hover { background: var(--soft); }
.wishlist-shell .person-chip.selected {
  background: var(--soft);
  color: var(--green);
  border-color: var(--green);
  box-shadow: none;
  font-weight: 700;
}
.wishlist-shell .filter-bar {
  align-items: center;
  padding: 7px 9px;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 12px;
}
.wishlist-shell .search-box { padding-inline: 6px; color: var(--muted); }
.wishlist-shell .search-box input { max-width: none; font-weight: 500; }
.wishlist-shell .select-filters select { border-color: transparent; background: var(--soft); }
.wishlist-shell .list-caption { margin: 13px 0 23px; }
.wishlist-shell .list-caption strong { color: var(--ink); font-variant-numeric: tabular-nums; }
.wishlist-shell .archive-toggle {
  min-height: 36px;
  padding-inline: 8px;
  border-radius: 6px;
  cursor: pointer;
}
.wishlist-shell .archive-toggle:hover { background: var(--soft); }
.wishlist-shell .section-heading { gap: 11px; margin-bottom: 22px; }
.wishlist-shell .section-heading .avatar { width: 38px; height: 38px; font-size: 15px; }
.wishlist-shell .section-heading h2 { font-size: clamp(1.125rem, 2.1vw, 1.5rem); letter-spacing: -.025em; line-height: 1.18; min-width: 0; }
.section-self { color: var(--muted); font-size: 12px; white-space: nowrap; }
.wishlist-shell .section-count { flex: none; padding: 3px 7px; }
.wishlist-shell .section-line { min-width: 0; margin-left: 1px; }
.wishlist-shell .person-section { margin-bottom: 42px; }
.wishlist-shell .page-footer { font-size: 12px; color: var(--muted); }

@media (min-width: 761px) {
  .wishlist-shell .sidebar { overflow-y: auto; }
  .wishlist-shell .nav-item { justify-content: flex-start; }
  .wishlist-shell .sidebar .nav-item.active { box-shadow: inset 3px 0 var(--green); }
  .wishlist-shell .sidebar-bottom { margin-top: auto; }
}
@media (max-width: 1200px) {
  .wishlist-cover { background-size: 100% 100%, max(410px, 76%) auto; }
  .wishlist-shell .filter-bar { gap: 6px; }
  .wishlist-shell .select-filters select { min-width: 0; }
}
@media (max-width: 760px) {
  .wishlist-shell .topbar { height: calc(62px + var(--tg-safe-top)); }
  .wishlist-shell .breadcrumb { display: none; }
  .mobile-wordmark { display: block; font-size: 31px; line-height: 1; }
  .wishlist-shell .sidebar { background: var(--surface); }
  .wishlist-shell .sidebar-bottom { border: 0; padding-top: 0; }
  .wishlist-shell .nav-item { min-width: 0; font-size: 11px; }
  .wishlist-shell .nav-item.active { box-shadow: inset 0 2px var(--green); }
  .wishlist-shell .page-content { padding-top: 15px; }
  .wishlist-cover {
    align-items: flex-start;
    min-height: 0;
    padding: 23px 19px 116px;
    margin-bottom: 15px;
    background-image: linear-gradient(180deg, var(--cover) 0 45%, #203c3399 55%, #203c3300 70%),
                      url('../wishlist-cover.jpg');
    background-size: 100% 100%, max(112%, 390px) auto;
    background-position: center, right bottom;
  }
  .wishlist-cover-copy { width: 100%; }
  .wishlist-cover h1 { font-size: clamp(1.55rem, 6.7vw, 2.6rem); }
  .wishlist-cover p { font-size: 14px; margin: 9px 0 14px; }
  .wishlist-shell .cover-add { font-size: 13px; }
  .wishlist-shell .people-filter { margin-bottom: 8px; }
  .wishlist-shell .select-filters { flex-wrap: wrap; gap: 5px; }
  .wishlist-shell .select-filters select { flex: 1 1 auto; padding: 6px; font-size: 12px; }
  .wishlist-shell .list-caption { margin-bottom: 17px; }
  .wishlist-shell .section-heading { gap: 7px; }
  .wishlist-shell .section-heading .avatar { width: 33px; height: 33px; font-size: 13px; }
  .wishlist-shell .section-self { font-size: 11px; }
}
@media (max-width: 360px) {
  .wishlist-shell .invite-button { width: 44px; padding: 0; gap: 0; font-size: 0; }
}
