@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@1,700&display=swap');

:root { --ink:#24352f; --cream:#fbf6eb; --paper:#fffdf8; --coral:#e9785d; --yellow:#f2bd4b; --sage:#6e9b86; --line:#e8dece; }
* { box-sizing:border-box; }
[hidden] { display:none!important; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--cream); color:var(--ink); font-family:"DM Sans",Arial,sans-serif; }
button, input, select, textarea { font:inherit; }
button, a { -webkit-tap-highlight-color:transparent; }
button { cursor:pointer; }
.topbar { position:relative; height:76px; max-width:1240px; margin:auto; display:flex; align-items:center; padding:0 28px; border-bottom:1px solid rgba(36,53,47,.12); gap:34px; }
.topbar>* { position:relative; z-index:1; }
.brand { display:flex; align-items:center; gap:11px; text-decoration:none; color:var(--ink); font-size:19px; font-weight:700; white-space:nowrap; }
.brand-mark { position:relative; display:block; width:50px; height:50px; flex:0 0 50px; }
.brand-mark:before { content:""; position:absolute; inset:5px; border:3px double #b87917; border-radius:50%; background:radial-gradient(circle at 35% 28%,#ffe49b,#efb83f 68%,#c98214); box-shadow:0 3px 0 #925e13,0 7px 14px rgba(92,60,28,.18); }
.brand-mark:after { content:""; position:absolute; inset:9px; border:1px solid rgba(255,255,255,.7); border-radius:50%; }
.brand-mark img { position:absolute; z-index:2; left:50%; top:-5px; width:62px; height:62px; max-width:none; object-fit:contain; transform:translateX(-50%); filter:drop-shadow(0 3px 2px rgba(74,45,20,.18)); }
.brand-name { font-family:"Playfair Display",Georgia,serif; font-style:italic; font-size:22px; letter-spacing:-.7px; transform:rotate(-1deg); }
.brand-name>span { color:var(--coral); font-size:1.2em; }
nav { display:flex; align-items:center; gap:30px; margin-left:auto; }
nav a,.admin-link { color:#52635c; text-decoration:none; font-size:14px; font-weight:600; background:none; border:0; padding:8px 0; }
nav a:hover,.admin-link:hover { color:var(--coral); }
.header-avatars { display:flex; padding-left:10px; }
.mobile-account { display:none; }
.avatar { width:42px; height:42px; display:inline-grid; place-items:center; border-radius:50%; color:white; font-weight:700; border:3px solid var(--paper); flex:0 0 auto; }
.avatar-small { width:34px; height:34px; border-width:2px; font-size:13px; }
.header-avatars .avatar { margin-left:-10px; }
.avatar-more { background:#efe5d5!important; color:#6a766f; }
.hero { max-width:1184px; margin:0 auto; padding:68px 28px 84px; display:grid; grid-template-columns:.8fr 1.2fr; gap:80px; align-items:center; position:relative; }
.hero:before { content:""; position:absolute; width:230px; height:230px; left:-180px; top:20px; border-radius:50%; background:#f8d97e; opacity:.25; }
.eyebrow { color:var(--coral); font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:1.8px; }
h1 { margin:15px 0 24px; font-size:clamp(52px,6vw,80px); line-height:.96; letter-spacing:-4px; font-weight:700; }
h1 em { color:var(--coral); font-family:"Playfair Display",serif; font-weight:700; }
.hero-copy>p { font-size:18px; line-height:1.75; color:#65736d; max-width:470px; }
.doony-hello { width:min(390px,100%); margin-top:24px; display:flex; align-items:center; gap:14px; padding:10px 15px 10px 10px; border:1px solid #eadfce; border-radius:70px 18px 18px 70px; background:rgba(255,253,248,.82); box-shadow:0 12px 30px rgba(81,60,36,.08); }
.doony-hello img { width:82px; height:82px; flex:0 0 auto; border:4px solid white; border-radius:50%; object-fit:cover; object-position:center 21%; box-shadow:0 7px 18px rgba(86,58,33,.18); }
.doony-hello div { display:flex; flex-direction:column; gap:3px; }
.doony-hello b { color:#b75f48; font-size:13px; }
.doony-hello span { color:#6f7c76; font-size:11px; line-height:1.45; }
.hero-doodle { color:var(--coral); font-size:26px; letter-spacing:18px; margin-top:35px; transform:rotate(-5deg); }
.hero-doodle span { color:var(--yellow); }
.composer { background:var(--paper); border:1px solid #e8ded0; border-radius:24px; padding:28px; box-shadow:0 22px 60px rgba(81,60,36,.11); position:relative; }
.composer:after { content:""; position:absolute; width:75px; height:28px; background:rgba(238,185,80,.5); top:-10px; left:50%; transform:translateX(-50%) rotate(-2deg); }
.composer-title { display:flex; align-items:center; gap:13px; margin-bottom:22px; }
.sun-icon { width:44px; height:44px; display:grid; place-items:center; border-radius:50%; background:#fff0c7; color:#d99515; font-size:24px; }
.composer h2,.section-heading h2,.leader-intro h2,.modal h2 { margin:0; font-size:27px; letter-spacing:-1px; }
.composer-title p { margin:3px 0 0; color:#77817c; font-size:13px; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
label,legend { font-size:12px; font-weight:700; color:#52605a; letter-spacing:.2px; }
select,input,textarea { width:100%; border:1px solid #ded7cb; color:var(--ink); background:white; border-radius:10px; padding:11px 12px; margin-top:7px; outline:none; }
select:focus,input:focus,textarea:focus { border-color:var(--coral); box-shadow:0 0 0 3px rgba(233,120,93,.12); }
fieldset { border:0; padding:0; margin:19px 0; }
.kind-picker { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-top:8px; }
.kind-picker button { min-height:72px; border:1px solid #e5ddd2; background:#fff; border-radius:11px; color:#5c6963; font-size:11px; font-weight:600; position:relative; padding:10px 3px 6px; }
.kind-picker button>span { display:block; color:var(--coral); font-size:21px; margin-bottom:4px; }
.kind-picker button small { position:absolute; right:4px; top:4px; font-size:8px; border-radius:8px; padding:2px 4px; background:#f4eee4; }
.kind-picker button.active { border-color:var(--coral); background:#fff4ef; color:#a84e3b; box-shadow:0 0 0 1px var(--coral); }
textarea { min-height:88px; resize:vertical; line-height:1.5; }
.message-label { position:relative; display:block; }
.message-label textarea { padding-bottom:25px; }
.message-guidance { position:absolute; left:11px; bottom:8px; color:#8b9690; font-size:9px; font-weight:500; }
.message-counter { position:absolute; right:11px; bottom:8px; color:#9aa39e; font-size:9px; font-weight:600; }
.send-button { width:100%; border:0; border-radius:11px; background:var(--coral); color:#fff; font-weight:700; padding:14px; box-shadow:0 8px 18px rgba(221,103,75,.22); }
.send-button:hover { background:#da684e; transform:translateY(-1px); }
.send-button:disabled { opacity:.6; cursor:wait; }
.send-button span { float:right; }
.notice { text-align:center; color:#65736d; margin:12px 0 0; font-size:12px; }
.cooldown-note { margin:8px 0 0; text-align:center; color:#9a7469; font-size:10px; }
.content-section { background:#fffdf9; padding:80px max(28px,calc((100vw - 1128px)/2)); }
.section-heading { display:flex; justify-content:space-between; align-items:end; margin-bottom:28px; }
.section-heading h2,.leader-intro h2 { font-size:38px; margin-top:7px; }
.live-pill { background:#edf6ef; color:#5a8b6d; padding:7px 11px; border-radius:20px; font-size:11px; font-weight:700; }
.feed-controls { display:flex; flex-direction:column; align-items:flex-end; gap:8px; }
.week-label { color:#718078; font-size:11px; font-weight:700; }
.feed-controls div { display:flex; gap:7px; }
.feed-controls button,.admin-toolbar button,.confirm-reset button { border:1px solid var(--line); border-radius:8px; background:white; color:#596861; font-size:11px; font-weight:700; padding:7px 10px; }
.feed-controls button:disabled,.admin-toolbar button:disabled { opacity:.4; cursor:not-allowed; }
.feed-controls .toss-launch { border-color:#efb9aa; background:#fff3ee; color:#ad4f3b; }
.feed-pager { position:relative; padding-bottom:26px; }
.feed-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; align-items:start; }
.feed-card,.empty-card { border:1px solid var(--line); background:white; border-radius:16px; padding:22px; box-shadow:0 8px 25px rgba(61,50,34,.04); }
.feed-card { position:relative; aspect-ratio:1; min-width:0; padding:0; overflow:visible; display:flex; flex-direction:column; }
.feed-card:before { content:""; position:absolute; z-index:5; top:-9px; left:50%; width:72px; height:25px; border:1px solid rgba(202,157,69,.1); background:rgba(241,204,126,.76); box-shadow:0 3px 7px rgba(115,79,29,.08); transform:translateX(-50%) rotate(-1.5deg); pointer-events:none; }
.feed-art { height:27%; min-height:68px; flex:0 0 auto; overflow:hidden; position:relative; border-radius:15px 15px 0 0; background:#f6d76f; }
.feed-art-bg { width:100%; height:100%; display:block; object-fit:cover; object-position:center 50%; }
.feed-doony { width:39px; height:39px; flex:0 0 auto; border:3px solid rgba(255,255,255,.96); border-radius:50%; object-fit:cover; object-position:center 19%; background:var(--cream); box-shadow:0 4px 11px rgba(61,50,34,.18); }
.feed-card-body { min-height:0; padding:10px 14px 12px; display:flex; flex:1; flex-direction:column; }
.card-people { color:#5a6861; font-size:9px; }
.card-people b { color:#34463e; }
.card-kind-row { display:flex; justify-content:center; margin:6px 0 0; }
.feed-card .kind-badge { padding:5px 6px; font-size:8px; }
.feed-card .quote { min-height:48px; margin:7px 0 10px; font-size:14px; line-height:1.42; overflow-wrap:anywhere; }
.feed-card .feed-meta { gap:7px; margin-top:auto; font-size:8px; }
.feed-page-arrow { position:absolute; z-index:3; top:50%; width:56px; height:56px; margin-top:-40px; display:grid; place-items:center; border:1px solid #ead6cd; border-radius:50%; background:var(--coral); color:white; box-shadow:0 12px 28px rgba(133,75,59,.25); font-family:Georgia,serif; font-size:45px; line-height:1; }
.feed-page-prev { left:-72px; }
.feed-page-next { right:-72px; }
.feed-page-arrow:hover:not(:disabled) { background:#d9674e; transform:scale(1.05); }
.feed-page-arrow:disabled { opacity:.18; cursor:not-allowed; box-shadow:none; }
.feed-page-count { position:absolute; bottom:0; left:50%; transform:translateX(-50%); color:#8b958f; font-size:10px; font-weight:700; white-space:nowrap; }
.feed-top,.feed-meta { display:flex; align-items:center; justify-content:space-between; }
.feed-top { min-height:14px; justify-content:flex-start; }
.people { display:flex; align-items:center; }
.people .avatar:last-child { margin-left:-5px; }
.connector { width:30px; color:#ad9789; text-align:center; font-size:13px; }
.kind-badge { padding:6px 9px; border-radius:7px; background:#fff3e6; color:#b7664f; font-size:10px; font-weight:700; }
.quote { font-family:"Playfair Display",serif; font-style:italic; font-size:19px; line-height:1.55; min-height:58px; margin:19px 0; }
.feed-meta { padding-top:13px; border-top:1px solid #eee7dd; color:#84908a; font-size:10px; }
.feed-meta b { color:#4e5d56; }
.empty-card { text-align:center; padding:55px; color:#7b8681; }
.leader-section { padding:86px max(28px,calc((100vw - 1050px)/2)); display:grid; grid-template-columns:.9fr 1.1fr; gap:80px; align-items:center; overflow:hidden; background:#f2eadc; }
.leader-intro p { color:#6e7b75; line-height:1.7; max-width:430px; }
.level-key { display:flex; gap:8px; flex-wrap:wrap; margin-top:24px; }
.level-key span { background:rgba(255,255,255,.65); border-radius:8px; padding:8px; color:#bf785b; font-size:10px; }
.level-key b { display:block; color:#65736d; margin-top:3px; }
.leader-card { border-radius:18px; overflow:hidden; background:#fff; box-shadow:0 20px 45px rgba(79,65,41,.11); border:1px solid #e2d8c8; }
.leader-board-wrap { position:relative; isolation:isolate; }
.leader-board-wrap .leader-card { position:relative; z-index:2; }
.leader-treasure { position:absolute; z-index:1; left:-92.5px; bottom:-21.5px; width:125px; height:auto; filter:drop-shadow(0 9px 9px rgba(81,55,28,.2)); transform:rotate(-4deg); }
.leader-card-head { background:var(--ink); color:white; display:flex; justify-content:space-between; padding:16px 20px; font-size:12px; font-weight:700; }
.leader-card-head span:last-child { font-weight:400; color:#c9d0cd; }
.leader-row { display:flex; align-items:center; gap:11px; padding:13px 18px; border-bottom:1px solid #eee8de; }
.leader-row:last-child { border-bottom:0; }
.rank { font-size:12px; font-weight:700; color:#8b958f; width:20px; text-align:center; }
.rank-1 { color:#c28a19; font-size:18px; }
.leader-name { display:flex; flex-direction:column; flex:1; font-size:13px; }
.leader-name-line { display:flex; align-items:center; gap:8px; min-height:31px; }
.leader-name small { color:#9a9f9c; margin-top:2px; font-size:9px; }
.leader-row>strong { color:var(--coral); font-size:17px; }
.leader-row>strong small { display:block; text-align:right; color:#99a09c; font-size:8px; text-transform:uppercase; letter-spacing:1px; }
.bonus-chest { position:relative; width:38px; height:33px; padding:0; border:0; background:transparent; filter:drop-shadow(0 5px 4px rgba(77,48,24,.2)); cursor:pointer; animation:chest-wiggle 2.5s ease-in-out infinite; }
.bonus-chest:hover { transform:translateY(-2px) scale(1.08); }
.bonus-chest:focus-visible { outline:3px solid #efb632; outline-offset:3px; border-radius:6px; }
.bonus-chest:disabled { cursor:wait; opacity:.62; }
.chest-lid { position:absolute; z-index:2; left:3px; top:3px; width:32px; height:13px; border:2px solid #6e3d1f; border-radius:9px 9px 2px 2px; background:linear-gradient(#c8873d,#9f5e28); box-shadow:inset 0 -3px #7c461f; }
.chest-box { position:absolute; left:3px; bottom:1px; width:32px; height:19px; display:grid; place-items:center; border:2px solid #6e3d1f; border-radius:2px 2px 6px 6px; background:linear-gradient(90deg,#9a5725 0 16%,#d39142 17% 82%,#9a5725 83%); box-shadow:inset 0 -4px rgba(76,38,14,.18); }
.chest-box>span { z-index:2; font-size:14px; line-height:1; filter:drop-shadow(0 1px #fff3); transform:rotate(-10deg); }
.bonus-claimed { display:inline-flex; align-items:center; gap:2px; padding:4px 7px; border-radius:20px; background:#fff4cf; color:#9b6b12; font-size:9px; font-weight:800; white-space:nowrap; }
@keyframes chest-wiggle { 0%,72%,100%{transform:rotate(0)} 77%{transform:rotate(-7deg) translateY(-2px)} 82%{transform:rotate(7deg) translateY(-2px)} 87%{transform:rotate(-4deg)} 92%{transform:rotate(3deg)} }
footer { max-width:1128px; margin:auto; min-height:130px; padding:40px 28px; display:flex; justify-content:space-between; align-items:center; gap:28px; }
footer p { color:#839089; font-size:12px; }
.footer-links { display:flex; gap:20px; }
.footer-links a { color:#52635c; font-size:12px; font-weight:700; text-decoration:none; }
.footer-links a:hover { color:var(--coral); }
.modal-backdrop { position:fixed; inset:0; z-index:20; background:rgba(27,40,35,.55); display:grid; place-items:center; padding:20px; backdrop-filter:blur(5px); }
.modal { width:min(680px,100%); max-height:90vh; overflow:auto; position:relative; border-radius:20px; padding:30px; background:var(--paper); box-shadow:0 30px 80px rgba(0,0,0,.22); }
.modal>p { color:#77827d; font-size:13px; }
.admin-access-card { margin-top:20px; padding:20px; border:1px solid var(--line); border-radius:14px; background:white; }
.admin-access-card h3,.password-change h3 { margin:0 0 7px; font-size:17px; }
.admin-access-card p,.password-change p { margin:0 0 15px; color:#77827d; font-size:11px; line-height:1.55; }
.admin-access-card label,.password-change label { display:block; margin-top:12px; color:#596861; font-size:11px; font-weight:700; }
.admin-access-card input,.password-change input { margin:6px 0 0; }
.admin-primary,.admin-secondary { width:100%; margin-top:15px; border:0; border-radius:9px; padding:11px 14px; font-weight:800; }
.admin-primary { background:var(--coral); color:white; box-shadow:0 8px 18px rgba(206,103,78,.2); }
.admin-secondary { border:1px solid #d9cec0; background:white; color:#52635c; }
.admin-primary:disabled,.admin-secondary:disabled { opacity:.55; cursor:wait; }
.admin-session-row { display:flex; align-items:center; justify-content:space-between; margin-top:18px; padding:10px 12px; border:1px solid #cfe4d5; border-radius:10px; background:#f0f8f2; }
.admin-session-row span { display:flex; align-items:center; gap:8px; color:#4f765e; font-size:11px; }
.admin-session-row i { width:20px; height:20px; display:grid; place-items:center; border-radius:50%; background:#69a37b; color:white; font-style:normal; }
.admin-session-row button { border:0; background:transparent; color:#6d7c74; font-size:10px; font-weight:800; }
.password-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.password-change { padding-bottom:4px; }
.admin-error { margin:14px 0 0!important; padding:10px 12px; border:1px solid #efc5bb; border-radius:9px; background:#fff2ee; color:#a64d3b!important; font-size:11px!important; }
.modal-close { position:absolute; right:17px; top:14px; font-size:25px; color:#73807a; border:0; background:transparent; }
.add-member { display:grid; grid-template-columns:1fr auto; gap:8px; margin:18px 0; }
.add-member input { margin:0; }
.add-member button { border:0; border-radius:9px; background:var(--coral); color:white; font-weight:700; padding:0 14px; }
.member-list { border-top:1px solid var(--line); }
.member-list>div { display:flex; align-items:center; justify-content:space-between; padding:10px 0; border-bottom:1px solid var(--line); }
.member-list span { display:flex; align-items:center; gap:9px; font-size:13px; font-weight:600; }
.member-list button { border:0; color:#b26554; background:#fbebe5; border-radius:7px; padding:6px 9px; font-size:10px; }
.member-list button:disabled { opacity:.35; }
.admin-section { margin-top:24px; padding-top:20px; border-top:1px solid var(--line); }
.admin-section h3 { margin:0; font-size:16px; }
.admin-title-row { display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; }
.admin-title-row>span { color:#8a958f; font-size:10px; }
.admin-toolbar { display:flex; justify-content:flex-end; gap:8px; margin-bottom:9px; }
.danger-button { border-color:#efc5bb!important; color:#a64d3b!important; background:#fff2ee!important; }
.post-admin-list { max-height:280px; overflow:auto; border:1px solid var(--line); border-radius:10px; background:white; }
.post-admin-row { display:grid; grid-template-columns:auto 1fr auto; gap:10px; align-items:center; padding:10px; border-bottom:1px solid #eee7dd; cursor:pointer; }
.post-admin-row:last-child { border-bottom:0; }
.post-admin-row input { width:auto; margin:0; }
.post-admin-row>span { min-width:0; display:flex; flex-direction:column; gap:2px; }
.post-admin-row small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#8a958f; font-weight:400; }
.post-admin-row button { border:0; border-radius:6px; background:#fbebe5; color:#a45443; padding:5px 8px; font-size:9px; }
.admin-empty { padding:18px; text-align:center; background:white; border:1px solid var(--line); border-radius:10px; }
.danger-zone { display:flex; justify-content:space-between; align-items:center; gap:15px; margin-top:16px; padding:13px; border:1px solid #efc5bb; border-radius:10px; background:#fff9f6; }
.danger-zone>div:first-child { display:flex; flex-direction:column; font-size:12px; }
.danger-zone small { margin-top:2px; color:#94766f; font-weight:400; }
.confirm-reset { display:flex; gap:6px; flex-shrink:0; }
.confirm-backdrop { z-index:30; }
.confirm-modal { width:min(430px,100%); text-align:center; }
.confirm-modal h2 { margin-top:8px; }
.confirm-actions { display:flex; justify-content:center; gap:9px; margin-top:22px; }
.confirm-actions button { border:1px solid var(--line); border-radius:9px; background:white; color:#596861; font-weight:700; padding:10px 14px; }
.toss-view { position:fixed; inset:0; z-index:40; overflow:hidden; background:rgba(23,31,28,.82); backdrop-filter:blur(4px); cursor:pointer; }
.toss-view:focus-visible { outline:3px solid var(--yellow); outline-offset:-6px; }
.toss-hint { position:fixed; z-index:20; top:22px; left:50%; transform:translateX(-50%); color:white; background:rgba(255,255,255,.13); border:1px solid rgba(255,255,255,.25); border-radius:30px; padding:8px 14px; font-size:11px; font-weight:700; letter-spacing:.3px; box-shadow:0 8px 28px rgba(0,0,0,.15); }
.toss-card { position:absolute; left:50%; top:50%; width:min(410px,82vw,78vh); aspect-ratio:1; overflow:hidden; display:flex; flex-direction:column; border:1px solid rgba(232,222,206,.9); border-radius:17px; background:white; box-shadow:0 28px 60px rgba(0,0,0,.32),0 8px 18px rgba(0,0,0,.18); transform:translate(calc(-50% + var(--toss-x)),calc(-50% + var(--toss-y))) rotate(var(--toss-r)); transform-origin:center; animation:toss-card-in .9s cubic-bezier(.18,.82,.24,1.05) both; pointer-events:none; }
.toss-card-art { height:27%; min-height:68px; flex:0 0 auto; overflow:hidden; background:#f6d76f; }
.toss-card-art { position:relative; }
.toss-card-body { min-height:0; padding:17px 19px 18px; display:flex; flex:1; flex-direction:column; }
.toss-card .card-people { font-size:11px; }
.toss-card .card-kind-row { margin-top:8px; }
.toss-card .quote { min-height:auto; margin:10px 0 13px; font-size:18px; overflow-wrap:anywhere; }
.toss-card .feed-meta { margin-top:auto; }
.toss-card .feed-doony { width:48px; height:48px; }
.bonus-celebration { position:fixed; inset:0; z-index:60; display:grid; place-items:center; padding:22px; overflow:hidden; background:rgba(25,38,32,.8); backdrop-filter:blur(7px); cursor:pointer; }
.confetti-field { position:absolute; inset:0; overflow:hidden; pointer-events:none; }
.confetti-field i { position:absolute; left:var(--confetti-x); top:-8vh; width:11px; height:20px; border-radius:2px; background:var(--confetti-color); animation:confetti-fall var(--confetti-duration) linear var(--confetti-delay) infinite; transform:rotate(0); opacity:.95; }
.confetti-field i:nth-child(3n) { width:8px; height:8px; border-radius:50%; }
.confetti-field i:nth-child(4n) { width:15px; height:7px; }
.celebration-card { position:relative; z-index:2; width:min(520px,92vw); padding:38px 40px 34px; border:3px solid #f7d778; border-radius:28px; background:linear-gradient(155deg,#fffdf6,#fff4d3); text-align:center; box-shadow:0 35px 100px rgba(0,0,0,.35); cursor:default; animation:celebration-pop .65s cubic-bezier(.16,1.3,.35,1) both; }
.celebration-card img { width:145px; height:145px; margin:-95px auto 5px; object-fit:contain; filter:drop-shadow(0 13px 12px rgba(91,55,25,.22)); }
.celebration-card h2 { margin:9px 0 10px; color:var(--ink); font-size:clamp(28px,5vw,43px); line-height:1.05; }
.celebration-card p { max-width:390px; margin:0 auto 23px; color:#69766f; line-height:1.6; }
.celebration-card button { border:0; border-radius:30px; padding:12px 20px; background:var(--coral); color:white; font-weight:800; box-shadow:0 9px 20px rgba(206,103,78,.25); }
@keyframes confetti-fall { 0%{transform:translate3d(0,-12vh,0) rotate(0);opacity:0} 10%{opacity:1} 100%{transform:translate3d(7vw,118vh,0) rotate(var(--confetti-turn));opacity:.95} }
@keyframes celebration-pop { from{opacity:0;transform:scale(.65) rotate(-3deg)} to{opacity:1;transform:scale(1) rotate(0)} }
@keyframes toss-card-in { 0% { opacity:0; transform:translate(var(--toss-from),calc(-50% + var(--toss-y) - 18vh)) rotate(var(--toss-spin)) scale(.86); } 72% { opacity:1; transform:translate(calc(-50% + var(--toss-x)),calc(-50% + var(--toss-y) + 1.5vh)) rotate(calc(var(--toss-r) * .8)) scale(1.025); } 100% { opacity:1; transform:translate(calc(-50% + var(--toss-x)),calc(-50% + var(--toss-y))) rotate(var(--toss-r)) scale(1); } }
@media(max-width:1050px) { .feed-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.feed-page-prev{left:-20px}.feed-page-next{right:-20px} }
@media(max-width:850px) { nav { display:none; } .topbar{gap:10px}.header-avatars{display:none}.mobile-account{display:flex;align-items:center;gap:6px;margin-left:auto;min-width:0}.mobile-account span{max-width:92px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#52635c;font-size:10px;font-weight:800}.mobile-account button{padding:7px 8px;border:1px solid #d8cec0;border-radius:8px;background:#fffdf8;color:#52635c;font-size:10px;font-weight:700;white-space:nowrap;cursor:pointer}.mobile-account button:hover,.mobile-account button:focus-visible{border-color:var(--coral);color:var(--coral)}.hero { grid-template-columns:1fr; gap:38px; padding-top:45px; }.hero-copy { text-align:center; }.hero-copy>p{margin-inline:auto}.doony-hello{margin-inline:auto;text-align:left}.hero-doodle{display:none}.leader-section{grid-template-columns:1fr;gap:55px}.leader-intro{text-align:center}.leader-intro p{margin-inline:auto}.level-key{justify-content:center}.leader-treasure{left:-22.5px;bottom:-29px;width:102.5px} }
@media(max-width:600px) { .topbar{padding:0 18px}.brand-name{font-size:19px}.hero{padding:38px 14px 58px}h1{font-size:52px;letter-spacing:-3px}.composer{padding:20px 15px;border-radius:19px}.form-grid{grid-template-columns:1fr}.kind-picker{grid-template-columns:1fr 1fr}.content-section{padding:58px 14px}.feed-grid{grid-template-columns:1fr}.feed-pager{padding-inline:24px}.feed-page-arrow{width:46px;height:46px;font-size:36px}.feed-page-prev{left:-4px}.feed-page-next{right:-4px}.section-heading{align-items:start;gap:18px;flex-direction:column}.section-heading h2{font-size:32px}.feed-controls{align-items:flex-start}.feed-controls div{flex-wrap:wrap}.feed-meta{gap:10px}.leader-section{padding:62px 18px 82px}.leader-row{padding:12px 9px;gap:7px}.leader-name-line{gap:5px}.level-key span{flex:1}.quote{font-size:17px}footer{flex-direction:column;gap:16px;text-align:center}.modal{padding:25px 18px}.add-member{grid-template-columns:1fr}.add-member button{padding:11px}.danger-zone{align-items:flex-start;flex-direction:column}.admin-toolbar{justify-content:flex-start;flex-wrap:wrap}.password-grid{grid-template-columns:1fr;gap:0}.toss-card{width:min(88vw,72vh);--toss-x:0vw!important}.toss-card-art{height:27%;min-height:58px}.toss-card-body{padding:14px 15px}.toss-card .quote{font-size:16px;margin:11px 0}.toss-hint{top:12px}.celebration-card{padding:31px 22px 27px}.celebration-card img{width:120px;height:120px;margin-top:-80px} }
@media(prefers-reduced-motion:reduce) { html{scroll-behavior:auto}.send-button:hover{transform:none}.toss-card{animation:toss-card-fade .2s ease-out both}.bonus-chest,.celebration-card{animation:none}.confetti-field i{animation-duration:8s}@keyframes toss-card-fade{from{opacity:0}to{opacity:1}} }

.api-alert { max-width:680px; margin:18px auto; padding:12px 15px; border:1px solid #efc5bb; border-radius:10px; background:#fff2ee; color:#9c4e3e; font-size:12px; text-align:center; }
.admin-access-card .setup-key-note { margin-top:8px; color:#8a746c; font-size:10px; }
.admin-content-loading { padding:35px 15px; color:#718078; text-align:center; }
.modal form button[type="submit"] { cursor:pointer; }
.modal form button[type="submit"]:disabled { opacity:.55; cursor:wait; }
.feed-card button,.leader-row button { font:inherit; }
.toast { position:fixed; z-index:80; left:50%; bottom:24px; width:min(520px,calc(100vw - 30px)); transform:translateX(-50%); padding:12px 16px; border:1px solid #d8cec0; border-radius:12px; background:#fffdf8; color:#52635c; box-shadow:0 18px 50px rgba(36,53,47,.2); text-align:center; font-size:12px; font-weight:700; }
.toast.error,.notice.error { color:#a94b3e; }

/* Private multi-family account entry */
.account-gate { min-height:100vh; display:grid; grid-template-columns:minmax(0,1.05fr) minmax(380px,.75fr); align-items:center; gap:70px; padding:64px max(6vw,28px); background:radial-gradient(circle at 18% 18%,#fff8e7 0,transparent 37%),linear-gradient(135deg,#f6eee0,#efe4d3); }
.account-gate-copy { max-width:690px; }
.account-gate-copy>.brand { display:inline-flex; margin-bottom:70px; }
.account-gate-copy h1 { margin:14px 0 22px; }
.account-gate-copy>p { max-width:570px; color:#66736d; font-size:17px; line-height:1.75; }
.privacy-points { display:grid; gap:11px; margin-top:30px; }
.privacy-points span { display:flex; align-items:center; gap:10px; color:#52635c; font-size:13px; font-weight:700; }
.account-card { width:100%; max-width:520px; justify-self:center; padding:34px; border:1px solid rgba(97,78,53,.12); border-radius:24px; background:#fffdf8; box-shadow:0 28px 80px rgba(72,53,30,.15); }
.account-tabs { display:grid; grid-template-columns:1fr 1fr; gap:5px; padding:5px; margin-bottom:30px; border-radius:12px; background:#eee7dc; }
.account-tabs button { padding:11px; border:0; border-radius:9px; background:transparent; color:#79827e; font-weight:700; cursor:pointer; }
.account-tabs button.active { background:white; color:var(--ink); box-shadow:0 2px 8px rgba(61,49,34,.1); }
.account-card h2 { margin:0 0 8px; font-family:var(--serif); font-size:31px; }
.account-card form>p { margin:0 0 22px; color:#7c837f; font-size:12px; line-height:1.6; }
.account-card label,.owner-card label,.account-delete-zone label { display:grid; gap:7px; margin:15px 0; color:#52635c; font-size:11px; font-weight:800; }
.account-card input,.owner-card input,.account-delete-zone input { width:100%; padding:12px 13px; border:1px solid #d8cec0; border-radius:9px; background:white; color:var(--ink); font:inherit; font-size:14px; }
.account-card label small { color:#9a948b; font-size:9px; font-weight:500; }
.account-card .send-button { margin-top:22px; }
.private-banner { display:flex; justify-content:center; align-items:center; gap:8px; padding:9px 18px; background:#e7f4ef; color:#4c7668; font-size:10px; }
.private-banner p { margin:0; }
.link-button { padding:0; border:0; background:none; color:inherit; cursor:pointer; font:inherit; }
.post-delete { position:absolute; z-index:3; top:8px; right:8px; width:26px; height:26px; border:0; border-radius:50%; background:rgba(255,255,255,.88); color:#a6695d; box-shadow:0 2px 8px rgba(57,45,31,.12); cursor:pointer; opacity:.25; transition:opacity .2s; }
.feed-card { position:relative; }
.feed-card:hover .post-delete,.post-delete:focus-visible { opacity:1; }
.family-settings-modal { max-height:min(88vh,900px); overflow:auto; }
.account-delete-zone { display:block; border-color:#e5bbb1; background:#fff4f1; }
.account-delete-zone form { margin-top:14px; }
.account-delete-zone .danger-button { margin-top:8px; }

/* Privacy-limited site-owner page */
.owner-page { min-height:100vh; background:#f5efe5; }
.owner-shell { width:min(1180px,calc(100% - 32px)); margin:auto; padding:28px 0 70px; }
.owner-header { display:flex; justify-content:space-between; align-items:center; }
.privacy-pill { padding:8px 12px; border-radius:999px; background:#deeee8; color:#467565; font-size:10px; font-weight:800; }
.owner-intro { max-width:760px; padding:80px 0 34px; }
.owner-intro h1 { margin:8px 0 15px; font-family:var(--serif); font-size:58px; }
.owner-intro p { color:#66736d; line-height:1.7; }
.owner-card { padding:28px; border:1px solid #ddd2c2; border-radius:20px; background:#fffdf8; box-shadow:0 20px 55px rgba(72,53,30,.1); }
.owner-card>h2,.owner-toolbar h2 { margin:0 0 7px; font-family:var(--serif); font-size:28px; }
.owner-card>p,.owner-toolbar p { margin:0 0 22px; color:#7e847f; font-size:12px; }
.owner-card form { max-width:650px; }
.owner-toolbar { display:flex; justify-content:space-between; align-items:center; gap:20px; }
.owner-toolbar button { padding:9px 13px; border:1px solid #d8cec0; border-radius:8px; background:white; cursor:pointer; }
.owner-privacy-note { display:flex; flex-direction:column; gap:4px; margin:18px 0; padding:13px 15px; border-radius:10px; background:#e9f4ef; color:#4b7064; font-size:11px; }
.owner-privacy-note span { font-size:10px; }
.owner-table-wrap { overflow:auto; }
.owner-table { width:100%; border-collapse:collapse; font-size:12px; }
.owner-table th,.owner-table td { padding:13px 11px; border-bottom:1px solid #eee6da; text-align:left; white-space:nowrap; }
.owner-table th { color:#89908b; font-size:9px; text-transform:uppercase; letter-spacing:.08em; }
.owner-table td:first-child { display:grid; gap:3px; }
.owner-table small { color:#9fa39f; font-size:8px; }
.danger-link { border:0; background:none; color:#bb5547; font-weight:800; cursor:pointer; }

@media(max-width:850px) { .account-gate{grid-template-columns:1fr;gap:40px;padding-top:35px}.account-gate-copy{text-align:center;margin:auto}.account-gate-copy>.brand{margin-bottom:38px}.account-gate-copy>p{margin-inline:auto}.privacy-points{justify-content:center;text-align:left}.account-card{max-width:600px}.owner-intro{padding-top:55px}.owner-intro h1{font-size:44px} }
@media(max-width:600px) { .account-gate{padding:25px 14px 50px}.account-gate-copy h1{font-size:47px}.account-card{padding:22px 16px}.private-banner{align-items:flex-start}.privacy-pill{display:none}.owner-shell{width:min(100% - 20px,1180px)}.owner-card{padding:18px 12px}.owner-toolbar{align-items:flex-start}.post-delete{opacity:.8} }
@media(max-width:420px) { .topbar .brand-name{display:none}.mobile-account span{max-width:78px} }
.toast.error { border-color:#efc5bb; background:#fff2ee; color:#a64d3b; }
