*{box-sizing:border-box}button,a,[role=button]{-webkit-tap-highlight-color:transparent}:root{--ink: #2a1a3d;--ink-soft: rgba(42,26,61,.8);--paper: #fff0e0;--paper-deep: #ffe5cf;--cream: #fff5cc;--peach-sticky: #ffd6e5;--blue-sticky: #e0eaff;--pink: #e85a96;--pink-deep: #d04488;--peach: #ffb86b;--blue: #6a8fe0;--green: #2a8a55;--muted: #8a6c8c;--muted-soft: #b89cb5;--me: #e85a96;--them: #6a8fe0;--border: 2px solid var(--ink);--shadow-card: 5px 5px 0 var(--ink);--shadow-card-sm: 3px 3px 0 var(--ink);--shadow-card-xs: 2px 2px 0 var(--ink);--shadow-disc: 0 4px 0 rgba(42,26,61,.18);--radius-card: 18px;--radius-thumb: 10px;--radius-search: 16px;--radius-tabbar: 22px;--radius-pill: 999px;--radius-note: 4px;--radius-input: 12px;--bg-wash: radial-gradient(55% 40% at 15% 10%, #ffb380 0%, transparent 65%), radial-gradient(50% 40% at 90% 85%, #ff80b3 0%, transparent 65%), radial-gradient(45% 35% at 95% 15%, #b3a4ff 0%, transparent 70%), var(--paper);--font-ui: -apple-system, BlinkMacSystemFont, "SF Pro Text", system-ui, "Segoe UI", Roboto, sans-serif;--font-hand: "Kalam", "Marker Felt", "Comic Sans MS", sans-serif;--font-stamp: "Courier New", monospace;--surface: #fff;--surface-2: #fff8f0}:root[data-palette=ocean]{--pink: #2a9aa8;--pink-deep: #1f7a88;--peach: #5fc7b3;--blue: #1f6fae;--me: #2a9aa8;--them: #1f4f9c;--paper: #e6f4ff;--paper-deep: #d4ebff;--cream: #d4eef0;--peach-sticky: #c8e8e0;--blue-sticky: #d4ebff;--bg-wash: radial-gradient(55% 40% at 15% 10%, #8fc8ff 0%, transparent 65%), radial-gradient(50% 40% at 90% 85%, #7fd4c4 0%, transparent 65%), radial-gradient(45% 35% at 95% 15%, #a8d0ff 0%, transparent 70%), var(--paper)}:root[data-palette=forest]{--pink: #1f5a3a;--pink-deep: #144a2a;--peach: #c4d96b;--blue: #4a8a6b;--me: #3a8a5c;--them: #d49a3a;--paper: #e8f2dc;--paper-deep: #d8e8c8;--cream: #f0f7d6;--peach-sticky: #d6ecb8;--blue-sticky: #c8e8d4;--bg-wash: radial-gradient(55% 40% at 15% 10%, #a8d68a 0%, transparent 65%), radial-gradient(50% 40% at 90% 85%, #7cc89a 0%, transparent 65%), radial-gradient(45% 35% at 95% 15%, #c4e08a 0%, transparent 70%), var(--paper)}:root[data-palette=twilight]{--pink: #d44e9c;--pink-deep: #b03680;--peach: #7decd0;--blue: #5a7fd4;--me: #8a4fd4;--them: #2ab8c4;--paper: #e8e2f5;--paper-deep: #d8d0ee;--cream: #d8f0e8;--peach-sticky: #ffc8e0;--blue-sticky: #b8e6da;--bg-wash: radial-gradient(55% 40% at 15% 10%, #c4a8ff 0%, transparent 65%), radial-gradient(50% 40% at 90% 85%, #7decd0 0%, transparent 65%), radial-gradient(45% 35% at 95% 15%, #ff9ecf 0%, transparent 70%), var(--paper)}:root[data-theme=dark]{--ink: #fff0e0;--ink-soft: rgba(255,240,224,.8);--paper: #3a1f4d;--paper-deep: #4a2a5e;--cream: #5a3568;--peach-sticky: #6e3d58;--blue-sticky: #3d4a78;--muted: #d0a8cc;--muted-soft: #a884a8;--surface: #4a2f5c;--surface-2: #5a3d6e;--bg-wash: radial-gradient(55% 40% at 15% 10%, #a04a8a 0%, transparent 65%), radial-gradient(50% 40% at 90% 85%, #d6709a 0%, transparent 60%), radial-gradient(45% 35% at 95% 15%, #7a5ad4 0%, transparent 70%), var(--paper);--shadow-card: 5px 5px 0 rgba(255,240,224,.35);--shadow-card-sm: 3px 3px 0 rgba(255,240,224,.35);--shadow-card-xs: 2px 2px 0 rgba(255,240,224,.35)}:root[data-theme=dark][data-palette=ocean]{--paper: #1a3a55;--paper-deep: #244a6a;--cream: #2a5a78;--peach-sticky: #2a4a70;--blue-sticky: #1f5a55;--surface: #244a6a;--surface-2: #2e587a;--bg-wash: radial-gradient(55% 40% at 15% 10%, #4a8ed4 0%, transparent 65%), radial-gradient(50% 40% at 90% 85%, #4ad0a8 0%, transparent 60%), radial-gradient(45% 35% at 95% 15%, #5fb8e8 0%, transparent 70%), var(--paper)}:root[data-theme=dark][data-palette=forest]{--paper: #1f3525;--paper-deep: #2a4a32;--cream: #3a5a40;--peach-sticky: #4a5a30;--blue-sticky: #2a4a3a;--surface: #2a4a32;--surface-2: #355a3e;--bg-wash: radial-gradient(55% 40% at 15% 10%, #5aa86a 0%, transparent 65%), radial-gradient(50% 40% at 90% 85%, #8ac478 0%, transparent 60%), radial-gradient(45% 35% at 95% 15%, #c4d04a 0%, transparent 70%), var(--paper)}:root[data-theme=dark][data-palette=twilight]{--paper: #1f3d4a;--paper-deep: #2a505e;--cream: #356070;--peach-sticky: #3d4f6e;--blue-sticky: #1f5a60;--surface: #2a505e;--surface-2: #356070;--bg-wash: radial-gradient(55% 40% at 15% 10%, #6a8ed4 0%, transparent 65%), radial-gradient(50% 40% at 90% 85%, #4cd0d8 0%, transparent 60%), radial-gradient(45% 35% at 95% 15%, #8a6fd4 0%, transparent 70%), var(--paper)}@media(prefers-color-scheme:dark){:root:not([data-theme]){--ink: #fff0e0;--ink-soft: rgba(255,240,224,.8);--paper: #3a1f4d;--paper-deep: #4a2a5e;--cream: #5a3568;--peach-sticky: #6e3d58;--blue-sticky: #3d4a78;--muted: #d0a8cc;--muted-soft: #a884a8;--surface: #4a2f5c;--surface-2: #5a3d6e;--bg-wash: radial-gradient(55% 40% at 15% 10%, #a04a8a 0%, transparent 65%), radial-gradient(50% 40% at 90% 85%, #d6709a 0%, transparent 60%), radial-gradient(45% 35% at 95% 15%, #7a5ad4 0%, transparent 70%), var(--paper);--shadow-card: 5px 5px 0 #14081c;--shadow-card-sm: 3px 3px 0 #14081c;--shadow-card-xs: 2px 2px 0 #14081c}}html,body,#root{margin:0;padding:0;min-height:100vh;background:var(--bg-wash);background-attachment:fixed;color:var(--ink);font-family:var(--font-ui);font-size:16px;line-height:1.45;-webkit-font-smoothing:antialiased;letter-spacing:-.005em}html,body{overscroll-behavior-y:contain}button{font:inherit;color:inherit;border:none;background:none;cursor:pointer}input,textarea{font:inherit;color:inherit}.app{max-width:640px;margin:0 auto;padding:16px 18px 110px;padding-top:max(16px,env(safe-area-inset-top));position:relative}.app-header{position:relative;padding:2px 0 6px;display:flex;flex-direction:column;z-index:2}.app-header-row{display:flex;align-items:center;justify-content:space-between;gap:10px}.brand-mark{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,#ff6ba0,var(--peach));display:grid;place-items:center;color:#fff;border:var(--border);box-shadow:0 4px #b43c784d,0 8px 18px #ff6ba059;transform:rotate(-6deg);flex-shrink:0}.app-display{font-size:26px;font-weight:800;letter-spacing:-.03em;line-height:1;margin:8px 0 2px;color:var(--ink);display:flex;flex-wrap:wrap;align-items:baseline;gap:8px}.app-display .accent{color:var(--pink)}.app-sub{font-size:11px;font-weight:600;color:var(--muted);margin:2px 0 0}.confetti{position:absolute;top:0;left:-18px;right:-18px;height:130px;pointer-events:none;opacity:.7;z-index:0}.confetti span{position:absolute;width:8px;height:8px}.search-bar{margin:8px 0 10px;padding:7px 12px;border-radius:var(--radius-search);background:var(--surface);border:var(--border);box-shadow:3px 3px 0 var(--ink);font-size:13px;color:var(--muted);display:flex;align-items:center;gap:8px}.search-bar input{flex:1;min-width:0;background:none;border:none;outline:none;color:var(--ink);font-size:16px;padding:4px 0}.search-bar input::placeholder{color:var(--muted-soft);font-size:13.5px}.search-bar input[type=search]::-webkit-search-cancel-button,.search-bar input[type=search]::-webkit-search-decoration{-webkit-appearance:none;appearance:none;display:none}.search-clear{width:22px;height:22px;flex-shrink:0;border-radius:50%;background:var(--cream);color:var(--ink);border:1.5px solid var(--ink);font-size:14px;line-height:1;display:flex;align-items:center;justify-content:center;font-weight:700}.filter-bar{display:flex;align-items:center;gap:8px;margin:0 -18px 10px;overflow-x:auto;scrollbar-width:none;padding:2px 22px;scroll-padding-inline-end:22px}.filter-bar::-webkit-scrollbar{display:none}.chip{flex-shrink:0;display:inline-flex;align-items:center;gap:6px;padding:7px 13px;border-radius:var(--radius-pill);background:var(--surface);border:var(--border);box-shadow:var(--shadow-card-xs);font-size:12.5px;font-weight:700;color:var(--ink);text-transform:none;letter-spacing:0}.chip.on{background:var(--ink);color:var(--paper)}.chip-count{display:inline-grid;place-items:center;min-width:18px;padding:0 5px;height:18px;border-radius:999px;background:#2a1a3d1f;font-size:10px;font-weight:800;color:var(--ink)}.chip.on .chip-count{background:#ffffff38;color:var(--paper)}.sort-select{flex-shrink:0;font:inherit;font-size:12px;font-weight:700;padding:7px 24px 7px 12px;border-radius:var(--radius-pill);background:var(--surface);color:var(--ink);border:var(--border);box-shadow:var(--shadow-card-xs);outline:none;appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path fill='%232a1a3d' d='M5 6L0 0h10z'/></svg>");background-repeat:no-repeat;background-position:right 9px center;max-width:110px}.feed{display:flex;flex-direction:column;gap:18px;padding:4px 0 8px}.empty{text-align:center;padding:60px 20px;color:var(--muted);font-weight:600}.empty-mark{font-size:48px;margin-bottom:12px}.empty p{margin:4px 0}.empty .dim{color:var(--muted-soft)}.card{position:relative;display:flex;gap:12px;padding:12px;background:var(--surface);border:var(--border);border-radius:var(--radius-card);box-shadow:var(--shadow-card);transition:transform .18s ease,box-shadow .18s ease}.feed>.swipe-host:nth-child(odd){--tilt: -1.2deg}.feed>.swipe-host:nth-child(2n){--tilt: 1.4deg}.swipe-host>.card{transform:rotate(var(--tilt, 0deg))}.feed>.swipe-host:nth-child(2n) .note-tape{background:var(--peach-sticky);transform:rotate(2deg)}.feed>.swipe-host:nth-child(3n) .note-tape{background:var(--blue-sticky)}.card.watched .card-main{opacity:.62}.swipe-host{position:relative}.swipe-host,.swipe-host *{touch-action:pan-y;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;user-select:none;-webkit-user-select:none}.swipe-host img{-webkit-user-drag:none;pointer-events:none}.swipe-host>.card{position:relative;z-index:2;will-change:transform;backface-visibility:hidden;-webkit-backface-visibility:hidden;transform:translateZ(0) rotate(var(--tilt, 0deg));transition:transform .24s cubic-bezier(.2,.8,.2,1)}.swipe-action{position:absolute;inset:0;display:flex;align-items:center;justify-content:flex-end;padding:0 22px;font-size:12.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:#fff;background:var(--green);border-radius:var(--radius-card);z-index:1;opacity:0;transition:opacity .12s ease;pointer-events:none;gap:8px}.swipe-action.unwatch{background:var(--pink)}.swipe-action.visible{opacity:1}.swipe-action-label{white-space:nowrap}@media(hover:hover){.card:hover{transform:translateY(-2px) rotate(0);box-shadow:7px 7px 0 var(--ink)}}.card-main{flex:1;display:flex;gap:12px;padding:0;text-align:left;align-items:flex-start;background:none}.thumb-wrap{position:relative;flex-shrink:0}.thumb{position:relative;width:120px;aspect-ratio:16/9;border-radius:var(--radius-thumb);overflow:hidden;background:#efe6dc;border:var(--border)}.thumb.short{width:80px;aspect-ratio:9/16}.thumb img{width:100%;height:100%;object-fit:cover}.thumb.short img{transform:scale(1.78);transform-origin:center}.placeholder-thumb{width:100%;height:100%;display:grid;place-items:center;font-size:32px;background:var(--blue);color:#fff}.from-tag{position:absolute;top:-12px;left:-14px;padding:5px 12px;border-radius:var(--radius-pill);font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#fff;border:var(--border);transform:rotate(-8deg);z-index:3;box-shadow:2px 2px 0 var(--ink),0 4px 8px #2a1a3d2e;white-space:nowrap}.from-tag.me{background:var(--me)}.from-tag.them{background:var(--them)}.provider-badge{position:absolute;bottom:6px;left:6px;background:#000000b3;color:#fff;font-size:9px;font-weight:800;padding:2px 6px;border-radius:3px;letter-spacing:.04em}.provider-badge.fb{background:#1877f2}.provider-badge.ig{background:linear-gradient(135deg,#f58529,#dd2a7b 50%,#8134af 90%)}.provider-badge.yt{background:#f03}.short-badge{position:absolute;bottom:6px;right:6px;background:#000000c7;color:#fff;font-size:10px;font-weight:800;padding:2px 6px;border-radius:4px;letter-spacing:.06em;text-transform:uppercase}.unwatched-dot{position:absolute;top:5px;right:5px;width:14px;height:14px;border-radius:50%;background:var(--pink);border:2px solid #fff;box-shadow:0 1px 4px #2a1a3d66}.card-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}.card-when{font-size:10.5px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}.card-title{font-size:14.5px;font-weight:700;line-height:1.3;margin:0;color:var(--ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;letter-spacing:-.005em;min-width:0;max-width:100%;word-break:break-word;overflow-wrap:anywhere}.card-author{font-size:11.5px;color:var(--muted);margin:0;font-weight:500}.note-tape{display:inline-block;align-self:flex-start;margin-top:6px;padding:7px 14px 9px;background:var(--cream);border:var(--border);border-radius:var(--radius-note);font-family:var(--font-hand);font-size:16.5px;font-weight:700;line-height:1.3;color:var(--ink);transform:rotate(-2.5deg);box-shadow:var(--shadow-card-xs);max-width:100%}.card:nth-child(2n) .note-tape{background:var(--peach-sticky);transform:rotate(2deg)}.card:nth-child(3n) .note-tape{background:var(--blue-sticky)}.watched-stamp{position:absolute;top:8px;right:8px;font-family:var(--font-stamp);font-size:10.5px;font-weight:800;letter-spacing:.18em;padding:4px 9px 5px;background:var(--green);color:#fff;border:2px solid var(--ink);text-transform:uppercase;border-radius:4px;z-index:3;box-shadow:1.5px 1.5px 0 var(--ink)}.reaction-discs{position:absolute;bottom:-10px;right:14px;display:flex;z-index:3}.reaction-discs span{width:32px;height:32px;border-radius:50%;background:var(--surface);border:var(--border);display:grid;place-items:center;font-size:16px;margin-left:-10px;box-shadow:var(--shadow-disc)}.reaction-discs span:first-child{margin-left:0;transform:rotate(-8deg)}.reaction-discs span:nth-child(2){transform:rotate(6deg)}.reaction-discs span:nth-child(3){transform:rotate(-3deg)}.card-meta{font-size:11px;color:var(--muted);display:inline-flex;align-items:center;gap:4px;margin-top:4px;font-weight:600}.card.pinned{background:linear-gradient(180deg,var(--surface-2) 0%,var(--surface) 100%);border-color:var(--ink)}.favorite-corner{position:absolute;top:4px;right:4px;font-size:13px;line-height:1;pointer-events:none;background:#0000008c;border-radius:999px;padding:3px 5px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.4))}.watched-toggle{width:48px;flex-shrink:0;display:grid;place-items:center;background:var(--surface);border:var(--border);border-radius:14px;box-shadow:var(--shadow-card-xs);font-size:18px;color:var(--muted);transition:background .12s,color .12s}.watched-toggle.on{background:var(--green);color:#fff;border-color:var(--ink)}.big-stamp{position:fixed;left:16px;right:16px;bottom:max(16px,env(safe-area-inset-bottom));height:60px;padding:0 22px;background:linear-gradient(135deg,#ff6ba0,var(--peach));color:#fff;border:var(--border);border-radius:22px;box-shadow:0 6px #b43c7859,0 10px 24px #ff6ba066,var(--shadow-card);font-size:16px;font-weight:800;letter-spacing:.02em;display:flex;align-items:center;justify-content:center;gap:8px;max-width:612px;margin:0 auto;z-index:60;transform:rotate(-1deg);transition:transform .1s ease,box-shadow .12s}.big-stamp:active{transform:rotate(-1deg) translate(2px,3px);box-shadow:0 3px #b43c7859,0 5px 12px #ff6ba04d,2px 2px 0 var(--ink)}.header-icon-btn{width:40px;height:40px;border-radius:12px;background:var(--surface);border:var(--border);box-shadow:var(--shadow-card-xs);display:grid;place-items:center;font-size:18px;flex-shrink:0;transition:transform .08s}.header-icon-btn:active{transform:translate(1px,1px);box-shadow:1px 1px 0 var(--ink)}.header-right{display:flex;gap:8px;align-items:center}.compose-overlay{position:fixed;inset:0;z-index:90;background:var(--bg-wash);background-attachment:fixed;overflow-y:auto;-webkit-overflow-scrolling:touch;animation:detailSlideIn .26s cubic-bezier(.32,.72,0,1)}.compose-stage{max-width:640px;margin:0 auto;padding:env(safe-area-inset-top) 0 max(20px,env(safe-area-inset-bottom));display:flex;flex-direction:column;min-height:100%}.compose-top{padding:14px 16px 8px;display:flex;justify-content:space-between;align-items:center}.compose-to{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}.compose-h{padding:8px 22px 18px}.compose-h h2{font-size:26px;font-weight:800;letter-spacing:-.03em;margin:0 0 4px;color:var(--ink)}.compose-h p{font-size:13.5px;color:var(--muted);margin:0;font-weight:600}.compose-paste{margin:0 16px 12px;padding:13px 14px;border-radius:14px;background:var(--surface);border:var(--border);box-shadow:var(--shadow-card-xs);display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--ink)}.compose-paste-icon{color:var(--muted);display:inline-flex;flex-shrink:0}.compose-paste input{flex:1;min-width:0;background:none;border:none;outline:none;font:inherit;font-weight:600;color:var(--ink)}.compose-paste input::placeholder{color:var(--muted-soft)}.compose-ok{font-size:9.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--green);background:#d4f5e0;padding:4px 8px;border-radius:6px;border:1.5px solid var(--green);flex-shrink:0}.compose-preview{margin:0 16px 14px;padding:12px;border-radius:16px;background:var(--surface);border:var(--border);box-shadow:var(--shadow-card-xs);display:flex;gap:12px}.compose-preview-thumb{width:110px;aspect-ratio:16/9;border-radius:10px;overflow:hidden;background:#efe6dc;border:1.5px solid var(--ink);flex-shrink:0}.compose-preview-thumb img{width:100%;height:100%;object-fit:cover}.compose-preview-body{flex:1;display:flex;flex-direction:column;gap:3px;min-width:0}.compose-preview-from{font-size:9.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}.compose-preview-title{font-size:13.5px;font-weight:700;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:var(--ink)}.compose-preview-author{font-size:11px;color:var(--muted)}.compose-note-input{margin:14px 22px;position:relative}.compose-note-input textarea{width:100%;padding:22px 22px 16px;min-height:120px;background:var(--cream);border:var(--border);border-radius:6px;font-family:var(--font-hand);font-size:21px;font-weight:700;color:var(--ink);line-height:1.5;outline:none;resize:none;background-image:linear-gradient(var(--cream) 27px,rgba(42,26,61,.13) 28px);background-size:100% 28px;box-shadow:0 1px #0000000d,0 3px #00000008,0 14px 24px -8px #2a1a3d2e,var(--shadow-card-xs)}.compose-note-input textarea::placeholder{color:var(--muted);opacity:.85;font-style:italic}.compose-note-input:before{content:"";position:absolute;width:80px;height:16px;background:repeating-linear-gradient(45deg,#ffaa5aa6 0 4px,#ffd28ca6 4px 8px);border:1.5px solid var(--ink);top:-10px;left:50%;transform:translate(-50%) rotate(-3deg);border-radius:1px;z-index:2;box-shadow:0 1px 2px #b48c1e4d}.compose-foot{margin-top:auto;padding:12px 16px 22px;display:flex;gap:10px}.compose-foot .ghost{flex:1;padding:14px;font-size:14px}.compose-foot .send-btn{flex:1.6;padding:14px;border-radius:14px;background:var(--ink);color:var(--paper);font-size:14.5px;font-weight:800;border:var(--border);box-shadow:var(--shadow-card-xs);display:inline-flex;align-items:center;justify-content:center;gap:8px}.compose-foot .send-btn:disabled{opacity:.55}.compose-foot .send-btn:active{transform:translate(1px,1px);box-shadow:1px 1px 0 var(--ink)}.composer-trigger{display:none}.composer{background:var(--surface);border:var(--border);border-radius:var(--radius-card);box-shadow:var(--shadow-card);padding:14px;display:flex;flex-direction:column;gap:10px;transform:rotate(-.5deg)}.composer input{width:100%;padding:12px 14px;background:var(--surface);border:var(--border);border-radius:var(--radius-input);outline:none;box-shadow:var(--shadow-card-xs);font-weight:600}.composer input:focus{border-color:var(--pink)}.composer-row{display:flex;gap:8px}.composer-row input{flex:1}.composer-actions{display:flex;justify-content:flex-end;gap:8px}.error{color:var(--pink-deep);font-size:13px;margin:0;font-weight:700}.hint{font-size:11.5px;color:var(--muted);margin:0;padding:8px 10px;background:var(--blue-sticky);border:var(--border);border-radius:8px;line-height:1.45;box-shadow:var(--shadow-card-xs)}.hint strong{color:var(--ink);font-weight:700}.primary{padding:12px 18px;border-radius:12px;background:linear-gradient(135deg,#ff6ba0,var(--peach));color:#fff;font-weight:800;border:var(--border);box-shadow:var(--shadow-card-xs);transition:transform .08s,box-shadow .12s}.primary:active{transform:translate(1px,1px);box-shadow:1px 1px 0 var(--ink)}.primary:disabled{opacity:.55;cursor:not-allowed}.ghost{padding:10px 14px;border-radius:10px;background:var(--surface);color:var(--ink);font-weight:700;border:var(--border);box-shadow:var(--shadow-card-xs)}.ghost:active{transform:translate(1px,1px);box-shadow:1px 1px 0 var(--ink)}.ghost.danger{color:var(--pink-deep)}.detail-overlay{position:fixed;inset:0;z-index:80;background:var(--bg-wash);background-attachment:fixed;overflow-y:auto;-webkit-overflow-scrolling:touch;animation:detailSlideIn .26s cubic-bezier(.32,.72,0,1)}.detail-overlay>.detail{max-width:640px;margin:0 auto;padding:0 16px 110px;padding-top:env(safe-area-inset-top)}@keyframes detailSlideIn{0%{transform:translate3d(100%,0,0)}to{transform:translateZ(0)}}.detail-top{display:flex;justify-content:space-between;align-items:center;position:sticky;top:env(safe-area-inset-top,0);z-index:50;margin:0 -16px 6px;padding:12px 16px;background:var(--paper);transform:translateZ(0)}.back-pill{display:inline-flex;align-items:center;gap:5px;padding:8px 14px 8px 10px;border-radius:var(--radius-pill);background:var(--surface);border:var(--border);box-shadow:var(--shadow-card-xs);font-size:13px;font-weight:800;color:var(--ink)}.back-pill:active{transform:translate(1px,1px);box-shadow:1px 1px 0 var(--ink)}.detail-top-right{display:flex;gap:6px;align-items:center}.fav-btn{width:38px;height:38px;border-radius:12px;background:var(--surface);border:var(--border);box-shadow:var(--shadow-card-xs);display:grid;place-items:center;font-size:17px;color:var(--muted);transition:background .12s,color .12s}.fav-btn.on{background:var(--ink);color:#f5cf6b}.player{margin:6px 0 14px;width:100%;aspect-ratio:16/9;background:#000;border-radius:var(--radius-card);overflow:hidden;border:var(--border);box-shadow:var(--shadow-card);outline:4px solid #fff;outline-offset:-6px;transform:rotate(-.6deg);position:relative;z-index:0}.player iframe{width:100%;height:100%;border:0}.player.short{aspect-ratio:9/16;max-width:min(100%,calc((100vh - 280px)*.5625));margin:6px auto 14px}.detail-body{padding-top:4px}.detail-body h2{font-size:22px;font-weight:800;line-height:1.2;margin:0 0 5px;letter-spacing:-.025em;color:var(--ink)}.detail-body .author{font-size:12.5px;color:var(--muted);margin:0 0 14px;font-weight:600}.detail-body .meta{font-size:11px;color:var(--muted);margin:0 0 14px;font-weight:600}.detail-body .meta .dot{margin:0 6px;opacity:.6}.note.big{position:relative;margin:14px 0 18px;padding:18px 22px 22px;background:var(--cream);border:var(--border);border-radius:6px;font-family:var(--font-hand);font-size:21px;line-height:1.45;color:var(--ink);font-weight:700;box-shadow:0 1px #0000000d,0 3px #00000008,0 14px 24px -8px #2a1a3d2e,var(--shadow-card-xs);display:flex;gap:8px;justify-content:space-between}.note.big:before{content:"";position:absolute;width:80px;height:16px;background:repeating-linear-gradient(45deg,#ffaa5aa6 0 4px,#ffd28ca6 4px 8px);border:1.5px solid var(--ink);top:-10px;left:50%;transform:translate(-50%) rotate(-3deg);border-radius:1px;box-shadow:0 1px 2px #b48c1e4d}.note.big.clamped{max-height:7.6em;overflow:hidden}.note-text{display:block}.note-toggle{display:inline;font-family:var(--font-ui);margin-left:6px;color:var(--pink);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.note-edit-btn{font-size:14px;opacity:.7;flex-shrink:0;padding:2px 6px;border-radius:6px}.note-edit-btn:hover{opacity:1;background:#2a1a3d14}.note-add-btn{margin:12px 0;padding:9px 14px;border-radius:10px;background:var(--surface);color:var(--ink);font-size:13px;font-weight:700;border:2px dashed var(--ink);box-shadow:var(--shadow-card-xs)}.note-add-btn:hover{background:var(--cream)}.note-editor{margin:12px 0;display:flex;flex-direction:column;gap:8px}.note-editor input{width:100%;padding:12px 14px;background:var(--surface);border:var(--border);border-radius:12px;outline:none;box-shadow:var(--shadow-card-xs);font-weight:600}.note-editor input:focus{border-color:var(--pink)}.note-editor-actions{display:flex;justify-content:flex-end;gap:8px}.quick-reactions{display:flex;gap:8px;margin:0 0 16px;overflow-x:auto;scrollbar-width:none;padding:4px 0}.quick-reactions::-webkit-scrollbar{display:none}.quick-react{flex-shrink:0;width:42px;height:42px;border-radius:50%;background:var(--surface);border:var(--border);font-size:20px;display:grid;place-items:center;box-shadow:var(--shadow-disc);transition:transform .1s}.quick-react:active{transform:scale(.88)}.quick-react.mine{background:linear-gradient(135deg,#ff6ba0,var(--peach));color:#fff}.reactions-row{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 16px;align-items:center}.reaction-pill{padding:5px 11px 5px 9px;border-radius:var(--radius-pill);background:var(--surface);border:var(--border);display:inline-flex;align-items:center;gap:5px;font-size:13px;font-weight:700;box-shadow:var(--shadow-card-xs);line-height:1}.reaction-pill.mine{background:var(--pink);color:#fff;border-color:var(--ink);box-shadow:1.5px 1.5px 0 var(--ink)}.reaction-pill.mine .reaction-count{color:#fff;opacity:1}.reaction-pill .reaction-emoji{font-size:15px;line-height:1}.reaction-pill .reaction-count{font-size:11px;font-weight:800;opacity:.95}.reaction-add{flex-shrink:0;padding:5px 11px 5px 9px;border-radius:var(--radius-pill);background:var(--surface);border:2px dashed var(--ink);display:inline-flex;align-items:center;gap:5px;font-size:13px;font-weight:700;color:var(--muted);box-shadow:var(--shadow-card-xs);line-height:1}.reaction-add:hover{color:var(--ink);background:var(--cream)}.reaction-add .add-emoji{font-size:15px;line-height:1}.reaction-add .add-plus{font-size:13px;font-weight:800;line-height:1}.reactions-preview{display:flex;gap:4px;margin-top:6px;flex-wrap:wrap}.reaction-mini{display:inline-flex;align-items:center;gap:3px;background:var(--surface);border:1.5px solid var(--ink);padding:2px 7px;border-radius:999px;font-size:12px;font-weight:700;box-shadow:1px 1px 0 var(--ink)}.reaction-mini .mini-count{font-size:10px;font-weight:800;color:var(--muted)}.reaction-pill.small{padding:2px 8px 2px 6px;font-size:11px;gap:3px;border-width:1.5px;box-shadow:1px 1px 0 var(--ink)}.reaction-pill.small .reaction-emoji{font-size:12px}.reaction-pill.small .reaction-count{font-size:10px}.reaction-add.small{padding:2px 7px 2px 5px;font-size:11px;gap:3px;border-width:1.5px;box-shadow:1px 1px 0 var(--ink)}.reaction-add.small .add-emoji{font-size:12px}.reaction-add.small .add-plus{font-size:10px}.watched-button{width:100%;padding:14px;border-radius:14px;background:var(--surface);color:var(--ink);font-size:14px;font-weight:700;border:var(--border);box-shadow:var(--shadow-card-xs);margin:4px 0 22px;display:flex;align-items:center;justify-content:center;gap:8px}.watched-button.on{background:var(--green);color:#fff}.comments h3,.comments-label{margin:24px 0 12px;font-size:11px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.1em;display:inline-flex;align-items:center;gap:6px}.comments ul{list-style:none;padding:0;margin:0 0 16px;display:flex;flex-direction:column;gap:8px}.comments li{display:flex}.reply-wrap{display:flex;flex-direction:column;max-width:84%}.comments li.mine{justify-content:flex-end}.comments li.mine .reply-wrap{align-items:flex-end}.reply-bubble-row{display:flex;align-items:flex-end;gap:6px}.comments li.mine .reply-bubble-row{justify-content:flex-end}.bubble{max-width:100%;padding:9px 13px;font-size:13.5px;line-height:1.4;background:var(--surface);border:var(--border);box-shadow:var(--shadow-card-xs);border-radius:18px 18px 18px 6px}.comments li.mine .bubble{background:var(--me);color:#fff;border-bottom-left-radius:18px;border-bottom-right-radius:6px}.comments li.mine .bubble strong{color:#fff}.comments li.mine .bubble small{color:#ffffffd9}.bubble strong{font-size:12px;display:block;margin-bottom:2px;font-weight:800}.bubble p{margin:0;font-size:14px;line-height:1.4}.bubble small{display:block;font-size:10px;opacity:.7;margin-top:4px;font-weight:600}.bubble small .edited{opacity:.7;font-style:italic}.reply-tools{display:flex;gap:4px;align-items:center;flex-shrink:0;opacity:.6;transition:opacity .15s}.reply-tools:hover,.reply-bubble-row:hover .reply-tools{opacity:1}.reply-tool{font-size:12px;width:26px;height:26px;display:grid;place-items:center;border-radius:50%;background:var(--surface);border:1.5px solid var(--ink);box-shadow:1px 1px 0 var(--ink);color:var(--ink)}.reply-tool:active{transform:translate(1px,1px);box-shadow:0 0 0 var(--ink)}.reply-tool.danger{color:var(--pink-deep)}.reply-editor input{width:100%;padding:6px 10px;background:#ffffffd9;color:var(--ink);border:1.5px solid var(--ink);border-radius:8px;outline:none;font:inherit;font-weight:600}.reply-editor-actions{display:flex;justify-content:flex-end;gap:6px;margin-top:6px}.reply-action{font-size:12px;font-weight:700;padding:4px 10px;border-radius:6px;background:#fffc;color:var(--ink);border:1.5px solid var(--ink)}.reply-action.save{background:var(--ink);color:var(--paper)}.reply-reactions{display:flex;gap:4px;margin-top:4px;padding:0 4px;flex-wrap:wrap}.reply-reactions.mine{justify-content:flex-end}.comment-form{display:flex;gap:8px;margin-top:6px}.comment-form input{flex:1;padding:12px 14px;background:var(--surface);border:var(--border);border-radius:14px;outline:none;box-shadow:var(--shadow-card-xs);font-weight:500}.comment-form input:focus{border-color:var(--pink)}.fb-preview{display:block;width:100%;border:var(--border);border-radius:var(--radius-card);overflow:hidden;background:var(--surface);box-shadow:var(--shadow-card);text-decoration:none;color:var(--ink);margin:6px 0 14px}.fb-preview-thumb{position:relative;width:100%;aspect-ratio:16/9;background:#1877f2;overflow:hidden;border-bottom:var(--border)}.fb-preview-thumb img{width:100%;height:100%;object-fit:cover}.fb-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:64px;height:64px;border-radius:50%;background:#0000008c;color:#fff;display:grid;place-items:center;font-size:24px;padding-left:5px;border:var(--border)}.fb-preview-body{padding:14px 16px;background:var(--surface)}.fb-preview-title{font-size:16px;font-weight:700;line-height:1.35;margin-bottom:8px;color:var(--ink)}.fb-preview-cta{font-size:13px;color:#1877f2;font-weight:800}.emoji-backdrop{position:fixed;inset:0;background:#2a1a3d66;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:100;display:flex;align-items:flex-end;justify-content:center;animation:fadeIn .15s ease-out}.emoji-sheet,.settings-sheet{width:100%;max-width:480px;background:var(--paper);border:var(--border);border-bottom:0;border-radius:24px 24px 0 0;padding:8px 20px max(20px,env(safe-area-inset-bottom));box-shadow:0 -10px 40px #2a1a3d4d;animation:slideUp .2s ease-out;color:var(--ink);overflow:hidden}.emoji-sheet-handle{width:44px;height:5px;background:var(--ink);border-radius:999px;margin:6px auto 8px;cursor:pointer;opacity:.4}.emoji-sheet-header{padding:6px 0 10px;display:flex;flex-direction:column;gap:2px}.emoji-sheet-header>span:first-child{font-size:14px;font-weight:800;color:var(--ink)}.emoji-sheet-hint{font-size:11px;color:var(--muted);font-weight:600}emoji-picker{--background: var(--surface);--border-color: rgba(42,26,61,.1);--button-active-background: rgba(232,90,150,.2);--button-hover-background: rgba(42,26,61,.06);--category-emoji-padding: .4rem;--category-emoji-size: 1.2rem;--emoji-size: 2rem;--emoji-padding: .4rem;--indicator-color: var(--pink);--input-border-color: rgba(42,26,61,.15);--input-font-color: var(--ink);--input-font-size: 1rem;--input-padding: .6rem .75rem;--input-placeholder-color: var(--muted);--num-columns: 7;--outline-color: var(--pink);width:calc(100% + 40px);margin:0 -20px calc(-1*max(20px,env(safe-area-inset-bottom)));height:70vh;max-height:680px;min-height:460px;border-radius:0;border:0;touch-action:manipulation;display:block}emoji-picker::part(search-input),emoji-picker::part(search){font-size:16px;-webkit-user-select:text;user-select:text}emoji-picker::part(nav){background:#2a1a3d0f;border-radius:10px;padding:4px;margin:4px 8px 8px}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.settings-title{font-size:12px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;margin:18px 0 10px}.settings-title-toggle{background:none;border:none;padding:0;cursor:pointer;display:inline-flex;align-items:center;gap:6px;font-family:inherit;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:18px 0 10px}.settings-title-toggle:hover{color:var(--ink)}.settings-title-chevron{font-size:16px;line-height:1;transition:transform .18s ease-out}.settings-title-toggle.open .settings-title-chevron{transform:rotate(90deg)}.theme-segments{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;background:#2a1a3d0f;padding:4px;border-radius:14px;border:var(--border)}.segment{padding:10px 8px;border-radius:10px;font-size:13px;font-weight:700;color:var(--muted);display:flex;flex-direction:column;align-items:center;gap:2px}.segment span:first-child{font-size:18px}.segment.on{background:var(--ink);color:var(--paper)}.palette-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.palette-swatch{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 6px;border-radius:14px;border:2px solid transparent}.palette-swatch.on{border-color:var(--ink);background:#2a1a3d0f}.swatch-circle{width:36px;height:36px;border-radius:50%;border:var(--border);box-shadow:var(--shadow-card-xs)}.swatch-name{font-size:12px;font-weight:700;color:var(--ink)}.settings-done{width:100%;margin-top:22px;padding:14px}.pair-code-row{background:var(--cream);border:1.5px dashed var(--ink);border-radius:10px;padding:10px 14px;display:flex;flex-direction:column;gap:4px}.pair-code{font-family:var(--font-stamp);font-size:16px;font-weight:800;letter-spacing:.12em;color:var(--ink);text-transform:uppercase}.pair-code-hint{font-size:11px;color:var(--muted);font-weight:600}.sign-out-link{display:block;width:100%;margin-top:14px;padding:10px;background:none;color:var(--pink-deep);font-size:13px;font-weight:700;text-decoration:underline;text-underline-offset:3px}.icon-picker{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:10px}.icon-tile{display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px 6px;background:var(--surface);border:2px solid var(--ink);border-radius:14px;box-shadow:2px 2px 0 var(--ink);position:relative;transition:transform .12s}.icon-tile:active{transform:translate(1px,1px);box-shadow:1px 1px 0 var(--ink)}.icon-tile img{width:56px;height:56px;border-radius:12px}.icon-tile-name{font-size:11px;font-weight:700;color:var(--ink);text-transform:capitalize}.icon-tile.on{background:var(--cream)}.icon-tile-current{position:absolute;top:-6px;right:-6px;width:20px;height:20px;background:var(--green);color:#fff;font-size:11px;font-weight:800;border-radius:50%;border:1.5px solid var(--ink);display:grid;place-items:center}.install-steps{margin:0 0 14px;padding-left:20px;font-size:13.5px;line-height:1.5;color:var(--ink)}.install-steps li{margin-bottom:8px}.install-url{background:var(--cream);border:1.5px dashed var(--ink);border-radius:10px;padding:10px 12px;display:flex;flex-direction:column;gap:8px;margin-bottom:14px}.install-url code{font-family:var(--font-stamp);font-size:12px;color:var(--ink);word-break:break-all;font-weight:700}.names-editor{display:flex;flex-direction:column;gap:10px;padding:4px 0 12px}.names-editor label{display:flex;flex-direction:column;gap:4px}.names-editor label>span{font-size:12px;color:var(--muted);font-weight:700}.names-editor input{padding:10px 12px;background:var(--surface);border:var(--border);border-radius:10px;color:var(--ink);outline:none;font:inherit;font-weight:600;box-shadow:var(--shadow-card-xs)}.names-editor input:focus{border-color:var(--pink)}.names-save{align-self:flex-end;padding:10px 16px;font-size:13px}.names-save.saved{background:var(--green)}.push-row{padding:4px 0 8px}.push-status{font-size:13px;margin:6px 0;color:var(--ink);line-height:1.4;font-weight:600}.push-status.dim{color:var(--muted)}.push-toggle-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:8px 0}.push-toggle-row>span{font-size:13px;color:var(--ink);flex:1;line-height:1.35;font-weight:600}.switch{width:50px;height:30px;border-radius:999px;background:var(--surface);border:var(--border);box-shadow:var(--shadow-card-xs);position:relative;flex-shrink:0;padding:0}.switch.on{background:linear-gradient(135deg,#ff6ba0,var(--peach))}.switch:disabled{opacity:.5}.switch-knob{position:absolute;top:2px;left:2px;width:22px;height:22px;border-radius:50%;background:var(--ink);transition:transform .18s}.switch.on .switch-knob{transform:translate(20px);background:var(--surface)}.onboarding{min-height:100vh;display:grid;place-items:center;padding:20px}.onboarding-card{background:var(--surface);border:var(--border);box-shadow:var(--shadow-card);border-radius:24px;padding:32px 24px;width:100%;max-width:420px;text-align:center;transform:rotate(-1deg)}.onboarding-card .brand-mark.big{width:72px;height:72px;font-size:36px;margin:0 auto}.onboarding-card h1{margin:16px 0 4px;font-size:32px;font-weight:800;letter-spacing:-.03em}.lede{color:var(--muted);margin:0 0 28px;font-weight:600}.onboarding-card form{display:flex;flex-direction:column;gap:14px;text-align:left}.onboarding-card label{display:flex;flex-direction:column;gap:6px}.onboarding-card label>span{font-size:12px;color:var(--muted);font-weight:800;text-transform:uppercase;letter-spacing:.05em}.onboarding-card input{width:100%;padding:12px 14px;background:var(--surface);border:var(--border);border-radius:12px;outline:none;box-shadow:var(--shadow-card-xs);font-weight:600}.onboarding-card input:focus{border-color:var(--pink)}.onboarding-card .row{display:flex;gap:8px}.onboarding-card .row input{flex:1}.onboarding-card small{color:var(--muted);font-size:11px;font-weight:600}.onboarding-card .primary{margin-top:8px}.onboarding-bullets{list-style:none;padding:0;margin:0 0 24px;display:flex;flex-direction:column;gap:10px;text-align:left}.onboarding-bullets li{display:flex;align-items:center;gap:12px;background:var(--surface);border:var(--border);box-shadow:var(--shadow-card-xs);border-radius:14px;padding:10px 14px;font-weight:600;font-size:14px;color:var(--text)}.bullet-emoji{font-size:20px;line-height:1}.onboarding-choices{display:flex;flex-direction:column;gap:12px;margin-bottom:16px}.onboarding-choice{text-align:left;background:var(--surface);border:var(--border);box-shadow:var(--shadow-card);border-radius:16px;padding:16px;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease;font:inherit;color:inherit}@media(hover:hover){.onboarding-choice:hover{transform:translateY(-2px);box-shadow:var(--shadow-card-lg, var(--shadow-card))}}.onboarding-choice:active{transform:translateY(0)}.choice-emoji{font-size:28px;margin-bottom:6px}.choice-title{font-weight:800;font-size:16px;margin-bottom:4px}.choice-sub{font-size:13px;color:var(--muted);font-weight:600;line-height:1.4}.back-link{margin-top:12px;align-self:center;font-size:13px}.onboarding-card .code-display{text-align:center;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:18px;font-weight:700;letter-spacing:.02em;background:var(--bg-wash, var(--surface))}.onboarding-card .code-actions{gap:8px;margin-top:6px}.onboarding-card .code-actions .ghost{flex:1;padding:10px;font-weight:700}.splash{position:fixed;inset:0;background:var(--bg-wash);display:grid;place-items:center;z-index:1000;animation:splashIn .4s cubic-bezier(.2,.7,.3,1) both;pointer-events:none}.splash.out{animation:splashOut .5s ease-out forwards}.splash-stage{position:relative;width:110px;height:110px}.splash-mark{position:absolute;inset:0;border-radius:50%;background:linear-gradient(135deg,#ff6ba0,var(--peach));display:grid;place-items:center;font-size:56px;color:#fff;border:var(--border);box-shadow:0 14px 30px #ff6ba066;animation:splashSpin 2.4s cubic-bezier(.5,0,.5,1) infinite;z-index:2}.splash-shadow{position:absolute;inset:0;border-radius:50%;background:#b43c788c;z-index:1;animation:splashShadowSpin 2.4s cubic-bezier(.5,0,.5,1) infinite}@keyframes splashShadowSpin{0%{transform:rotate(0) translateY(8px)}to{transform:rotate(-360deg) translateY(8px)}}.splash-title{margin-top:22px;font-size:38px;font-weight:800;letter-spacing:-.03em;color:var(--ink);opacity:0;animation:splashFade .6s ease-out .4s forwards}@keyframes splashIn{0%{opacity:0}to{opacity:1}}@keyframes splashOut{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.06)}}@keyframes splashSpin{0%{transform:rotate(0) scale(1)}50%{transform:rotate(180deg) scale(1.08)}to{transform:rotate(360deg) scale(1)}}@keyframes splashFade{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.sync-pill{font-size:10.5px;font-weight:800;color:var(--green);background:var(--surface);border:var(--border);border-radius:999px;padding:4px 10px;letter-spacing:.06em;text-transform:uppercase;box-shadow:var(--shadow-card-xs);display:inline-flex;align-items:center;gap:5px}.sync-pill:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--green)}.sync-pill[data-syncing=true]{color:var(--peach)}.sync-pill[data-syncing=true]:before{background:var(--peach)}@media(min-width:720px){.card-main{padding:0}.thumb{width:140px}.card-title{font-size:15.5px}}