/* The couple's dashboard in the approved navy and gold look (desk-couple, 10 Nov 2026).
   Sits after css/occasi-dash*.css on couple.html, on top of css/occasi-desk-tokens.css. Every rule is under
   body.dk-couple, so Pro and admin (which share css/occasi-dash.css) never see it.
   Desktop (1024 px and wider): navy sidebar + 100 px navy header band + one row of tabs, mock-ups couple-01…17.
   Below 1024 px: nothing (no body.dk-couple there); the phone layout is the app's own, untouched. */

/* ---------- the look (body.dk-couple is set at 1024 px and wider only) */
body.dk-couple{background:var(--dk-bg);font-family:var(--dk-sans);color:var(--dk-ink);font-variant-numeric:lining-nums}
.dk-couple .btn{background:var(--dk-navy);border-color:var(--dk-navy);color:var(--dk-on-navy)}
.dk-couple .btn.ghost{background:none;color:var(--dk-mari);border-color:transparent;border-radius:0;box-shadow:none;min-height:44px;padding:0 10px}
.dk-couple .btn.ghost.danger{color:var(--dk-red);border-color:transparent}
.dk-couple .selbar .btn.ghost{color:#fff;border-color:transparent}
@media (hover:hover) and (pointer:fine){.dk-couple .btn.ghost:hover{background:none;text-decoration:underline;text-underline-offset:3px}}
.dk-couple .btn.gold,.dk-couple .btn.primary-gold{background:var(--dk-gold);border-color:var(--dk-gold);color:var(--dk-navy)}
.dk-couple .btn.danger{background:var(--dk-paper);color:var(--dk-red);border-color:#efd3d0}
.dk-couple .btn.danger:not(.ghost){background:var(--dk-red);border-color:var(--dk-red);color:#fff}
.dk-couple .chip[aria-pressed=true],.dk-couple .chip[aria-current=page],.dk-couple .chip[aria-selected=true]{background:var(--dk-navy);border-color:var(--dk-navy);color:var(--dk-on-navy)}
.dk-couple .card{border-color:var(--dk-line);border-radius:var(--dk-r)}
.dk-couple .head{border-bottom:1px solid var(--dk-line)}
.dk-couple .avatar{background:var(--dk-gold);border-color:var(--dk-gold);color:var(--dk-navy);font-family:var(--dk-serif);font-weight:600}
.dk-couple :focus-visible{outline-color:var(--dk-gold)}
.dk-couple .toast{background:var(--dk-navy);color:var(--dk-on-navy)}
.dk-couple dialog.sheet,.dk-couple .msheet{--bg:var(--dk-bg)}

/* ---------- 1024 px and wider: the mock-up frame */
@media (min-width:1024px){
  .dk-couple{--top:100px;--dock-h:0px}
  body.dk-couple .shell,body.dk-couple.no-mirror .shell{grid-template-columns:var(--dk-side) minmax(0,1fr)}
  .dkc-side a{text-decoration:none}
  body.dk-couple:not(.no-mirror) .shell{grid-template-columns:var(--dk-side) minmax(0,1fr) var(--mirror)}
  .dk-couple .dkc-side{grid-row:1/span 2;font-size:14px}
  .dk-couple .dkc-side .dk-brand img{width:34px;height:auto;filter:brightness(0) invert(1)}
  .dk-couple .dkc-side .dk-who b{overflow-wrap:anywhere}
  .dk-couple .dkc-side .dk-nav a svg,.dk-couple .dkc-side .dk-foot a svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}
  .dk-couple .dock{display:none!important}
  .dk-couple .main{padding:0 0 48px;min-width:0}

  /* the header band: the app's top bar, navy, 100 px, the page title on the left */
  .dk-couple .top.dkc-hd{position:relative;height:var(--dk-hd);margin:0;padding:22px var(--dk-gutter);gap:12px;align-items:flex-end;background:var(--dk-navy);color:var(--dk-on-navy);border:0;border-left:1px solid rgba(255,255,255,.06)}
  .dk-couple .top .brand,.dk-couple .top .couple-chip,.dk-couple .top .search-btn{display:none!important}
  .dkc-ht{min-width:0;flex:1;margin-right:auto}
  .dkc-ht small{display:block;height:14px;font:600 12px/14px var(--dk-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--dk-on-navy-2);margin-bottom:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .dkc-h1{margin:0;font:500 34px/1.05 var(--dk-serif);color:var(--dk-on-navy);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .dk-couple .top .search{flex:none;width:240px;max-width:none;height:38px;min-height:38px;margin:0;padding:0 14px;border:0;border-radius:99px;background:rgba(255,255,255,.08);color:var(--dk-on-navy-2);font-size:13px;white-space:nowrap;overflow:hidden}
  .dk-couple .top .search kbd{border-color:rgba(255,255,255,.2);color:var(--dk-on-navy-2);font-size:12px}
  .dk-couple .top .mirror-fab{display:flex!important;align-items:center;gap:8px;height:44px;min-height:44px;padding:0 10px;border-radius:0;border:0;background:transparent;color:var(--dk-on-navy);font-weight:600;font-size:13px;box-shadow:none;position:static;transform:none}
  .dk-couple .top .mirror-fab .eye{display:inline-flex;background:none;color:inherit;width:auto;height:auto}
  .dk-couple .top .mirror-fab .fab-short{display:none}
  .dk-couple .top .mirror-fab .fab-long{display:inline}
  @media (hover:hover) and (pointer:fine){.dk-couple .top .mirror-fab:hover{text-decoration:underline;text-underline-offset:3px}}
  .dk-couple .top .help-btn{width:38px;height:38px;background:transparent;border-color:rgba(255,255,255,.3);color:var(--dk-on-navy)}
  .dk-couple .top .avatar{width:38px;height:38px;margin-left:0}

  /* one row of tabs under the band (the app's own chip rows stay for phones) */
  #dkc-tabs-host{padding:18px var(--dk-gutter) 0;max-width:var(--dk-wide)}
  #dkc-tabs-host:empty{display:none}
  .dkc-tabs{margin:0;flex-wrap:wrap}
  .dkc-tabs a{font-size:14px}
  .dk-couple #view>.gtabs,.dk-couple #view>.subtabs,.dk-couple #view .head+.gtabs,.dk-couple #view .gtabs.subtabs{display:none!important}
  .dk-couple #view{padding:24px var(--dk-gutter) 0;max-width:var(--dk-wide)}

  /* the screen's own heading: an h2 under the band's h1, shown unless it repeats the band (then it is screen-reader text) */
  .dk-couple #view>header.head,.dk-couple #view>div>header.head{padding:0 0 16px;border-bottom:0;align-items:center;gap:20px;flex-direction:row;justify-content:space-between}
  .dk-couple #view h2.dkc-vh1{font:500 38px/1.02 var(--serif);letter-spacing:-.02em;margin:0}
  .dk-couple #view>header.head h2.dkc-vh1.dkc-shown,.dk-couple #view>div>header.head h2.dkc-vh1.dkc-shown{font:500 30px/1.1 var(--serif);letter-spacing:-.01em;color:var(--dk-ink);margin:0 0 6px}
  .dk-couple #view>header.head :is(h1,.dkc-vh1:not(.dkc-shown)),.dk-couple #view>div>header.head :is(h1,.dkc-vh1:not(.dkc-shown)){position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .dk-couple #view>header.head p,.dk-couple #view>div>header.head p{margin-top:0;color:var(--dk-ink2);font-size:15px;max-width:72ch}
  .dk-couple #view>header.head:not(:has(p,.actions,button,a,.dkc-shown)){display:none}

  /* the same type as the mock-ups */
  .dk-couple .sec{margin-top:28px}
  .dk-couple .sec-h h2{font:500 24px/1.15 var(--dk-serif)}
  .dk-couple .sec-h p{font-size:14px}
  .dk-couple .card{padding:20px 22px}

  /* the guest preview: only on its own page (#preview), the main column then holds it */
  .dk-couple.dkc-preview #view>*:not(.dkc-page){display:none!important}
  body.dk-couple.dkc-preview{--dkc-mw:clamp(380px,30vw,460px)}
  body.dk-couple.dkc-preview .shell{grid-template-columns:var(--dk-side) minmax(0,1fr) var(--dkc-mw)}
  .dk-couple .mirror{background:var(--dk-soft);border-left:1px solid var(--dk-line)}
}

/* ---------- desktop pages (js/occasi-desk-couple-pages.js) */
@media (min-width:1024px){
  .dkc-page a{text-decoration:none}
  .dkc-page .dk-cols{gap:16px}
  .dkc-home{margin-top:0}
  .dkc-small{font-size:13px}
  .dkc-onhero{background:transparent!important;color:var(--dk-on-navy)!important;border-color:rgba(255,255,255,.5)!important}
  .dkc-hero{background-color:var(--dk-navy)}
  .dkc-hero h2{overflow-wrap:anywhere}
  .dkc-invcard{display:block;color:var(--dk-ink)}
  .dkc-invcard>b{font-weight:600}
  .dkc-invcard .dk-sect{margin:0}
  .dkc-pair .dk-key .dk-btn{flex:none}
  .dkc-evsel select{height:38px;border:1px solid var(--dk-line2);border-radius:10px;background:var(--dk-paper);padding:0 12px;font:500 14px var(--dk-sans);color:var(--dk-ink)}
  .dk-seg button[aria-pressed=true]{background:var(--dk-paper);color:var(--dk-ink);font-weight:600;box-shadow:0 1px 2px rgba(31,28,25,.08)}
  .dkc-memic{background:var(--dk-gold-soft)!important;color:var(--dk-mari)!important}
  .dkc-lead{color:var(--dk-ink2);font-size:15px;margin:0 0 16px;max-width:72ch}

  /* Needs you, as the mock-up's strips: one line each, its buttons on the right */
  .dkc-home .needs-sec .sec-h{margin:6px 2px 10px}
  .dkc-home .needs-sec .sec-h h2{font:600 12px/1 var(--dk-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--dk-muted)}
  .dkc-home .needs-sec .sec-h h2 .count{font:600 15px/1 var(--dk-sans);min-width:0;height:auto;padding:0;margin-left:6px;border-radius:0;background:none;color:var(--dk-ink2);vertical-align:baseline}
  .dkc-home .needs{display:flex;flex-direction:column;gap:8px}
  .dkc-home .needs .msg{display:flex;align-items:center;gap:14px;padding:12px 16px;margin:0;border:1px solid var(--dk-line);border-radius:12px;background:var(--dk-paper)}
  .dkc-home .needs .msg:first-child{background:var(--dk-red-bg);border-color:#efd3d0;color:var(--dk-red)}
  .dkc-home .needs .msg .av{display:none}
  .dkc-home .needs .msg>div{display:flex;align-items:center;gap:14px;flex:1;min-width:0;flex-wrap:wrap}
  .dkc-home .needs .msg p{flex:1 1 280px;min-width:0;font-size:14px;margin:0;color:inherit}
  .dkc-home .needs .msg .acts{display:flex;gap:8px;flex-wrap:wrap;margin:0;align-items:center}
  .dkc-home .needs .msg .acts .note{flex-basis:100%;font-size:12.5px;color:var(--dk-muted)}
  .dkc-home .needs .msg .btn{min-height:32px;height:32px;padding:0 13px;font-size:13px}
  .dkc-home .needs .msg.dkc-fold{display:none}
  .dkc-more-btn{margin-top:8px;margin-left:-10px;border:0;border-radius:0;background:none;color:var(--dk-mari);height:44px;padding:0 10px;font-size:14px;font-weight:600}
  .dkc-more>*{margin-top:12px}
  .dkc-home [data-dkc="lately"] .sec-h h2{font:600 12px/1 var(--dk-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--dk-muted)}
  .dkc-home [data-dkc="lately"]>*{background:var(--dk-paper);border:1px solid var(--dk-line);border-radius:var(--dk-r);padding:16px 18px}
}
@media (min-width:1024px){
  body.dk-couple::after{display:none!important}
  .dk-couple .selbar{left:calc(var(--dk-side) + (100vw - var(--dk-side)) / 2)!important;bottom:24px}
  .dk-couple .toast,.dk-couple .undo-bar{left:calc(var(--dk-side) + (100vw - var(--dk-side)) / 2)}
}
.dk-couple .top .search .dk-i{display:none}
@media (min-width:1024px){
  .dk-couple .top .search{gap:8px;width:260px}
  .dk-couple .top .search .dk-i{display:inline-block;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6}
  .dk-couple .top .search .dkc-sl{overflow:hidden;text-overflow:ellipsis}
}
@media (max-width:1023.98px){ .dk-couple .top .search .dkc-sl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} }
/* 02 Guests: the table in place of the app's list (the app's list stays for phones and for its own paging row) */
@media (min-width:1024px){
  .dk-couple #g-rows>.ev-legend,.dk-couple #g-rows>.hh-head,.dk-couple #g-rows>#hh-list,.dk-couple #g-rows>ul.hh{display:none}
  .dkc-gtable{overflow:hidden;margin-bottom:12px}
  .dkc-gtable .dk-tbl th{background:var(--dk-paper)}
  .dkc-gtable .dk-tbl td{padding:10px 14px}
  .dkc-gtable .dkc-cb{width:40px;padding-right:0}
  .dkc-gtable .dkc-cb input{width:16px;height:16px;accent-color:var(--dk-navy)}
  .dkc-open{display:block;text-align:left;background:none;border:0;padding:0;cursor:pointer;color:var(--dk-ink);font:inherit;min-width:0}
  .dkc-open b{display:block;font-weight:500;font-size:14px}
  .dkc-open small{display:block;color:var(--dk-muted);font-size:12.5px;margin-top:2px}
  .dkc-open:hover b{text-decoration:underline;text-underline-offset:3px}
  .dkc-gtable tr:hover td{background:var(--dk-soft)}
  .dkc-gtable .dk-tag.dk-bad{background:var(--dk-red-bg);color:var(--dk-red);border-color:#efd3d0}
  .dkc-gtable .evdots{display:inline-flex;gap:4px}
  .dk-couple .gsplit{gap:20px}
  .dk-couple .gtools{gap:12px}
}
@media (min-width:1024px){
  /* the household panel only takes room once a household is open (mock-up: the table is full width) */
  .dk-couple .gsplit:has(> #g-detail > p.empty:only-child){grid-template-columns:minmax(0,1fr)}
  .dk-couple .gsplit:has(> #g-detail > p.empty:only-child)>#g-detail{display:none}
  .dk-couple .gsplit:has(> #g-detail:not(:has(> p.empty:only-child))){grid-template-columns:minmax(0,1fr) 380px}
  .dk-couple .gsplit:not(:has(> #g-detail)){grid-template-columns:minmax(0,1fr)}
  .dkc-gtable .dk-tbl td:nth-child(2){min-width:220px}
  .dkc-gtable .dk-tbl td:not(:nth-child(2)){white-space:nowrap}
}
@media (min-width:1024px) and (max-width:1279.98px){
  .dk-couple .gsplit:has(> #g-detail:not(:has(> p.empty:only-child))){grid-template-columns:minmax(0,1fr) 340px}
  .dkc-gtable .dk-tbl td:nth-child(2){min-width:180px}
}
/* 03 Household page: the open household fills the page, the list waits behind "Back to the guest list" */
@media (min-width:1024px){
  .dk-couple .gsplit.dkc-hh-open{grid-template-columns:minmax(0,1fr)!important}
  .dk-couple .gsplit.dkc-hh-open>#g-rows{display:none}
  .dk-couple .gsplit.dkc-hh-open>#g-detail{position:static;max-height:none;overflow:visible;background:var(--dk-paper);border:1px solid var(--dk-line);border-radius:var(--dk-r);padding:22px 26px}
  .dk-couple.dkc-hh #view>.gtools,.dk-couple.dkc-hh #view>#g-active,.dk-couple.dkc-hh #view>.ad-sides,.dk-couple.dkc-hh #view>.seen-line,.dk-couple.dkc-hh #view>.ad-gk-contacts,.dk-couple.dkc-hh #view>.chg-slot,.dk-couple.dkc-hh #view>.gactions,.dk-couple.dkc-hh #view>header.head{display:none}
  .dkc-back{display:inline-flex;align-items:center;gap:6px;background:none;border:0;padding:0;margin:0 0 14px;color:var(--dk-mari);font:600 13px var(--dk-sans);cursor:pointer}
  .dkc-back .dk-i{width:16px;height:16px}
  .dk-couple #g-detail table{width:100%;border-collapse:collapse}
  .dk-couple #g-detail thead th{font:600 12px/1.2 var(--dk-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--dk-muted);text-align:left;padding:10px 12px;border-bottom:1px solid var(--dk-line)}
  .dk-couple #g-detail td{padding:10px 12px;border-top:1px solid var(--dk-line)}
}
/* 04 Replies and reminders: the table and the list on the left, reminding and the reply settings on the right */
@media (min-width:1024px){
  .dk-couple #rm-body>.dkc-replies{grid-template-columns:minmax(0,1fr) 360px}
  .dkc-tblwrap{overflow-x:auto}
  .dkc-replies .dk-tbl td small{margin-top:2px}
  .dkc-replies .dkc-in{min-width:150px}
  .dkc-meter{display:block;height:6px;border-radius:99px;background:var(--dk-line);overflow:hidden;margin:2px 0 5px}
  .dkc-meter i{display:block;height:100%;background:var(--dk-navy);border-radius:inherit}
  .dkc-remind{display:block;min-height:0;padding:22px 24px}
  .dkc-remind small.dk-eb{display:block;font:600 12px/1 var(--dk-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--dk-gold);margin-bottom:10px}
  .dkc-remind b{display:block;font:600 19px/1.25 var(--dk-sans);color:#fff}
  .dkc-remind p{margin:8px 0 16px;color:var(--dk-on-navy-2,#d9dbe2);font-size:14px;line-height:1.45}
  .dkc-replies ul.rm-list{list-style:none;margin:0;padding:0;overflow:hidden}
  .dkc-replies ul.rm-list>li.rm-row{display:flex;align-items:center;gap:14px;padding:13px 18px;margin:0;border:0;border-top:1px solid var(--dk-line);border-radius:0;background:none}
  .dkc-replies ul.rm-list>li.rm-row:first-child{border-top:0}
  .dkc-replies .rm-who{flex:1;min-width:0}
  .dkc-replies .rm-row .gactions{margin:0;flex:none;flex-wrap:wrap;justify-content:flex-end}
  .dkc-replies .rm-cards{margin-top:12px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
  .dkc-replies [data-dkc="tools"]{display:flex;flex-direction:column;gap:12px}
  .dkc-replies [data-dkc="tools"]>p.help{margin:0 4px;font-size:13px}
  .dkc-replies #rm-auto{margin:0}
  .dkc-replies details.rm-msg{background:var(--dk-paper);border:1px solid var(--dk-line);border-radius:var(--dk-r);padding:14px 18px;margin:0}
  .dkc-replies details.rm-msg>summary{font-weight:600;cursor:pointer}
  .dkc-replies .dk-rows .dk-row .dk-tag,.dkc-chg{flex:none}
  .dkc-chg{font-size:13px;font-weight:600;color:var(--dk-mari)}
}
/* switches as in the mock-ups: green when on */
body.dk-couple .tog[aria-checked=true]{background-color:var(--dk-ok)}
@media (min-width:1024px){
  .dkc-replies .dkc-rv .dk-tbl td:first-child{min-width:230px}
  .dkc-replies .dkc-rv .dk-tbl th.dk-num,.dkc-replies .dkc-rv .dk-tbl td.dk-num{width:1%;padding-left:10px;padding-right:10px}
}
@media (min-width:1024px){
  body.dk-couple.no-mirror #mirror{display:none!important}
  .dkc-replies .dkc-rv .dk-tbl td:first-child{min-width:190px}
  .dkc-replies .dkc-in{min-width:110px!important}
  .dkc-replies .dkc-rv .dk-tbl th{padding-left:10px;padding-right:10px}
}
/* narrower desks: the reply table fits its card (headings wrap, the event column gives way), never scrolls inside it */
@media (min-width:1024px) and (max-width:1439px){
  .dk-couple #rm-body>.dkc-replies{grid-template-columns:minmax(0,1fr) 320px}
  .dkc-replies .dkc-rv .dk-tbl th{white-space:normal;line-height:1.25;vertical-align:bottom}
  .dkc-replies .dkc-rv .dk-tbl td:first-child{min-width:140px}
  .dkc-replies .dkc-in{min-width:92px!important}
}
@media (min-width:1024px) and (max-width:1279px){
  .dk-couple #rm-body>.dkc-replies{grid-template-columns:minmax(0,1fr)}
  /* 1024-1279: Home, Dietary and Budget stack their side column under the main one, so nothing scrolls inside a card */
  body.dk-couple .dkc-home.dk-cols,body.dk-couple .dkc-diet>.dk-cols{grid-template-columns:minmax(0,1fr)}
}
/* 05 Dietary and allergies */
@media (min-width:1024px){
  .dkc-diet-top{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:16px}
  .dkc-diet-top .dk-btns{display:flex;gap:10px}
  .dkc-diet-top .dk-btn .dk-i{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7}
  .dkc-diet .dkc-need{display:flex;flex-wrap:wrap;gap:6px;align-items:center;min-width:170px}
  .dkc-diet .dk-tag.dk-bad{background:var(--dk-red-bg);color:var(--dk-red);border-color:#efd3d0}
  .dkc-diet .dk-tbl td:first-child{min-width:170px}
  .dkc-diet [data-dkc="dietnote"] p{margin:10px 4px 0;font-size:13px;color:var(--dk-muted)}
  .dkc-diet .dk-row .dk-ic .dk-i{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.6}
  .dkc-diet [data-dkc="final"] .final-nums{margin:0}
  .dkc-diet [data-dkc="final"] .final-card{background:var(--dk-paper);border:1px solid var(--dk-line);border-radius:var(--dk-r);padding:18px 20px}
  .dkc-diet [data-dkc="final"] .gactions{flex-direction:column;align-items:stretch}
}
/* 05b Text messages: the module's parts in two columns; its balance and top-up as the navy credit card */
@media (min-width:1024px){
  .dk-couple #sms-workspace>.dkc-texts{grid-template-columns:minmax(0,1fr) 360px}
  .dkc-texts [data-dkc="right"] .sms-header{background:var(--dk-navy);color:#fbf8f2;border-radius:var(--dk-r);padding:22px 24px;margin:0;border:0;display:block}
  .dkc-texts .sms-header .dkc-eb{display:block;font:600 12px/1 var(--dk-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--dk-gold);margin-bottom:10px}
  .dkc-texts .sms-header .sms-balance{display:flex;flex-direction:column;align-items:flex-start;gap:6px}
  .dkc-texts .sms-header .sms-balance strong{font:500 34px/1.05 var(--dk-serif);color:#fff}
  .dkc-texts .sms-header .sms-balance span{color:var(--dk-on-navy-2,#d9dbe2);font-size:14px}
  .dkc-texts .sms-header .sms-balance .button{margin-top:10px;background:var(--dk-gold);color:var(--dk-navy);border:0;border-radius:99px;font-weight:600;padding:9px 18px}
  .dkc-texts .sms-header .sms-header-note{color:var(--dk-on-navy-2,#d9dbe2);font-size:13px;margin:14px 0 0}
  .dkc-texts .sms-header .sms-header-note .text-link{color:var(--dk-gold);font-weight:600}
  .dkc-texts details.panel,.dkc-texts section.panel,.dkc-texts aside.panel{background:var(--dk-paper);border:1px solid var(--dk-line);border-radius:var(--dk-r);margin:0}
  .dkc-texts [data-dkc="right"] details.panel>summary{font-weight:600}
  .dkc-texts .sms-grid{margin:0}
}
@media (min-width:1024px){
  .dkc-texts .sms-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:16px;align-items:start}
  .dkc-texts details.panel>summary,.dkc-texts section.panel>h3,.dkc-texts details.panel>summary h3{font:600 15px/1.3 var(--dk-sans);color:var(--dk-ink);letter-spacing:0;text-transform:none}
  .dkc-texts details.panel,.dkc-texts section.panel,.dkc-texts aside.panel{padding:16px 18px}
  .dkc-texts .sms-preview-panel .eyebrow{color:var(--dk-muted);letter-spacing:.14em;font:600 12px/1 var(--dk-sans)}
  .dkc-texts .notice{margin:0}
}
/* 07 Seating: the editor framed as the mock-up (counts, the unseated list as a card, tables as cards) */
@media (min-width:1024px){
  .dkc-seatcounts{max-width:420px;margin:0 0 16px}
  .dk-couple #seat-root .seat-tools{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
  .dk-couple #seat-root .seat-tools .btn,.dk-couple #seat-root .seat-tools summary.btn{background:none;border:0;border-radius:0;box-shadow:none;color:var(--dk-mari);height:44px;min-height:44px;padding:0 10px;font-weight:600;font-size:14px}
  .dk-couple #seat-root .seat-tools .checks input{accent-color:var(--dk-navy)}
  .dk-couple #seat-root .seat-for{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:14px 0 6px}
  .dk-couple #seat-root .seat-for .pick{min-width:220px}
  .dk-couple #seat-root .seat-split{grid-template-columns:340px minmax(0,1fr);gap:20px}
  .dk-couple #seat-root .seat-pool{background:var(--dk-paper);border:1px solid var(--dk-line);border-radius:var(--dk-r);padding:16px 18px;top:16px}
  .dk-couple #seat-root .seat-pool .pool-h h3{font:600 12px/1 var(--dk-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--dk-muted);margin:0 0 12px}
  .dk-couple #seat-root .seat-pool .gsearch{width:100%;max-width:none}
  .dk-couple #seat-root .seat-tables{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
  .dk-couple #seat-root .tcard{background:var(--dk-paper);border:1px solid var(--dk-line);border-radius:var(--dk-r);box-shadow:none}
  .dk-couple #seat-root .seat-dock{top:100px}
}
@media (min-width:1024px) and (max-width:1279.98px){ .dk-couple #seat-root .seat-split{grid-template-columns:290px minmax(0,1fr)} }
/* 08 Your invitation: the overview */
@media (min-width:1024px){
  .dkc-inv.dk-cols.dk-even{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .dkc-invhero{overflow:hidden;padding:0}
  .dkc-invimg{aspect-ratio:9/5;background:var(--dk-soft) center/cover no-repeat}
  .dkc-invmeta{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 20px}
  .dkc-invmeta b{display:block;font:500 22px/1.2 var(--dk-serif);color:var(--dk-ink)}
  .dkc-invmeta small{display:block;color:var(--dk-muted);font-size:13px;margin-top:2px}
  .dkc-invmeta .dk-btn{flex:none;display:inline-flex;align-items:center;gap:8px}
  .dkc-invmeta .dk-i,.dkc-inv .dk-row .dk-ic .dk-i{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.6}
  .dk-tag.dkc-next{background:var(--dk-gold-soft);color:var(--dk-mari);border-color:#ead9b0}
  .dkc-muted-a{color:var(--dk-ink2)!important;font-weight:500!important}
  .dkc-inv [data-dkc="glance"]:empty{display:none}
  .dkc-inv .glance-mini{margin:0}
}
/* 08b Design and extras */
@media (min-width:1024px){
  .dkc-extras.dk-cols.dk-w3{grid-template-columns:minmax(0,.9fr) minmax(0,1fr) minmax(0,1fr)}
  .dkc-extras .dkc-invimg{aspect-ratio:4/3}
  .dkc-extras .dkc-invmeta .dk-btn{border:1px solid var(--dk-line2);background:var(--dk-paper);color:var(--dk-ink)}
}
@media (min-width:1024px) and (max-width:1279.98px){ .dkc-extras.dk-cols.dk-w3{grid-template-columns:minmax(0,1fr) minmax(0,1fr)} .dkc-extras>.dk-stack:first-child{grid-column:1 / -1;display:grid;grid-template-columns:1fr 1fr;gap:16px} }
@media (min-width:1024px){ .dk-couple #view:has(> .dkc-extras, > .dkc-inv)>header.head>div>p{display:none} }
/* 09 Events: the app's list and editor as the mock-up's two panes */
@media (min-width:1024px){
  .dk-couple .pass-tab .split{grid-template-columns:320px minmax(0,1fr);gap:24px;align-items:start}
  .dk-couple .pass-tab .split>.evlist{background:var(--dk-paper);border:1px solid var(--dk-line);border-radius:var(--dk-r);padding:6px 0 8px;position:sticky;top:16px}
  .dk-couple .pass-tab .split>.evlist .dkc-evcount{margin:10px 18px 4px}
  .dk-couple .pass-tab .evlist h4{font:600 12px/1 var(--dk-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--dk-muted);margin:14px 18px 6px}
  .dk-couple .pass-tab .evlist .evbtn{display:grid;grid-template-columns:10px minmax(0,1fr) auto;gap:12px;align-items:center;padding:11px 18px;margin:0;border:0;border-radius:0;background:none;color:var(--dk-ink);text-decoration:none}
  .dk-couple .pass-tab .evlist .evbtn .bar{width:9px;height:9px;border-radius:50%;background:var(--c)}
  .dk-couple .pass-tab .evlist .evbtn b{display:block;font:500 15px/1.3 var(--dk-sans)}
  .dk-couple .pass-tab .evlist .evbtn small{display:block;font-size:13px;color:var(--dk-muted)}
  .dk-couple .pass-tab .evlist .evbtn[aria-current=true]{background:var(--dk-soft);box-shadow:inset 3px 0 0 var(--dk-gold)}
  .dk-couple .pass-tab .evlist .evbtn:hover{background:var(--dk-soft)}
  .dk-couple .pass-tab .split>.ev-ed{background:var(--dk-paper);border:1px solid var(--dk-line);border-radius:var(--dk-r);padding:22px 26px}
}
/* 10 Preview as a guest: picker and "what they see" in the main column, the app's live phone on the right */
@media (min-width:1024px){
  body.dk-couple.dkc-preview .main{overflow:visible}
  body.dk-couple.dkc-preview .top.dkc-hd{margin-right:calc(-1 * var(--dkc-mw));position:relative;z-index:3}
  body.dk-couple.dkc-preview #mirror{display:flex!important;position:sticky;top:0;margin-top:var(--dk-hd);height:calc(100vh - var(--dk-hd));background:var(--dk-paper);border-left:1px solid var(--dk-line)}
  .dkc-preview-page.dk-cols{grid-template-columns:300px minmax(0,1fr)}
  .dkc-find{display:flex;align-items:center;gap:8px;height:40px;padding:0 14px;border:1px solid var(--dk-line2);border-radius:10px;background:var(--dk-paper);margin-bottom:10px}
  .dkc-find .dk-i{width:16px;height:16px;fill:none;stroke:var(--dk-muted);stroke-width:1.7;flex:none}
  .dkc-find input{border:0;outline:0;background:none;font:inherit;font-size:14px;width:100%;color:var(--dk-ink)}
  .dkc-find:focus-within{border-color:var(--dk-navy)}
  .dkc-pvlist{max-height:calc(100vh - 300px);overflow:auto}
  .dkc-pvlist .dk-row,.dkc-preview-page button.dk-row{width:100%;text-align:left;font:inherit;background:none;cursor:pointer}
  .dkc-pvlist .dk-row[aria-current=true]{background:var(--dk-soft)}
  .dk-tag.dkc-viewing{background:var(--dk-navy);color:#fff;border-color:var(--dk-navy)}
  .dkc-serif-h{font:500 24px/1.2 var(--dk-serif);color:var(--dk-ink);margin:0 0 6px}
  .dkc-dot{width:9px;height:9px;border-radius:50%;background:var(--c);flex:none}
  .dkc-preview-page .dk-tag.dk-bad{background:var(--dk-red-bg);color:var(--dk-red);border-color:#efd3d0}
}
@media (min-width:1024px) and (max-width:1279.98px){ .dkc-preview-page.dk-cols{grid-template-columns:minmax(0,1fr)} }
@media (min-width:1024px){ body.dkc-preview #dkc-tabs-host .dk-tabs a,body.dkc-preview #dkc-tabs-host .dk-tabs button{padding-left:9px;padding-right:9px;font-size:13.5px} }
@media (min-width:1024px){ .dkc-preview-page .dk-row .dk-t small{overflow-wrap:anywhere} .dkc-preview-page .dk-row .dk-btn{flex:none} }
/* 11 Send and share */
@media (min-width:1024px){
  .dkc-send.dk-cols{grid-template-columns:minmax(0,1fr) 380px}
  .dkc-send .dk-row .dk-btn{flex:none}
  .dkc-send button.dk-row{width:100%;text-align:left;font:inherit;background:none;cursor:pointer}
  .dkc-send .dk-tag.dk-amb{background:var(--dk-amb-bg,#fbf0d9);color:var(--dk-amb,#8a5a00);border-color:#efdcb0}
  .dkc-send .dk-ic .dk-i{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.6}
  .dkc-send [data-dkc="link"] section.sec,.dkc-send [data-dkc="qr"] section.sec,.dkc-send .dkc-more>section.sec,.dkc-send .dkc-more>div>section.sec{background:var(--dk-paper);border:1px solid var(--dk-line);border-radius:var(--dk-r);padding:18px 20px;margin:0}
  .dkc-send [data-dkc="link"] .linkbox{display:flex;gap:10px;align-items:center;min-width:0}
  .dkc-send [data-dkc="link"] .linkbox span{min-width:0;overflow-wrap:anywhere;font-size:13px}
  .dkc-send .dkc-more{display:flex;flex-direction:column;gap:14px}
  .dkc-send .dkc-more>*{margin-top:0}
  .dkc-send [data-dkc="qr"] .qr-section{display:block}
}
@media (min-width:1024px){ .dkc-send [data-dkc="link"] .sec-h{display:block} .dkc-send [data-dkc="link"] .sec-h h2{margin-bottom:4px} }
/* 11b Publish */
@media (min-width:1024px){
  .dkc-pub.dk-cols.dk-even{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .dkc-pub [data-dkc="check"]{display:flex;flex-direction:column;gap:14px}
  .dkc-pub #prepublish-check{background:var(--dk-paper);border:1px solid var(--dk-line);border-radius:var(--dk-r);padding:18px 20px;margin:0}
  .dkc-pub #prepublish-check h2{font:600 12px/1 var(--dk-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--dk-muted);margin:0 0 10px}
  .dkc-pub .chg-slot{margin:0}
  .dkc-pub #pub-host .page-heading{display:none}
  .dkc-pub #pub-host .publish-grid{display:flex;flex-direction:column;gap:14px}
  .dkc-pub #pub-host .publish-grid>.panel{background:var(--dk-paper);border:1px solid var(--dk-line);border-radius:var(--dk-r);margin:0;box-shadow:none}
}
/* 12 Plan overview: budget and payments | the app's timeline and checklist | planning tools */
.dkc-plan .dkc-budget{display:block;color:inherit;text-decoration:none}
.dkc-plan .dkc-budget .dk-a{font-size:13px;color:var(--dk-navy);font-weight:600}
.dkc-plan .dkc-big{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin:6px 0 10px}
.dkc-plan .dkc-big b{font:600 28px/1.1 var(--dk-serif,Georgia,serif);color:var(--dk-ink)}
.dkc-plan .dkc-big span{font-size:14px;color:var(--dk-muted)}
.dkc-plan .dkc-meter{display:block;height:6px;border-radius:99px;background:var(--dk-line);overflow:hidden;margin:0 0 8px}
.dkc-plan .dkc-meter i{display:block;height:100%;background:var(--dk-gold);border-radius:inherit}
.dkc-plan .dkc-budget small{font-size:13px;color:var(--dk-muted);overflow-wrap:anywhere}
.dkc-plan .dk-row.dk-due small{color:var(--dk-red,#a3322a)}
.dkc-plan button.dk-row{width:100%;text-align:left;font:inherit;background:none;border:0;border-top:1px solid var(--dk-line);cursor:pointer}
.dkc-plan .dk-rows>.dk-row:first-child{border-top:0}
.dkc-plan .dkc-memic{background:var(--dk-gold-soft);color:var(--dk-gold-ink)}
.dkc-plan #plan-body{min-width:0}
@media (min-width:1024px){
  .dk-couple .dkc-plan.dk-w3{grid-template-columns:minmax(0,300px) minmax(0,1fr) minmax(0,300px)}
}
@media (min-width:1024px) and (max-width:1279px){
  .dk-couple .dkc-plan.dk-w3{grid-template-columns:minmax(0,1fr) minmax(0,1.4fr)}
  .dk-couple .dkc-plan.dk-w3>.dk-stack:last-child{grid-column:1/-1}
}
@media (min-width:1024px){
  .dkc-plan #plan-body>section.sec{background:var(--dk-paper);border:1px solid var(--dk-line);border-radius:var(--dk-r);padding:20px 22px;margin:0 0 16px}
  .dkc-plan #plan-body>section.sec>.sec-h{display:block;margin-bottom:12px}
  .dkc-plan #plan-body>section.sec>.sec-h h2{font:600 18px/1.25 var(--dk-sans);margin:0 0 4px;white-space:normal}
  .dkc-plan #plan-body>section.sec>.sec-h p{margin:0;font-size:13px;color:var(--dk-muted)}
}
/* 13 Budget and suppliers: stats strip, costs as a table, contacts on the right */
@media (min-width:1024px){
  .dk-couple #bgt-body.dkc-bgt{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:20px 24px;align-items:start}
  .dk-couple #bgt-body.dkc-bgt>section.sec:first-child{grid-column:1/-1;background:var(--dk-paper);border:1px solid var(--dk-line);border-radius:var(--dk-r);padding:18px 22px;margin:0}
  .dk-couple #bgt-body.dkc-bgt>section.sec:not(:first-child){grid-column:1;margin:0;min-width:0}
  .dk-couple #bgt-body.dkc-bgt>.dkc-bside{grid-column:2;grid-row:2}
  .dkc-bgt .bgt-sum{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:0 0 14px}
  .dkc-bgt .bgt-sum>div{display:flex;flex-direction:column-reverse;align-items:center;justify-content:flex-end;gap:6px;padding:4px 12px;text-align:center;border-left:1px solid var(--dk-line);position:relative}
  .dkc-bgt .bgt-sum>div:first-child{border-left:0}
  .dkc-bgt .bgt-sum>div b{font:500 30px/1.1 var(--dk-serif,Georgia,serif);color:var(--dk-ink)}
  .dkc-bgt .bgt-sum>div .lab{font:600 12px/1 var(--dk-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--dk-muted)}
  .dkc-bgt .bgt-sum>div .link{order:-1;font-size:12px}
  .dkc-bgt .bgt-sum>div:first-child{flex-direction:column-reverse}
  .dkc-bgt>section.sec:first-child>p{margin:6px 0 0;font-size:13px}
  .dkc-bth{display:grid;grid-template-columns:minmax(0,1fr) 110px 130px 200px;gap:12px;padding:12px 16px;font:600 12px/1 var(--dk-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--dk-muted);background:var(--dk-paper);border:1px solid var(--dk-line);border-bottom:0;border-radius:var(--dk-r) var(--dk-r) 0 0;margin-top:14px}
  .dkc-bth span:nth-child(2),.dkc-bth span:nth-child(3){text-align:right}
  .dkc-bgt .bgt-list{background:var(--dk-paper);border:1px solid var(--dk-line);border-radius:0 0 var(--dk-r) var(--dk-r);margin:0;padding:0;list-style:none;overflow:hidden}
  .dkc-bgt .bgt-list>li.bgt-item{margin:0;border:0;border-top:1px solid var(--dk-line);border-radius:0;background:none;box-shadow:none}
  .dkc-bgt .bgt-list>li.bgt-item:first-child{border-top:0}
  .dkc-bgt .bgt-head{display:grid!important;grid-template-columns:minmax(0,1fr) 252px 200px;gap:12px;align-items:center;padding:14px 16px;width:100%;text-align:left}
  .dkc-bgt .bgt-head>span:first-child{min-width:0}
  .dkc-bgt .bgt-head>span:first-child b{display:block;font-weight:600}
  .dkc-bgt .bgt-head>span:first-child small{display:block;color:var(--dk-muted);font-size:13px;overflow-wrap:anywhere}
  .dkc-bgt .bgt-head>.amt{display:grid;grid-template-columns:110px 130px;gap:12px;text-align:right;align-items:center}
  .dkc-bgt .bgt-head>.amt b{font-weight:500}
  .dkc-bgt .bgt-head>.amt small{font-size:14px;color:var(--dk-ink)}
  .dkc-bgt .bgt-head>.dkc-nx{font-size:14px;min-width:0}
  .dkc-bgt .dkc-nx .dkc-muted{color:var(--dk-muted)}
  .dkc-bgt .dk-tag.dkc-late{background:var(--dk-red-bg,#fbe9e7);color:var(--dk-red,#a3322a);border:1px solid #f2c9c4}
  .dkc-bside button.dk-row{width:100%;text-align:left;font:inherit;background:none;border:0;border-top:1px solid var(--dk-line);cursor:pointer}
  .dkc-bside .dk-rows>.dk-row:first-child{border-top:0}
  .dkc-bside details.bgt-forgot{background:var(--dk-paper);border:1px solid var(--dk-line);border-radius:var(--dk-r);padding:14px 18px;margin:0}
  .dkc-bside details.bgt-forgot summary h3{font:600 15px/1.3 var(--dk-sans);margin:0;display:inline}
}
@media (min-width:1024px) and (max-width:1279px){
  .dk-couple #bgt-body.dkc-bgt{grid-template-columns:minmax(0,1fr) 300px}
  .dkc-bth{grid-template-columns:minmax(0,1fr) 84px 84px 150px}
  .dkc-bgt .bgt-head{grid-template-columns:minmax(0,1fr) 180px 150px}
  .dkc-bgt .bgt-head>.amt{grid-template-columns:84px 84px}
  .dkc-bgt .bgt-sum>div b{font-size:24px}
}
@media (min-width:1024px){
  .dkc-bgt .gtools{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
  .dkc-bgt .gtools .gsearch{flex:1 1 220px;margin:0}
  .dkc-bgt .gtools .pick{flex:0 0 auto;margin:0}
  .dkc-bgt .gtools .chips{margin:0}
  .dkc-bgt .gtools .segd{flex:0 0 auto;margin:0;width:auto}
  .dkc-bgt>section.sec:first-child>p.warn{display:inline-flex;flex-direction:row;align-items:center;white-space:nowrap;gap:6px;padding:0;border:0;border-radius:0;background:none;color:var(--dk-red);font-weight:700;margin:8px 16px 0 0}
  .dkc-bgt>section.sec:first-child>.meter{margin-top:4px}
}
@media (min-width:1024px) and (max-width:1279px){
  .dkc-bth{grid-template-columns:minmax(0,1fr) 92px 112px 150px!important}
  .dkc-bgt .bgt-head{grid-template-columns:minmax(0,1fr) 216px 150px!important}
  .dkc-bgt .bgt-head>.amt{grid-template-columns:92px 112px!important}
}
/* 14 On the day: day switch, run sheet, door, updates, printouts */
.dkc-day .dkc-dayseg{margin:0 0 18px;max-width:100%;overflow-x:auto}
.dkc-day .dkc-run{align-items:center}
.dkc-day .dkc-time{flex:0 0 64px;font:500 17px/1 var(--dk-serif,Georgia,serif);color:var(--dk-ink)}
.dkc-day button.dk-row{width:100%;text-align:left;font:inherit;background:none;border:0;border-top:1px solid var(--dk-line);cursor:pointer}
.dkc-day .dk-rows>.dk-row:first-child{border-top:0}
.dkc-day .dk-sect .dk-a{font-size:13px;font-weight:600;color:var(--dk-navy)}
@media (min-width:1024px) and (max-width:1279px){
  .dk-couple .dkc-day .dk-cols.dk-w3{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .dk-couple .dkc-day .dk-cols.dk-w3>:last-child{grid-column:1/-1}
}
/* 14b Memory book: the book beside its controls; part switches as a compact segment (also #day?part=…) */
@media (min-width:1024px){
  .dk-couple #view>.segd{display:inline-flex;width:auto;max-width:100%;margin:0 0 18px;background:var(--dk-seg);border-radius:12px;padding:3px;gap:2px;overflow-x:auto}
  .dk-couple #view>.segd>a{flex:0 0 auto;padding:7px 14px;border-radius:9px;font-size:13px;font-weight:500;color:var(--dk-ink2);white-space:nowrap;min-height:0;background:none;box-shadow:none}
  .dk-couple #view>.segd>a[aria-current],.dk-couple #view>.segd>a.on,.dk-couple #view>.segd>a[aria-selected=true]{background:var(--dk-paper);color:var(--dk-ink);font-weight:600;box-shadow:0 1px 2px rgba(31,28,25,.08)}
  .dk-couple #mem-body:has(>section.mb){display:grid;grid-template-columns:minmax(0,1fr) 400px;grid-template-rows:repeat(4,min-content) 1fr;gap:16px 24px;align-items:start}
  .dk-couple #mem-body>section.mb{grid-column:1;grid-row:1/-1;position:sticky;top:16px;margin:0}
  .dk-couple #mem-body>section.mb-ctl,.dk-couple #mem-body>section.sec:only-child{grid-column:2;background:var(--dk-paper);border:1px solid var(--dk-line);border-radius:var(--dk-r);padding:18px 20px;margin:0;min-width:0}
  .dk-couple #mem-body>section.sec:only-child{max-width:760px}
  .dk-couple #mem-body>section.mb-ctl .sec-h h2,.dk-couple #mem-body>section.sec:only-child .sec-h h2{font:600 17px/1.3 var(--dk-sans);margin:0 0 6px}
  .dk-couple #mem-body .mb-picks{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:10px 8px}
  .dk-couple #mem-body .mb-pick{min-width:0;font-size:12px;overflow-wrap:anywhere}
  .dk-couple #mem-body .linkbox span{overflow-wrap:anywhere}
}
@media (min-width:1024px) and (max-width:1279px){
  .dk-couple #mem-body:has(>section.mb){grid-template-columns:minmax(0,1fr) 340px}
}
/* 15 Planner and venue access: requests on the left, the team and the invite on the right */
@media (min-width:1024px){
  .dk-couple #access-body{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:16px 24px;align-items:start}
  .dk-couple #access-body>section.sec{background:var(--dk-paper);border:1px solid var(--dk-line);border-radius:var(--dk-r);padding:20px 22px;margin:0;min-width:0}
  .dk-couple #access-body>section.sec:first-child{grid-column:1;grid-row:1}
  .dk-couple #access-body>section.sec:nth-child(2){grid-column:2;grid-row:1}
  .dk-couple #access-body>#access-invite{grid-column:1;grid-row:2}
  .dk-couple #access-body>.okbox{grid-column:2;grid-row:2;margin:0}
  .dk-couple #access-body>section.sec>.sec-h{display:block}
  .dk-couple #access-body .sec-h h2{font:600 17px/1.3 var(--dk-sans);margin:0 0 4px}
  .dk-couple #access-body .sec-h p{font-size:13px;color:var(--dk-muted);margin:0 0 10px}
  .dk-couple #access-body .perm-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 16px}
}
@media (min-width:1024px) and (max-width:1279px){
  .dk-couple #access-body{grid-template-columns:minmax(0,1fr) 340px}
}
/* 16 Account: two columns of the app's own sections */
@media (min-width:1024px){
  .dk-couple #acc-body:has(>.dkc-accl){display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start}
  .dk-couple #acc-body .dkc-acard{background:var(--dk-paper);border:1px solid var(--dk-line);border-radius:var(--dk-r);padding:18px 20px;margin:0;min-width:0}
  .dk-couple #acc-body .dkc-acard .sec-h{display:block}
  .dk-couple #acc-body .dkc-acard .sec-h h2{font:600 17px/1.3 var(--dk-sans);margin:0 0 4px}
  .dk-couple #acc-body .dkc-acard .sec-h p{font-size:13px;color:var(--dk-muted);margin:0 0 10px}
  .dk-couple #acc-body .dkc-acard .plans{display:grid;grid-template-columns:1fr;gap:12px}
  .dk-couple #acc-body .dkc-accr .dk-row .dk-tag{flex:0 0 auto}
}
@media (min-width:1440px){
  .dk-couple #acc-body .dkc-acard .plans{grid-template-columns:1fr}
}
/* 17 Help and questions: the app's help form in a card, answers and contact on the right */
@media (min-width:1024px){
  .dk-couple #view:has(>.dkc-help)>#acc-body{display:none}
  .dkc-help.dk-cols{grid-template-columns:minmax(0,1fr) 360px;align-items:start}
  .dkc-help .dkc-serif-h{margin-bottom:14px}
  .dkc-help #acc-help{border:0;padding:0;margin:0;box-shadow:none;background:none;max-width:none}
  .dkc-help #acc-help .field{margin:0 0 14px}
  .dkc-help #acc-help textarea{min-height:120px}
  .dkc-help [data-acc-note]{margin:0 0 14px}
  .dkc-help button.dk-row{width:100%;text-align:left;font:inherit;background:none;border:0;border-top:1px solid var(--dk-line);cursor:pointer}
  .dkc-help .dk-rows>.dk-row:first-child{border-top:0}
  .dkc-help .dkc-muted{color:var(--dk-muted);margin:0 0 14px}
}
@media (min-width:1024px) and (max-width:1279px){
  .dkc-help.dk-cols{grid-template-columns:minmax(0,1fr) 300px}
}
/* links are never cut off: they wrap */
body.dk-couple #view .linkbox>span{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;min-width:0}
body.dk-couple #view .gl-url{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;min-width:0}
@media (min-width:1024px){ .dkc-gtable{overflow-x:auto} }
/* 13 Budget at 1024-1279: contacts go under the costs, so the cost rows keep their full width */
@media (min-width:1024px) and (max-width:1279px){
  .dk-couple #bgt-body.dkc-bgt{grid-template-columns:minmax(0,1fr)}
  .dk-couple #bgt-body.dkc-bgt>.dkc-bside{grid-column:1;grid-row:auto}
}
@media (min-width:1024px){ .dkc-bgt .dkc-nx{min-width:0} .dkc-bgt .dkc-nx .dk-tag{white-space:normal;line-height:1.3;height:auto;padding-top:3px;padding-bottom:3px} }
/* "Coming soon" cards (lead, 10 Nov): the drawn seating room, helpers and guest groups. Calm, no date promised. */
.dkc-soon .dk-tag{margin:0 0 10px}
.dkc-soon .dk-ttl2{margin:0 0 6px}
.dkc-soon p.dk-muted{margin:0;max-width:62ch;text-wrap:pretty}
.dkc-soonroom{margin-top:20px}
.dkc-soonlink{display:flex;align-items:center;gap:6px;margin-top:14px;padding-top:12px;border-top:1px solid var(--dk-line);font-weight:600;font-size:13.5px;color:var(--dk-ink)}
.dkc-soonlink .dk-chev{margin-left:auto;color:var(--dk-line2)}
.dkc-soonlink .dk-chev svg{width:16px;height:16px}
/* 1024–1100 px: the app draws its preview beside the page only from 1101 px, so the preview page drops the empty
   column and offers the app's own preview sheet instead (Fable review, 10 Nov) */
.dkc-pvopen{display:none}
@media (min-width:1024px) and (max-width:1100.98px){
  body.dk-couple.dkc-preview .shell{grid-template-columns:var(--dk-side) minmax(0,1fr)}
  body.dk-couple.dkc-preview #mirror{display:none!important}
  body.dk-couple.dkc-preview .top.dkc-hd{margin-right:0}
  .dkc-preview-page .dkc-pvopen{display:inline-flex;align-self:flex-start}
}

/* SEO 10 Nov (CLS 0.166 at 1440): 1024 px and wider, the page stays invisible until the desk frame is drawn (js/occasi-desk-couple.js
   boot() removes html.dkc-boot, which only js/occasi-pc.js adds, on a PC), so nothing jumps; hidden content never counts as a layout
   shift. Never trapped: a script error shows it at once and CSS after 6 s anyway. Phones: nothing (no class, no rule; the app's own
   layout, pixel-identical to live). */
@media (min-width:1024px){html.dkc-boot body>*{visibility:hidden;animation:dkc-boot-show 0s 6s forwards}}
@keyframes dkc-boot-show{to{visibility:visible}}