:root{--bg:#e6e7ee;--bg-soft:#ecedf4;--text:#4a4b57;--text-muted:#8a8b98;--text-strong:#2c2d38;--accent:#6b5ce7;--shadow-dark:#b8b9c5;--shadow-light:#fff;--radius-lg:28px;--radius-sm:14px;--serif:"Iowan Old Style", "Palatino Linotype", "Book Antiqua", Palatino, "Source Serif Pro", Georgia, "Times New Roman", serif;--sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, "Helvetica Neue", Arial, sans-serif}*,:before,:after{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;min-height:100vh;font-size:16px;line-height:1.5}#app{max-width:1440px;margin:0 auto;padding:clamp(24px,4vw,56px) clamp(18px,3vw,44px) 56px}.site-header{text-align:left;margin-bottom:clamp(20px,3vw,40px)}.eyebrow{font-family:var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--text-muted);margin:0 0 14px;font-size:11px;font-weight:600}.site-header h1{font-family:var(--serif);letter-spacing:-.02em;color:var(--text-strong);margin:0 0 12px;font-size:clamp(38px,5.5vw,68px);font-weight:400;line-height:1.05}.view-pills{background:var(--bg);box-shadow:inset 3px 3px 7px var(--shadow-dark), inset -3px -3px 7px var(--shadow-light);border-radius:999px;gap:8px;margin-top:8px;padding:6px;display:inline-flex}.pill{appearance:none;font-family:var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:999px;padding:7px 18px;font-size:11px;font-weight:700;transition:color .16s,box-shadow .2s,background .2s}.pill:hover{color:var(--text-strong)}.pill.is-active{color:var(--accent);background:var(--bg);box-shadow:3px 3px 7px var(--shadow-dark), -3px -3px 7px var(--shadow-light)}.pill__count{font-variant-numeric:tabular-nums;opacity:.75;margin-left:4px}.pill:focus-visible{box-shadow:3px 3px 7px var(--shadow-dark), -3px -3px 7px var(--shadow-light), 0 0 0 3px var(--accent);outline:none}.grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));grid-auto-flow:dense;align-items:stretch;gap:clamp(16px,1.8vw,24px);display:grid}.empty-state{text-align:center;font-family:var(--serif);color:var(--text-muted);grid-column:1/-1;margin:40px 0;padding:32px;font-size:16px;font-style:italic}.empty-state__title{color:var(--text);margin:0 0 8px;font-size:18px}.empty-state__sub{color:var(--text-muted);opacity:.85;margin:0;font-size:14px}.drag-tip{font-family:var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--text);background:var(--bg);box-shadow:6px 6px 14px var(--shadow-dark), -6px -6px 14px var(--shadow-light);opacity:0;pointer-events:none;z-index:50;border-radius:999px;padding:10px 18px;font-size:11px;font-weight:600;transition:opacity .36s,transform .36s;position:fixed;bottom:28px;left:50%;transform:translate(-50%,12px)}.drag-tip.is-visible{opacity:1;transform:translate(-50%)}@media (prefers-reduced-motion:reduce){.drag-tip{transition:opacity .16s linear}}.tile{background:var(--bg);border-radius:var(--radius-lg);min-height:160px;box-shadow:10px 10px 24px var(--shadow-dark), -10px -10px 24px var(--shadow-light);cursor:pointer;outline:none;flex-direction:column;gap:12px;padding:clamp(14px,1.5vw,22px) calc(clamp(14px,1.5vw,22px) + 30px) clamp(14px,1.5vw,22px) clamp(14px,1.5vw,22px);transition:box-shadow .32s,transform .32s,opacity .2s;display:flex;position:relative}.tile.tile--dragging{opacity:.55;cursor:grabbing;transition:transform .18s,opacity .18s,box-shadow .2s;transform:scale(.98)rotate(-.5deg)}.tile.tile--drop-before{box-shadow:inset 4px 0 0 var(--accent), 10px 10px 24px var(--shadow-dark), -10px -10px 24px var(--shadow-light)}.tile.tile--drop-after{box-shadow:inset -4px 0 0 var(--accent), 10px 10px 24px var(--shadow-dark), -10px -10px 24px var(--shadow-light)}.tile:hover{box-shadow:8px 8px 20px var(--shadow-dark), -8px -8px 20px var(--shadow-light);transform:translateY(-2px)}.tile:active{box-shadow:inset 4px 4px 10px var(--shadow-dark), inset -4px -4px 10px var(--shadow-light);transition-duration:80ms;transform:translateY(0)scale(.985)}.tile:focus-visible{box-shadow:inset 6px 6px 14px var(--shadow-dark), inset -6px -6px 14px var(--shadow-light), 0 0 0 3px var(--accent);transform:translateY(0)}.tile--featured{min-height:240px;box-shadow:16px 16px 36px var(--shadow-dark), -16px -16px 36px var(--shadow-light);cursor:pointer;border-left:3px solid var(--accent);background:linear-gradient(145deg,#eceef7,#dfe0ea);grid-area:span 2/span 2;padding:clamp(20px,2vw,32px) calc(clamp(20px,2vw,32px) + 30px) clamp(20px,2vw,32px) clamp(20px,2vw,32px)}.tile--featured:hover{box-shadow:12px 12px 28px var(--shadow-dark), -12px -12px 28px var(--shadow-light);transform:translateY(-3px)}.tile--featured .tile__quote p{font-size:clamp(20px,1.9vw,28px);line-height:1.3}.tile__star{width:28px;height:28px;color:var(--text-muted);opacity:.45;cursor:pointer;z-index:2;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;padding:0;transition:transform .16s,opacity .16s,color .16s;display:inline-flex;position:absolute;top:10px;right:10px}.tile:hover .tile__star{opacity:.65}.tile__star:hover{color:var(--accent);transform:scale(1.18);opacity:1!important}.tile__star:focus-visible{opacity:1;box-shadow:0 0 0 3px var(--accent);outline:none}.tile__star.is-on{opacity:1;color:var(--accent);animation:.36s cubic-bezier(.34,1.56,.64,1) star-pop}@keyframes star-pop{0%{transform:scale(.6)}50%{transform:scale(1.3)}to{transform:scale(1)}}.tile__star.is-on svg path{fill:var(--accent);stroke:var(--accent)}.tile__badge{font-family:var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--accent);margin:0;padding-right:30px;font-size:10px;font-weight:700}.tile__quote{flex:1;align-items:center;margin:0;display:flex}.tile__quote p{font-family:var(--serif);color:var(--text-strong);letter-spacing:-.005em;margin:0;font-size:clamp(15px,1.2vw,18px);font-weight:400;line-height:1.45}.tile__quote p:before{content:"“";color:var(--text-muted);margin-right:.08em}.tile__quote p:after{content:"”";color:var(--text-muted);margin-left:.04em}.tile__attribution{border-top:1px solid #787a8c1f;flex-direction:column;gap:3px;margin-top:auto;padding-top:10px;display:flex}.tile__author{font-family:var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--text-strong);font-size:11px;font-weight:700}.tile__source{font-family:var(--serif);color:var(--text-muted);font-size:12px;font-style:italic}.site-footer{color:var(--text-muted);text-align:center;margin-top:clamp(32px,4vw,56px);padding-top:20px;font-size:12px}.site-footer p{margin:0}.site-footer a{color:inherit;letter-spacing:.08em;text-decoration:none;transition:color .2s}.site-footer a:hover{color:var(--accent)}@media (width<=1024px){.grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}.tile--featured{grid-area:span 1/span 2;min-height:220px}}@media (width<=640px){#app{padding:32px 18px 56px}.grid{grid-template-columns:1fr;gap:16px}.tile{min-height:150px;box-shadow:8px 8px 18px var(--shadow-dark), -8px -8px 18px var(--shadow-light);border-radius:22px}.tile--featured{grid-area:span 1/span 1;min-height:200px}.tile--featured .tile__quote p{font-size:20px}}@keyframes tile-enter{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.tile{animation:.4s cubic-bezier(.22,1,.36,1) both tile-enter}@media (prefers-reduced-motion:reduce){.tile{transition:none;animation:none}.tile__star.is-on{animation:none}.overlay,.overlay__card{transition:none!important}}.overlay{z-index:100;opacity:0;visibility:hidden;justify-content:center;align-items:center;padding:clamp(16px,3vw,32px);transition:opacity .2s,visibility 0s linear .2s;display:flex;position:fixed;inset:0}.overlay.open{opacity:1;visibility:visible;transition:opacity .2s,visibility linear}.overlay__backdrop{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#e6e7eeeb;position:absolute;inset:0}.overlay__card{background:var(--bg);border-radius:var(--radius-lg);width:100%;max-width:52rem;box-shadow:18px 18px 40px var(--shadow-dark), -18px -18px 40px var(--shadow-light);padding:56px 64px;transition:transform .2s;position:relative;transform:translateY(8px)}.overlay.open .overlay__card{transform:translateY(0)}.overlay__close{width:32px;height:32px;font-family:var(--sans);color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:50%;padding:0;font-size:28px;line-height:1;transition:color .16s,background .16s;position:absolute;top:14px;right:14px}.overlay__close:hover,.overlay__close:focus-visible{color:var(--text-strong);background:#787a8c14;outline:none}.overlay__close:focus-visible{box-shadow:0 0 0 3px var(--accent)}.overlay__quote{margin:0 0 36px}.overlay__quote p{font-family:var(--serif);letter-spacing:-.015em;color:var(--text-strong);text-align:center;margin:0;font-size:clamp(32px,5vw,72px);font-weight:400;line-height:1.18}.overlay__quote p:before{content:"“";color:var(--accent);opacity:.4;margin-right:.04em}.overlay__quote p:after{content:"”";color:var(--accent);opacity:.4;margin-left:.02em}.overlay__attr{text-align:center;flex-direction:column;gap:8px;display:flex}.overlay__author{font-family:var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--text-strong);font-size:13px;font-weight:600}.overlay__source{font-family:var(--serif);color:var(--text-muted);font-size:14px;font-style:italic}.overlay__copy{background:var(--bg);font-family:var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--text-muted);cursor:pointer;box-shadow:4px 4px 10px var(--shadow-dark), -4px -4px 10px var(--shadow-light);border:none;border-radius:999px;margin:24px auto 0;padding:8px 24px;font-size:11px;font-weight:700;transition:color .16s,box-shadow .2s,transform .16s;display:block}.overlay__copy:hover{color:var(--accent);box-shadow:6px 6px 14px var(--shadow-dark), -6px -6px 14px var(--shadow-light);transform:translateY(-1px)}.overlay__copy:active{box-shadow:inset 3px 3px 7px var(--shadow-dark), inset -3px -3px 7px var(--shadow-light);transform:translateY(0)}.overlay__copy:focus-visible{box-shadow:4px 4px 10px var(--shadow-dark), -4px -4px 10px var(--shadow-light), 0 0 0 3px var(--accent);outline:none}.overlay__copy.is-copied{color:#3fa66a;box-shadow:4px 4px 10px var(--shadow-dark), -4px -4px 10px var(--shadow-light), 0 0 0 2px #3fa66a59, 0 0 18px #3fa66a59}.overlay__copy.is-copied:before{content:"✓";color:#3fa66a;transform-origin:50%;margin-right:6px;font-size:13px;font-weight:700;animation:.32s cubic-bezier(.34,1.56,.64,1) both copy-check-in;display:inline-block}@keyframes copy-check-in{0%{opacity:0;transform:scale(0)}60%{opacity:1;transform:scale(1.25)}to{opacity:1;transform:scale(1)}}.overlay__hint{text-align:center;font-family:var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--text-muted);opacity:.7;margin:0;font-size:10px;position:absolute;bottom:16px;left:0;right:0}@media (width<=640px){.overlay__card{padding:56px 28px 48px}.overlay__quote{margin-bottom:28px}}