:root{color-scheme:light;--bg:#fffaf3;--surface:#fffefa;--line:#e7d6c6;--text:#4d3429;--muted:#826e61;--accent:#b65f72;--pink:#f5dce0;--cocoa:#855c46}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.5 system-ui,-apple-system,sans-serif}button,input{font:inherit}button,a,label.button{touch-action:manipulation}button,.button{cursor:pointer;border:1px solid var(--line);border-radius:9px;padding:8px 12px;background:var(--pink);color:var(--text);text-decoration:none;font-weight:650}button:hover,.button:hover{filter:brightness(.96)}button:disabled{opacity:.5;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.quiet{background:transparent;color:var(--text)}a{color:var(--cocoa)}
main{position:relative;z-index:1;max-width:1440px;margin:auto;padding:0 28px}h1{font-size:clamp(22px,2.6vw,31px);line-height:1.2;letter-spacing:-.8px;margin:19px 0 12px}h1 span{color:var(--accent)}
.buddies{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:0}.face{position:absolute;display:block;width:112px;height:112px;overflow:hidden;border-radius:46% 48% 44% 45%;opacity:.34;transform:rotate(-16deg)}.face img{position:absolute;width:285%;height:285%;max-width:none;top:-80%;left:-48%}.face-brown{opacity:.43}.face-brown img{left:-142%}.face.sticker{overflow:visible;border-radius:0;mix-blend-mode:multiply;opacity:.42}.face.sticker img{width:100%;height:100%;left:0;top:0;object-fit:contain}.face:nth-child(1){left:-28px;top:28px;width:132px;height:132px;transform:rotate(-22deg)}.face:nth-child(2){right:-17px;top:190px;transform:rotate(24deg)}.face:nth-child(3){left:40%;top:9px;width:76px;height:76px;transform:rotate(16deg)}.face:nth-child(4){left:4%;top:55%;width:91px;height:91px;transform:rotate(-31deg)}.face:nth-child(5){right:3%;top:77%;width:142px;height:142px;transform:rotate(18deg)}.face:nth-child(6){left:48%;top:35%;transform:rotate(-12deg)}.face:nth-child(7){right:23%;top:63%;width:88px;height:88px;transform:rotate(32deg)}.face:nth-child(8){left:22%;top:88%;transform:rotate(-21deg)}.face:nth-child(9){right:7%;top:3px;width:97px;height:97px;transform:rotate(-14deg)}.face:nth-child(10){left:-35px;top:83%;transform:rotate(30deg)}.face:nth-child(11){left:18%;top:23%;width:75px;height:75px;transform:rotate(25deg)}.face:nth-child(12){right:31%;top:15%;width:89px;height:89px;transform:rotate(-25deg)}.face:nth-child(13){left:2%;top:35%;width:84px;height:84px;transform:rotate(18deg)}.face:nth-child(14){left:36%;top:67%;width:124px;height:124px;transform:rotate(-18deg)}.face:nth-child(15){right:-28px;top:47%;width:102px;height:102px;transform:rotate(-24deg)}.face:nth-child(16){right:13%;top:91%;width:82px;height:82px;transform:rotate(165deg)}.face:nth-child(17){left:49%;top:10px;width:70px;height:70px;transform:rotate(-24deg)}.face:nth-child(18){left:60%;top:42px;width:64px;height:64px;transform:rotate(19deg)}.face:nth-child(19){left:70%;top:3px;width:80px;height:80px;transform:rotate(-13deg)}.face:nth-child(20){left:25%;top:22%;width:76px;height:76px;transform:rotate(31deg)}.face:nth-child(21){left:-29px;top:23%;width:118px;height:118px;transform:rotate(21deg)}.face:nth-child(22){right:-27px;top:35%;width:111px;height:111px;transform:rotate(-19deg)}.face:nth-child(23){left:-24px;top:70%;width:136px;height:136px;transform:rotate(-12deg)}.face:nth-child(24){right:-20px;top:91%;width:109px;height:109px;transform:rotate(24deg)}.face:nth-child(25){left:24%;top:48%;width:72px;height:72px;transform:rotate(-17deg)}.face:nth-child(26){right:24%;top:82%;width:93px;height:93px;transform:rotate(28deg)}.face:nth-child(27){left:54%;top:55%;width:81px;height:81px;transform:rotate(-28deg)}.face:nth-child(28){left:47%;top:93%;width:121px;height:121px;transform:rotate(15deg)}
.toolbar{display:flex;align-items:center;justify-content:space-between;gap:22px;border-bottom:1px solid var(--line);padding:0 0 9px}.tabs{display:flex;align-items:center;gap:12px}.tabs button{display:flex;align-items:center;gap:6px;border:1px solid transparent;background:transparent;color:var(--muted);padding:8px 10px;font-size:12px;white-space:nowrap}.tabs button[aria-pressed=true]{color:var(--text);background:var(--pink);border-color:#eac5cd}.tabs span{font-size:10px;border-radius:20px;padding:1px 6px;background:#f1e4d6;color:#6d4937}.tabs button[aria-pressed=true] span{background:#fff9f7}.filters{flex:0 0 210px}.rating{display:grid;grid-template-columns:1fr auto;align-items:center;font-size:11px;color:var(--muted);gap:1px 8px}.rating output{color:var(--accent);font-size:16px;font-weight:750}input[type=range]{grid-column:1/-1;display:block;width:100%;accent-color:var(--accent);margin:0;height:18px;cursor:pointer}.muted{font-size:11px;color:var(--muted)}#sync-status{margin:10px 0}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:10px 0 32px;align-items:start}
.card{display:grid;grid-template-columns:106px minmax(0,1fr);overflow:hidden;background:rgba(255,254,250,.98);border:1px solid var(--line);border-radius:15px;box-shadow:0 3px 13px #704e3408}.poster{height:146px;margin:12px 0 8px 12px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;border-radius:9px;background:linear-gradient(145deg,#ecd6be,#d6b394)}.poster img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.monogram{font:45px Georgia,serif;color:#876450;opacity:.6}.score{position:absolute;bottom:6px;left:5px;background:#fff1cf;color:#65472c;border:1px solid #fffaf0;padding:2px 6px;border-radius:6px;font-weight:800;font-size:12px;box-shadow:0 1px 5px #0002}.card-body{padding:12px 12px 8px 11px;min-width:0}.card h3{font-size:15px;line-height:1.25;margin:0 0 3px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}.original{font-size:10px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.metadata{font-size:10px;color:var(--muted);margin-top:3px}.description{font-size:12px;color:#655045;line-height:1.45;margin:6px 0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.platforms{font-size:10px;font-weight:650;color:var(--cocoa);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.4}.source-tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:5px}.source{font-size:9px;border-radius:4px;background:#f1e4d6;color:#694a39;padding:1px 5px}.card-actions{grid-column:1/-1;display:flex;align-items:center;gap:10px;padding:7px 11px;border-top:1px solid #eee2d5}.read-more{border:0;background:transparent;color:var(--accent);padding:6px 0;font-size:11px;white-space:nowrap}.links{display:flex;gap:8px;font-size:10px;white-space:nowrap}.links a{text-decoration-color:#c9b3a0;text-underline-offset:2px}.move{margin-left:auto;padding:6px 9px;font-size:10px;background:var(--cocoa);color:#fffdf8;border-color:var(--cocoa);white-space:nowrap;min-height:30px}.card-extra{grid-column:1/-1;border-top:1px dashed var(--line);margin:0 12px;padding:8px 0}.offers{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:7px}.offer{font-size:10px;padding:3px 6px;background:#f5eadc;border-radius:5px;color:#71503a}.card.expanded .description{display:block}.card.expanded h3{display:block}.card.expanded .original{white-space:normal}.card.expanded .platforms{display:block}
.empty{text-align:center;border:1px dashed #cfb7a3;padding:45px 20px;margin:20px 0 40px;border-radius:15px;background:#fffbf5b3}.empty h3{font-size:22px;margin:0 0 10px}.empty p{color:var(--muted);max-width:600px;margin:0 auto}.panel{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:22px;margin:20px 0;font-size:13px}.panel h2{margin-top:0}.panel code{overflow-wrap:anywhere}.data-actions{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0}.note{color:#926b37}.error{background:#f7dce0;padding:14px;border-radius:8px;color:#873f4a}.restored-row{padding:12px 0;border-top:1px solid var(--line)}footer{border-top:1px solid var(--line);padding:18px 0 28px;color:var(--muted);font-size:10px;display:flex;justify-content:space-between;gap:16px;align-items:center}#data-toggle{font-size:11px;padding:6px 10px}#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#fffaf4;color:var(--text);border:1px solid #d9bda8;border-radius:10px;box-shadow:0 5px 30px #533b2926;padding:12px 16px;max-width:95%;width:max-content;z-index:5;font-size:12px}#toast button{margin-left:12px;padding:5px 10px}[hidden]{display:none!important}
@media(max-width:1220px){.grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1000px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){main{padding:0 16px}h1{font-size:22px;margin:16px 0 11px}.toolbar{gap:10px}.tabs{gap:3px;flex:1;min-width:0}.tabs button{font-size:10px;padding:6px;gap:4px;white-space:normal;line-height:1.25}.tabs span{font-size:9px;padding:1px 5px;flex-shrink:0}.filters{flex:0 0 94px}.rating{font-size:10px;gap:0 4px}.rating output{font-size:14px}.grid{grid-template-columns:1fr;gap:10px}.card{grid-template-columns:102px minmax(0,1fr)}.poster{height:140px}.card-body{padding:11px 11px 7px 10px}.card h3{font-size:14px}.description{font-size:11.5px}.card-actions{gap:9px}footer{flex-direction:column;align-items:flex-start;gap:10px}.face{opacity:.29}.face-brown{opacity:.37}.face.sticker{opacity:.35}.face:nth-child(3){left:54%;top:122px}.face:nth-child(9){right:-20px;top:4px}.face:nth-child(11){left:29%;top:41%}.face:nth-child(12){right:36%;top:26%}.face:nth-child(13){left:-12px;top:62%}.face:nth-child(14){left:37%;top:82%}}
@media(max-width:360px){main{padding:0 12px}.toolbar{gap:6px}.filters{flex-basis:82px}.tabs button{padding:6px 4px;font-size:9px}.tabs span{padding:1px 4px}.card-actions{gap:7px}.move{font-size:9px;padding:6px}.links{gap:6px}}

@media(max-width:640px){.face:nth-child(17){left:-28px;top:17%;width:100px;height:100px}.face:nth-child(18){left:auto;right:-28px;top:43%;width:109px;height:109px}.face:nth-child(19){left:10%;top:77%;width:104px;height:104px}.face:nth-child(20){left:68%;top:28%}.face:nth-child(21){left:36%;top:52%;width:77px;height:77px}.face:nth-child(22){right:18%;top:86%;width:83px;height:83px}.face:nth-child(27){left:50%;top:60%}}
