:root{--ink:#263e34;--green:#31533f;--muted:#778072;--paper:#faf9f4;--line:#e4e6dc}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:14px Arial,sans-serif}button,input,select{font:inherit}button,a,input,select{outline-offset:4px}button{cursor:pointer;border:0}a{color:inherit;text-decoration:none}.demo-bar{background:#e6ebdf;padding:9px 5%;display:flex;gap:18px;align-items:center;font-size:9px;letter-spacing:1px}.demo-bar span{letter-spacing:0;color:#6b7867}.demo-bar button{margin-left:auto;background:transparent;color:var(--ink);font-size:10px}header{display:flex;align-items:center;gap:36px;padding:26px 5%;border-bottom:1px solid var(--line)}.brand{font-weight:700;font-size:27px;letter-spacing:-1px;white-space:nowrap}.logo{display:inline-block;background:var(--green);color:#fff4d8;padding:4px 9px;border-radius:6px;margin-right:7px}.dot{color:#b28758}nav{display:flex;align-items:center;gap:24px;margin:auto}nav button,nav a{background:transparent;color:#778071;font-size:12px;white-space:nowrap}nav button.active{color:var(--green);font-weight:700}nav span{background:#e9eddf;padding:3px 6px;border-radius:12px;font-size:9px}.account{display:flex;gap:17px;align-items:center}#wallet{background:transparent;font-size:12px;white-space:nowrap}.primary{display:inline-flex;gap:25px;align-items:center;justify-content:center;padding:14px 22px;border-radius:6px;background:var(--green);color:white;font-size:12px}.primary:hover{background:#1f3d2c}.outline{padding:13px 22px;border-radius:6px;border:1px solid #b8c1ac;background:transparent;color:var(--ink);font-size:12px}main{max-width:1440px;padding:0 5%;margin:auto}.hero{display:grid;grid-template-columns:1.2fr 1fr;gap:30px;align-items:center;padding:56px 0 47px}.eyebrow{font-size:9px;letter-spacing:1.8px;font-weight:700;color:#8b9078}h1,h2,h3{font-family:Georgia,serif;font-weight:400}h1{font-size:clamp(36px,3.6vw,55px);line-height:1.12;letter-spacing:-2px;margin:22px 0}.hero p{line-height:1.8;color:var(--muted);font-size:13px}.hero-actions{display:flex;gap:12px;margin-top:27px}.hero-note{color:#8b9079;font-size:10px;margin-top:24px}.hero-art{height:330px;position:relative;display:flex;align-items:center;justify-content:center;background:#ecefe2;border-radius:50% 45% 44% 41%}.orbit{position:absolute;inset:25px;border:1px dashed #c8d0b9;border-radius:50%;transform:rotate(-15deg)}.hero-cover{width:145px;height:227px;padding:22px 15px;text-align:center;box-shadow:8px 15px 20px #233a3525,inset 6px 0 #0002;display:flex;flex-direction:column;justify-content:space-between}.hero-cover small{font-size:9px;letter-spacing:2px}.hero-cover strong{font-family:Georgia;font-weight:400;font-size:24px;line-height:1.1}.hero-cover>span{font-size:45px}.first{background:#223e3d;color:#efe5ae;transform:rotate(-13deg);margin-right:-12px;margin-top:-20px}.second{background:#c99160;color:#fff1d0;transform:rotate(12deg);margin-top:24px}.exchange-badge{background:#fffdf5;box-shadow:0 5px 14px #263e3410;border-radius:8px;padding:13px 20px;position:absolute;bottom:12px;left:30px;display:flex;align-items:center;gap:15px;font-size:26px;transform:rotate(-4deg)}.exchange-badge span{font-size:10px;line-height:1.5}.credit-sticker{position:absolute;right:6px;top:6px;background:#d6dda8;width:81px;height:81px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:12px;transform:rotate(10deg)}.credit-sticker strong{font-family:Georgia;font-size:17px;margin-top:5px}.how{display:grid;grid-template-columns:repeat(3,1fr);gap:35px;padding:25px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:40px}.how>div{position:relative;padding-left:42px}.how>div>span{position:absolute;left:0;top:3px;background:#edf0e2;border:1px solid #d8dfc9;border-radius:50%;padding:9px 8px;font-size:10px;color:#81926d}.how h3{font-size:18px;margin:3px 0 9px}.how p{font-size:10px;color:var(--muted);line-height:1.6;margin:0}.section-title{display:flex;align-items:center;justify-content:space-between}.section-title h2{font-size:32px;letter-spacing:-.7px;margin:10px 0 20px}.section-title>span{color:#939883;font-size:10px}.search-row{display:flex;gap:12px;margin:3px 0 20px}.search{display:flex;align-items:center;gap:12px;flex:1;background:white;border:1px solid var(--line);padding:13px 16px;border-radius:6px}.search span{font-size:23px;line-height:1}.search input{border:0;background:transparent;width:100%;min-width:0;font-size:12px;color:var(--ink)}.select-label{display:flex;align-items:center;gap:8px;font-size:10px;color:var(--muted);border:1px solid var(--line);border-radius:6px;padding:10px;background:white}select{border:0;color:var(--ink);background:white;font-size:11px;max-width:170px}.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:25px}.filters button{border:1px solid var(--line);border-radius:20px;padding:9px 18px;background:transparent;color:var(--muted);font-size:11px}.filters button.selected{color:#fff;background:var(--green);border-color:var(--green)}.books{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}.book{border:1px solid var(--line);background:#fffdf8;border-radius:9px;overflow:hidden}.cover-area{background:#f0f0e6;padding:20px;position:relative;display:flex;justify-content:center}.cover{width:137px;height:184px;display:flex;flex-direction:column;justify-content:space-between;text-align:center;padding:15px 13px;box-shadow:5px 7px 10px #263e3422,inset 5px 0 #0002;border-radius:2px}.cover small{font-size:8px;letter-spacing:1.4px}.cover strong{font:24px/1.05 Georgia}.cover span{font-size:34px}.save{position:absolute;right:11px;top:11px;border-radius:50%;background:#fffdf7;width:29px;height:29px;color:var(--green);font-size:19px}.book-info{padding:17px}.book h3{font-family:Arial;font-size:13px;font-weight:600;margin:0 0 7px;line-height:1.4}.author{color:var(--muted);font-size:11px}.condition{display:inline-block;background:#edf1e5;color:#71805b;font-size:9px;border-radius:4px;padding:5px 7px;margin:15px 0 9px}.location{font-size:10px;color:#7d8676;margin-bottom:7px}.delivery{font-size:9px;color:#909581;min-height:13px}.book-bottom{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);margin-top:14px;padding-top:12px}.book-bottom strong{font-size:11px}.book-bottom button{background:transparent;color:var(--green);font-size:11px}.pass-on{background:#e9eddc;border:1px solid #dde3cf;padding:30px 35px;border-radius:9px;margin:37px 0;display:flex;align-items:center;justify-content:space-between}.pass-on h2{font-size:29px;margin:12px 0}.pass-on p{color:var(--muted);font-size:12px}footer{border-top:1px solid var(--line);display:flex;align-items:center;gap:30px;padding:25px 0;color:#929885;font-size:10px}footer .brand{font-size:20px;color:var(--green)}footer span:last-child{margin-left:auto}dialog{background:var(--paper);border:1px solid var(--line);border-radius:13px;width:min(490px,92vw);padding:32px;color:var(--ink);max-height:90vh}dialog::backdrop{background:#20372b99}.close{position:absolute;right:14px;top:10px;font-size:25px;color:#7c8773;background:transparent}dialog h2{font-size:28px;line-height:1.2;margin:14px 0}dialog p{color:var(--muted);font-size:12px;line-height:1.7}dialog label{display:block;font-size:11px;margin-top:17px}dialog input,dialog select,dialog textarea{display:block;width:100%;max-width:none;padding:11px;margin-top:7px;border:1px solid #ccd4bf;background:#fff;border-radius:5px;font:12px Arial;color:var(--ink)}dialog textarea{min-height:70px}dialog .primary{width:100%;margin-top:22px}dialog .summary{background:#edf0e3;padding:15px;font-size:12px;line-height:2;border-radius:6px}.empty{grid-column:1/-1;padding:45px;border:1px dashed #bcc6ae;border-radius:9px;color:var(--muted);text-align:center}.exchange-row{border:1px solid var(--line);border-radius:8px;background:#fff;padding:23px;margin-bottom:12px;display:flex;justify-content:space-between;align-items:center;gap:15px}.exchange-row h3{font:600 14px Arial;margin:0 0 9px}.exchange-row p{font-size:11px;color:var(--muted);line-height:1.6}.exchange-row button{font-size:10px}.exchange-row .status{font-size:10px;padding:8px;background:#eaf0e0;border-radius:5px}#toast{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:var(--green);color:white;padding:14px 23px;border-radius:7px;opacity:0;pointer-events:none;z-index:10;font-size:12px;transition:.2s}.helper{font-size:10px!important}.primary:disabled{background:#909887;cursor:default}[hidden]{display:none!important}@media(max-width:1100px){header{gap:18px}nav{gap:13px}.brand{font-size:23px}.account{gap:5px}.account .primary{padding:12px}.books{gap:15px}.hero-art{height:305px}h1{font-size:43px}}@media(max-width:850px){header{flex-wrap:wrap;justify-content:space-between}nav{order:3;width:100%;margin:5px 0 0;justify-content:space-between}.hero{gap:20px}.hero-art{height:260px}.hero-cover{width:112px;height:182px;padding:15px 10px}.hero-cover strong{font-size:20px}.credit-sticker{width:65px;height:65px;font-size:10px;right:-5px}.credit-sticker strong{font-size:14px}.exchange-badge{left:0;bottom:0;padding:10px}.hero-copy h1{font-size:36px;letter-spacing:-1px}.books{grid-template-columns:repeat(3,1fr)}.how{gap:17px}.how h3{font-size:16px}.search-row{flex-wrap:wrap}.search{flex-basis:100%}.select-label{flex:1;justify-content:space-between}.pass-on{padding:25px}}@media(max-width:600px){.demo-bar{font-size:8px;gap:10px}.demo-bar span{max-width:190px;font-size:8px}header{padding:20px 5%}.brand{font-size:22px}#wallet{font-size:10px}.account .primary{font-size:10px;padding:10px}nav button,nav a{font-size:10px}.hero{grid-template-columns:1fr;padding-top:30px;gap:25px}.hero-copy h1{font-size:40px}.hero p{font-size:12px}.hero-art{height:240px;width:100%;max-width:380px;margin:auto}.hero-cover{width:125px;height:190px}.hero-cover strong{font-size:21px}.how{grid-template-columns:1fr;gap:23px}.how h3{font-size:18px}.books{grid-template-columns:repeat(2,1fr);gap:13px}.cover-area{padding:16px 10px}.cover{width:115px;height:165px}.cover strong{font-size:21px}.book-info{padding:13px}.book h3{font-size:11px}.author{font-size:10px}.section-title h2{font-size:29px}.section-title>span{font-size:9px}.select-label{font-size:9px;padding:9px;gap:3px}select{font-size:10px;max-width:125px}.filters{gap:5px}.filters button{font-size:10px;padding:8px 12px}.pass-on{display:block}.pass-on .primary{margin-top:10px}.pass-on h2{font-size:25px}footer{flex-wrap:wrap;gap:13px}footer span:last-child{margin-left:0;width:100%}.exchange-row{flex-wrap:wrap;padding:18px}.hero-note{font-size:9px}.hero-actions .primary,.hero-actions .outline{font-size:11px;padding:13px 17px}}

/* User-supplied BookBuddy logo and brand colours. */
:root{--ink:#003e43;--green:#00494e;--muted:#657f7d;--line:#dce5df}.brand-image{display:block;width:156px;height:104px;object-fit:contain}.brand{flex-shrink:0}header{padding-top:9px;padding-bottom:9px}.footer-brand .brand-image{width:105px;height:70px}.demo-bar{background:#e4eeea}.hero-art{background:#e4eeea}.credit-sticker{background:#ffbf19;color:#003e43}.how>div>span{background:#fff0bf;border-color:#edce70;color:#00494e}.pass-on{background:#e4eeea;border-color:#d0dfd9}.filters button.selected{background:#00494e}.condition{background:#e5efeb;color:#00494e}.eyebrow{color:#738c84}@media(max-width:600px){.brand-image{width:120px;height:80px}header{padding-top:6px;padding-bottom:13px}.footer-brand .brand-image{width:90px;height:60px}}
