@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Lora:ital,wght@0,400;0,500;0,600;1,400;1,500&display=swap');
:root{--paper:#f8f7f2;--white:#fffefa;--ink:#233e36;--green:#24554a;--muted:#7a8177;--line:#e6e7de;--gold:#b18a40;--font:'DM Sans',system-ui,sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);font-size:14px}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #bb963e;outline-offset:3px}button{color:inherit}a{color:var(--green)}.shell{max-width:1800px;margin:auto;display:grid;grid-template-columns:254px 1fr;min-height:100vh}.sidebar{background:#efefe6;border-right:1px solid #e0e2d7;position:sticky;top:0;height:100vh;padding:38px 23px 20px;display:flex;flex-direction:column}.brand{display:flex;gap:11px;text-decoration:none;line-height:1.05;font-family:'Lora',Georgia,serif;font-size:24px;letter-spacing:-.8px}.brand b{font-weight:500}.brand-icon{font-family:serif;width:40px;height:46px;font-size:47px;color:var(--green);line-height:1}.brand small{display:block;font:8px var(--font);letter-spacing:1.6px;margin-top:13px;color:#7b8172}.nav-label{font-size:8px;letter-spacing:1.3px;color:#939989;margin:58px 8px 19px}nav{display:grid;gap:8px}.nav-item{background:transparent;border:0;border-radius:7px;display:flex;align-items:center;gap:12px;width:100%;text-align:left;font-size:12px;padding:14px 13px;color:#657365;white-space:nowrap}.nav-item>span{font-size:21px;line-height:1;width:20px;text-align:center}.nav-item>b{font-size:10px;margin-left:auto;font-weight:500;background:#e1e5db;padding:3px 6px;border-radius:4px}.nav-item.active{background:var(--green);color:white;box-shadow:0 3px 7px #24554a15}.nav-item.active>b{background:#ffffff1c}.sidebar-bottom{margin-top:auto;padding:25px 10px 20px}.little-book{font-size:39px;color:var(--gold)}h3{font-size:14px;margin:8px 0}.sidebar-bottom p{font-size:11px;line-height:1.9;color:#89917f;margin:7px 0 20px}.install-btn{border:1px solid #d9ded0;background:transparent;border-radius:6px;padding:11px 10px;font-size:10px;width:100%;text-align:left}.install-btn span{float:right}.text-button{background:none;border:0;color:#808775;font-size:10px;padding:15px 0}.sidebar-foot{font-size:7px;letter-spacing:1.2px;color:#8b9284;white-space:nowrap}.sidebar-foot span{color:#b58d64;margin-left:6px}main{min-width:0;padding:0 48px}header{height:83px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);font-size:10px;color:#91988b}.breadcrumb span{margin:0 11px;color:#b4b8ad}.connection{display:flex;align-items:center;gap:7px}.connection>span:first-child{width:5px;height:5px;border-radius:50%;background:#7c9673}.hero{min-height:327px;display:grid;grid-template-columns:1.3fr 1fr;align-items:center;padding-top:21px}.eyebrow{font-size:8px;font-weight:600;letter-spacing:1.65px;display:flex;gap:9px;align-items:center;color:#87917e}.eyebrow>span{width:5px;height:5px;background:var(--gold);border-radius:50%}h1{font:500 46px/1.13 'Lora',Georgia,serif;letter-spacing:-1.8px;margin:20px 0 16px}h1 em{font-weight:400;color:#72816c}.hero p{font-size:12px;line-height:1.8;color:#8b9187}.hero-link{padding:12px 0;border:0;background:none;font-size:11px;color:var(--green);border-bottom:1px solid #a7b3a2}.hero-link span{margin-left:22px}.hero-art{height:275px;position:relative;max-width:375px;width:100%;justify-self:center;align-self:end}.arch{position:absolute;left:57px;bottom:37px;width:247px;height:234px;border-radius:150px 150px 9px 9px;background:#eaeadd}.hero-book{position:absolute;box-shadow:3px 8px 12px #29332120;border-left:7px solid #ffffff26;border-radius:3px 7px 7px 3px}.back{background:#a6b7a3;left:73px;top:33px;width:127px;height:174px;transform:rotate(-15deg);padding:26px 16px;font:23px/1.15 'Lora',serif;color:#345a4e}.back i{font-size:45px;display:block;margin:7px 17px;color:#eff0d9}.front{background:#d8b775;left:177px;top:56px;width:135px;height:177px;transform:rotate(12deg);padding:18px 12px;text-align:center;color:#4b5842}.front small{font:6px var(--font);letter-spacing:1px}.front>span{font:21px/1.1 'Lora',serif;display:block;margin-top:12px}.front i{font-size:48px;line-height:1.2;color:#f9ebbe;display:block}.front b{font:6px var(--font);letter-spacing:1.5px}.shelf{position:absolute;width:270px;height:5px;background:#cec8af;left:54px;bottom:36px;border-radius:9px;box-shadow:0 8px 18px #464d3330}.spark{position:absolute;color:#ab9b61}.s1{font-size:35px;right:25px;top:5px}.s2{font-size:19px;left:33px;top:118px}.s3{font-size:17px;right:13px;bottom:59px}.art-caption{position:absolute;bottom:4px;width:100%;text-align:center;font:italic 11px 'Lora',serif;color:#92917d;transform:rotate(-3deg)}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin:30px 0 41px}.stats>button{background:var(--white);border:1px solid var(--line);border-radius:8px;display:flex;align-items:center;padding:18px 20px;text-align:left;gap:13px}.stat-icon{height:41px;width:41px;border-radius:50%;display:grid;place-items:center;font-size:22px}.green{background:#e9eee3;color:#658168}.gold{background:#f5eddb;color:#aa8a46}.pink{background:#f3e8df;color:#b58670}.stats b{display:block;font:26px 'Lora',serif;line-height:1}.stats small{display:block;font-size:9px;color:#96998c;margin-top:8px}.stats i{font:13px var(--font);margin-left:auto;color:#a6ab9b}.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:23px}.muted{font-size:7px;letter-spacing:1.5px;color:#a0a590}h2{font:500 26px 'Lora',Georgia,serif;letter-spacing:-.6px;margin:9px 0 0}h2>span{display:inline-block;vertical-align:middle;font:10px var(--font);color:#8d9684;background:#e9ecdf;border-radius:5px;padding:4px 7px;margin-left:9px}.view-switch{display:flex;border:1px solid var(--line);border-radius:6px;padding:3px;gap:2px}.view-switch button{border:0;background:transparent;width:30px;height:27px;font-size:16px;color:#8e9785;border-radius:4px}.view-switch .selected{color:var(--green);background:#e6eadd}.filters{display:flex;gap:10px}.search{flex:1;min-width:160px;display:flex;align-items:center;gap:10px;background:var(--white);border:1px solid #e1e4d9;border-radius:6px;padding:0 12px}.search>span{font-size:24px;line-height:1;color:#8b977f}.search input{background:none;border:0;min-width:0;width:100%;height:41px;font-size:11px;color:var(--ink);outline:none}.search input::placeholder{color:#a0a593}kbd{border:1px solid #e8eade;color:#a2aa96;padding:1px 5px;border-radius:3px;font-size:10px}select{border:1px solid #e1e4d9;background:var(--white);border-radius:6px;color:#7d8873;font-size:10px;padding:0 10px;max-width:190px}.chips{display:flex;gap:7px;flex-wrap:wrap;margin:17px 0 21px}.chips button{border:1px solid #e4e7da;background:transparent;border-radius:20px;padding:8px 12px;font-size:9px;color:#8b9680}.chips .active{color:#f8faf3;background:#58715b;border-color:#58715b}.view-note:empty{display:none}.view-note{font-size:11px;line-height:1.8;color:#818a75;padding:12px 14px;background:#edeee5;border-radius:6px;margin-bottom:20px}.view-note a{color:var(--green)}.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px 17px}.card{background:var(--white);border:1px solid var(--line);border-radius:8px;overflow:hidden;min-width:0;transition:transform .2s,box-shadow .2s}.card:hover{transform:translateY(-3px);box-shadow:0 8px 18px #3c4b3110}.cover-button{width:100%;border:0;border-bottom:1px solid #eceee3;background:var(--cover-bg,#eeede4);display:flex;align-items:center;justify-content:center;height:185px;position:relative;padding:18px}.cover-button img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(3px 5px 3px #364b3b20);mix-blend-mode:multiply}.cover-placeholder{display:grid;align-content:center;gap:12px;background:var(--green);color:#f7eed7;border-left:8px solid #ffffff20;width:110px;height:145px;padding:12px;font:16px/1.2 'Lora',serif;border-radius:3px 7px 7px 3px}.cover-placeholder span{font-size:32px}.age-badge{position:absolute;top:11px;left:11px;border-radius:4px;font-size:8px;background:#fffefaee;color:#7b8971;padding:5px 6px}.owned-badge{position:absolute;right:10px;top:10px;background:#f7faf2;color:#62815a;border-radius:50%;width:22px;height:22px;display:grid;place-items:center;font-size:12px}.card-body{padding:13px 13px 11px}.card-category{font-size:7px;color:#a1a88f;text-transform:uppercase;letter-spacing:1px;margin-bottom:7px}.title-button{font:600 12px/1.5 var(--font);text-align:left;border:0;padding:0;background:none;display:block;min-height:36px;width:100%}.card-bottom{margin-top:12px;border-top:1px solid #edf0e5;padding-top:10px;display:flex;align-items:center;justify-content:space-between;gap:3px}.status-btn{background:none;border:0;border-radius:4px;padding:4px 0;font-size:9px;color:#9aa28e}.status-btn.owned{color:#63805d}.status-btn.wish{color:#ad806b}.wish-btn{border:0;background:none;font-size:19px;color:#a4ad99;padding:0 4px}.wish-btn.selected{color:#b58875}.empty{grid-column:1/-1;text-align:center;padding:55px 15px;background:#f0f0e7;border:1px dashed #d6ddcb;border-radius:8px}.empty>span{font-size:36px;color:#94a188}.empty h3{font:24px 'Lora',serif;margin:16px 0 10px}.empty p{font-size:12px;color:#8a9380;line-height:1.9}.empty button,.primary{background:var(--green);color:white;border:0;padding:12px 19px;border-radius:6px;font-size:12px;text-decoration:none;display:inline-block}.empty a{display:inline-block;margin-top:10px}.more{display:block;margin:28px auto;border:1px solid #dce1d1;border-radius:6px;background:none;padding:12px 25px;font-size:11px;color:#738268}.more[hidden]{display:none}.cards.list{grid-template-columns:1fr}.list .card{display:flex;align-items:stretch}.list .cover-button{width:100px;height:110px;flex:none;border-right:1px solid var(--line);border-bottom:0;padding:10px}.list .age-badge{left:4px;top:4px}.list .owned-badge{display:none}.list .card-body{flex:1;display:grid;grid-template-columns:1fr 240px;align-items:center}.list .card-category{grid-column:1;align-self:end}.list .title-button{grid-column:1;align-self:start}.list .card-bottom{grid-column:2;grid-row:1/3;margin:0 10px;border-top:0;font-size:12px}.list .cover-placeholder{height:90px;font-size:9px}.list .cover-placeholder span{display:none}footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);margin-top:42px;padding:23px 0 27px;font-size:9px;color:#99a18d;gap:15px}footer b{font-weight:500}footer button{border:0;background:none;font-size:9px;color:#8b9780}dialog{border:1px solid #dce1d1;border-radius:15px;background:var(--white);color:var(--ink);padding:35px;max-width:620px;width:calc(100% - 28px);max-height:88vh;overflow-y:auto;box-shadow:0 25px 70px #213e3629}dialog::backdrop{background:#1c382e66;backdrop-filter:blur(3px)}.close{position:absolute;right:13px;top:10px;background:none;border:0;color:#8b9780;font-size:27px}.detail-top{display:flex;gap:27px;align-items:center;margin:12px 0 25px}.detail-cover{width:150px;height:190px;object-fit:contain;background:#f1f0e7;padding:9px;border-radius:6px}.detail-top h2{font-size:27px;line-height:1.3}.detail-top small{font-size:10px;color:#939c87}.detail-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:15px}.detail-meta span{background:#eaf0e1;padding:6px 9px;font-size:10px;border-radius:4px}.detail-actions{display:flex;gap:9px;margin:18px 0}.secondary{background:none;color:var(--green);border:1px solid #cfd9c4;padding:11px 16px;border-radius:6px;font-size:12px}.detail-note{font-size:11px;line-height:1.8;color:#88937a}dialog label{font-size:11px;display:block;margin-top:20px}textarea{display:block;width:100%;border:1px solid #dce3d2;border-radius:6px;background:#fcfcf8;color:var(--ink);padding:10px;resize:vertical;min-height:75px;margin-top:8px}dialog p,dialog li{font-size:12px;line-height:1.9;color:#7d8973}dialog ul{padding-left:18px}dialog h3{font-family:'Lora',serif;font-size:18px;margin-top:28px}.settings-actions{display:flex;gap:10px;flex-wrap:wrap}#toast{position:fixed;left:50%;bottom:25px;transform:translate(-50%,20px);padding:12px 20px;border-radius:8px;color:white;background:var(--green);opacity:0;pointer-events:none;transition:.25s;font-size:12px;z-index:10;max-width:90vw;text-align:center}#toast.visible{opacity:1;transform:translate(-50%,0)}
@media(min-width:1450px){main{padding:0 65px}.cards{grid-template-columns:repeat(5,minmax(0,1fr))}.hero{min-height:350px}.hero-art{margin-right:50px}.cover-button{height:207px}}
@media(max-width:1120px){.shell{grid-template-columns:215px 1fr}.sidebar{padding:28px 15px}.brand{font-size:21px}.nav-item{font-size:11px;padding:13px 10px;gap:8px}main{padding:0 28px}.filters{flex-wrap:wrap}.search{flex-basis:100%}select{height:36px;flex:1;max-width:none}.cards{grid-template-columns:repeat(3,minmax(0,1fr))}.hero h1{font-size:39px}.hero-art{transform:scale(.85);transform-origin:right center;margin-left:-25px}.stats>button{padding:15px 12px;gap:10px}.stats small{font-size:8px}.stats i{display:none}.stat-icon{width:33px;height:33px}.hero p{font-size:11px}.hero .eyebrow{font-size:6px}}
@media(max-width:760px){.shell{display:block}.sidebar{position:static;height:auto;padding:21px 20px 0;border-right:0;border-bottom:1px solid var(--line)}.brand{font-size:20px;align-items:center}.brand-icon{font-size:39px;height:40px}.brand small{font-size:6px;margin-top:8px}.sidebar-bottom,.sidebar-foot,.nav-label{display:none}.sidebar nav{display:flex;gap:3px;overflow-x:auto;margin-top:20px}.nav-item{display:flex;gap:6px;flex-shrink:0;font-size:10px;padding:12px 10px;border-radius:6px 6px 0 0;width:auto}.nav-item>span{font-size:17px;width:17px}.nav-item>b{font-size:8px;padding:2px 4px}.nav-item.active{box-shadow:none}main{padding:0 20px}header{height:50px;font-size:8px}.hero{min-height:275px;grid-template-columns:1.2fr 1fr;position:relative;padding-top:10px}.hero h1{font-size:33px;letter-spacing:-1.1px;margin:16px 0 12px}.hero .eyebrow{font-size:6px;letter-spacing:1px;max-width:210px;line-height:1.6}.hero p{font-size:10px;max-width:210px}.hero p br{display:none}.hero-link{font-size:9px}.hero-link span{margin-left:8px}.hero-art{width:230px;transform:scale(.66);transform-origin:100% 65%;margin-left:-85px;margin-right:0;height:250px;align-self:center}.hero-art .s1{right:-90px}.hero-art .s3{right:-80px}.art-caption{width:340px}.stats{gap:8px;margin:14px 0 30px}.stats>button{padding:13px 9px;gap:6px;display:block}.stat-icon{height:28px;width:28px;font-size:17px;float:left;margin-right:7px}.stats b{font-size:23px}.stats small{font-size:8px;clear:both;margin-top:12px;line-height:1.5}.section-heading{margin-bottom:18px}h2{font-size:24px}.muted{font-size:6px}.filters{gap:7px}.search input{font-size:11px}select{font-size:9px;padding:0 5px}.chips{flex-wrap:nowrap;overflow-x:auto;margin:14px 0 19px;padding-bottom:5px}.chips button{flex-shrink:0;font-size:9px}.cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.cover-button{height:190px;padding:20px 16px}.card-body{padding:12px}.title-button{font-size:11px}.card-category{font-size:6px}.card-bottom{gap:1px}.status-btn{font-size:9px}.list .card-body{display:block}.list .card-bottom{margin:0;border:0;padding-top:4px}.list .card-category{margin-bottom:0}.list .title-button{min-height:25px}.list .cover-button{width:85px}.detail-top{gap:15px}.detail-cover{width:105px;height:145px}.detail-top h2{font-size:23px}dialog{padding:28px 20px}.detail-actions{flex-wrap:wrap}footer{font-size:7px;flex-wrap:wrap;gap:10px}footer button{font-size:9px}#toast{bottom:20px}}
.connection{border:0;background:none;font-size:10px;color:#7d8c73;padding:8px 0}.family-panel{padding-bottom:25px;border-bottom:1px solid var(--line);margin-bottom:25px}.family-panel h2{margin-top:15px}.family-input{display:block;width:100%;padding:12px;border:1px solid #d6dfca;border-radius:6px;background:#f7f9f1;color:var(--ink);font-size:12px;margin:8px 0 15px}.primary:disabled{opacity:.6;cursor:wait}
.missing-filter{display:flex;align-items:center;gap:8px;font-size:11px;color:#65775b;margin:-3px 0 17px}.missing-filter[hidden]{display:none}.missing-filter input{accent-color:var(--green);width:15px;height:15px}
@media(max-width:760px){.hero{display:block;overflow:hidden;min-height:265px;padding-top:23px}.hero-copy{position:relative;z-index:1;max-width:240px}.hero-art{position:absolute;right:-6px;top:20px;width:340px;height:275px;transform:scale(.48);transform-origin:right center;margin:0;opacity:.85}.hero-art .s1{right:25px}.hero-art .s3{right:13px}.hero .eyebrow{font-size:7px;max-width:220px}.hero p{font-size:12px;max-width:210px}.hero-link{font-size:11px}.nav-item{font-size:11px}.chips button{font-size:10px}.search input{font-size:12px}select{font-size:10px}.title-button{font-size:12px}.status-btn{font-size:10px}.card-category{font-size:8px}.stats small{font-size:9px}.art-caption{width:340px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
