:root{--bg:#f5f5f3;--card:#fff;--ink:#080808;--muted:#777;--line:#e8e8e5;--dark:#0a0a0a;--soft:#efefec;--danger:#b42318;--ok:#16764a;--radius:22px;--shadow:0 16px 50px rgba(0,0,0,.08)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,system-ui,sans-serif;min-height:100vh}button,input,textarea,select{font:inherit}button{cursor:pointer}a{text-decoration:none;color:inherit}
.topbar{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 max(22px,calc((100vw - 1180px)/2));background:rgba(245,245,243,.88);backdrop-filter:blur(18px);position:sticky;top:0;z-index:30;border-bottom:1px solid rgba(0,0,0,.05)}
.brand{display:flex;gap:10px;align-items:center;font-size:21px;font-weight:800;letter-spacing:-.8px}.brand span span{color:#777}.brand-mark{width:36px;height:36px;background:#090909;color:white;border-radius:11px;display:grid;place-items:center;font-weight:800;box-shadow:0 8px 20px #0002}
.top-actions{display:flex;align-items:center;gap:10px}.icon-btn,.profile-btn{border:1px solid var(--line);background:white;height:42px;border-radius:14px;padding:0 12px}.profile-btn{display:flex;gap:8px;align-items:center;font-weight:700}.avatar{width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:#111;color:white;font-size:11px}
main{max-width:1180px;margin:auto;padding:26px 22px 100px}.page{display:none;animation:pageIn .35s ease}.page.active{display:block}@keyframes pageIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.hero{min-height:380px;background:#090909;color:#fff;border-radius:30px;padding:50px;display:flex;justify-content:space-between;align-items:flex-end;overflow:hidden;position:relative;box-shadow:var(--shadow)}.hero:after{content:"";position:absolute;width:500px;height:500px;border:1px solid #fff1;border-radius:50%;right:-180px;top:-200px;box-shadow:0 0 0 70px #fff0,0 0 0 140px #fff0}.hero h1{font-size:clamp(44px,7vw,82px);line-height:.93;letter-spacing:-5px;margin:14px 0 20px}.hero h1 em{font-style:normal;color:#bdbdbd}.hero p{max-width:530px;color:#b8b8b8;line-height:1.7}.hero-actions{display:flex;gap:10px;margin-top:25px}.hero-card{position:relative;z-index:2;min-width:180px;padding:24px;border:1px solid #fff2;border-radius:22px;background:#fff0;backdrop-filter:blur(12px)}.hero-card strong{font-size:42px;display:block}.hero-card span{color:#aaa;font-size:12px}.hero-stat{margin-top:22px;padding-top:18px;border-top:1px solid #fff2}.hero-stat b{font-size:23px;margin-right:8px}.live-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#64d894;box-shadow:0 0 0 6px #64d89422;margin-right:7px}
.primary,.secondary{border:0;border-radius:14px;padding:13px 19px;font-weight:800;transition:.2s}.primary{background:#fff;color:#000}.hero .primary{background:#fff}.secondary{background:#ffffff14;color:#fff;border:1px solid #ffffff22}.primary:hover,.secondary:hover{transform:translateY(-2px)}.small{padding:11px 15px}.text-btn,.link-btn{border:0;background:none;font-weight:700}.eyebrow{font-size:10px;font-weight:800;letter-spacing:1.7px;color:#888}.section-head,.page-title{display:flex;align-items:end;justify-content:space-between;margin:48px 0 20px}.section-head h2,.page-title h1{margin:5px 0 0;font-size:32px;letter-spacing:-1.5px}.page-title{align-items:center}.page-title h1{font-size:42px}
.listing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.listing-grid.wide{grid-template-columns:repeat(3,1fr)}.listing-card{background:var(--card);border:1px solid var(--line);border-radius:20px;overflow:hidden;transition:.25s;box-shadow:0 5px 20px #00000005}.listing-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}.listing-image{height:205px;background:#e7e7e3;position:relative;overflow:hidden}.listing-image img{width:100%;height:100%;object-fit:cover}.badge{position:absolute;top:12px;left:12px;background:#0a0a0acc;color:#fff;border-radius:10px;padding:7px 9px;font-size:10px;font-weight:800;backdrop-filter:blur(8px)}.featured{background:#fff;color:#000;left:auto;right:12px}.listing-body{padding:17px}.listing-body h3{font-size:16px;margin:0 0 8px;line-height:1.35}.listing-meta{display:flex;justify-content:space-between;color:#888;font-size:11px}.parking{font-weight:800;color:#111;font-size:15px}.listing-foot{margin-top:15px;padding-top:13px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}.seller{font-size:11px;color:#777}.chat-btn{border:0;background:#111;color:white;padding:8px 11px;border-radius:10px;font-size:11px;font-weight:700}
.filters{display:grid;grid-template-columns:1fr 180px 180px;gap:10px;margin-bottom:20px}.searchbox{display:flex;align-items:center;gap:8px;background:white;border:1px solid var(--line);border-radius:14px;padding:0 14px}.searchbox input{border:0;outline:0;width:100%;padding:13px 0;background:none}.filters select{border:1px solid var(--line);background:white;border-radius:14px;padding:0 12px;outline:0}
.form-card,.settings-card,.auth-card,.quota-card{background:white;border:1px solid var(--line);border-radius:24px;padding:25px;box-shadow:0 10px 35px #00000005}.form-card{max-width:760px;margin:auto}.form-card label{display:block;font-size:12px;font-weight:700;margin:18px 0}.form-card input,.form-card textarea,.form-card select,.auth-card input{display:block;width:100%;margin-top:8px;border:1px solid var(--line);border-radius:13px;padding:13px 14px;background:#fafaf9;outline:0}.form-card input:focus,.form-card textarea:focus,.auth-card input:focus{border-color:#999;box-shadow:0 0 0 4px #00000007}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:12px}.counter{float:right;color:#999;font-weight:500}.upload-area{border:1.5px dashed #ccc;border-radius:18px;min-height:150px;padding:24px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#666;text-align:center;cursor:pointer}.upload-icon{font-size:32px;color:#111}.preview-row{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.preview-row img{width:74px;height:74px;object-fit:cover;border-radius:10px}.check{display:flex!important;gap:9px;align-items:flex-start}.check input{width:auto!important;margin:1px 0!important}.submit{width:100%;background:#090909;color:#fff}.quota-card{max-width:760px;margin:0 auto 14px;display:grid;grid-template-columns:160px 1fr auto;gap:18px;align-items:center}.quota-card strong{display:block;font-size:24px;margin-top:5px}.quota-label{font-size:9px;letter-spacing:1px;color:#888;font-weight:800}.quota-track{height:8px;border-radius:10px;background:#eee;overflow:hidden}.quota-track i{display:block;height:100%;background:#111;border-radius:10px;width:100%}.reward-btn{border:1px solid #ddd;background:#f7f7f5;border-radius:12px;padding:11px 13px;font-size:11px;font-weight:800}.reward-btn:hover{background:#eee}
.chat-layout{display:grid;grid-template-columns:310px 1fr;min-height:530px;background:white;border:1px solid var(--line);border-radius:22px;overflow:hidden}.conversation-list{border-right:1px solid var(--line);overflow:auto}.conversation{padding:16px;border-bottom:1px solid var(--line);cursor:pointer}.conversation.active{background:#f3f3f0}.conversation b{font-size:13px}.conversation p{font-size:11px;color:#888;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-panel{display:flex;flex-direction:column;min-width:0}.chat-head{padding:17px;border-bottom:1px solid var(--line);font-weight:800}.chat-messages{padding:18px;display:flex;flex-direction:column;gap:9px;flex:1;overflow:auto;background:#fafaf8}.bubble{max-width:72%;padding:10px 13px;border-radius:14px;background:#fff;border:1px solid var(--line);font-size:12px}.bubble.mine{align-self:flex-end;background:#111;color:#fff;border-color:#111}.chat-compose{display:flex;gap:8px;padding:12px;border-top:1px solid var(--line)}.chat-compose input{flex:1;border:1px solid var(--line);border-radius:12px;padding:12px}.chat-compose button{border:0;background:#111;color:#fff;border-radius:12px;padding:0 16px}
.profile-cover{background:#0a0a0a;color:white;border-radius:26px;padding:35px;display:flex;align-items:center;gap:20px}.profile-avatar{width:75px;height:75px;border-radius:23px;background:white;color:#111;display:grid;place-items:center;font-size:30px;font-weight:800}.profile-cover h1{margin:5px 0;font-size:35px}.profile-cover p{margin:0;color:#aaa}.profile-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-top:15px}.settings-card h3{margin-top:0}.settings-card button{display:block;width:100%;text-align:left;border:0;border-bottom:1px solid var(--line);background:none;padding:14px 0;font-weight:700}.settings-card p{font-size:12px;color:#777;line-height:1.7}.settings-card .danger{color:var(--danger)}
.auth-page{min-height:calc(100vh - 120px);display:none;align-items:center;justify-content:center}.auth-page.active{display:flex}.auth-card{width:min(430px,100%);padding:35px}.auth-logo{width:52px;height:52px;background:#111;color:#fff;border-radius:16px;display:grid;place-items:center;font-size:22px;font-weight:800;margin-bottom:25px}.auth-card h1{font-size:39px;letter-spacing:-2px;margin:6px 0}.auth-card p{color:#777;font-size:13px;margin-bottom:25px}.auth-card label{display:block;font-size:11px;font-weight:700;margin:15px 0}.auth-card small{display:block;color:#999;text-align:center;margin-top:18px;line-height:1.6}.link-btn{display:block;margin:17px auto;color:#111}
.empty{text-align:center;padding:70px 20px;color:#777}.empty-icon{font-size:42px;color:#bbb}.empty h3{color:#222;margin-bottom:5px}.hidden{display:none!important}
.modal{display:none;position:fixed;inset:0;background:#0008;backdrop-filter:blur(7px);z-index:80;padding:20px;align-items:center;justify-content:center}.modal.open{display:flex}.modal-box{width:min(520px,100%);max-height:90vh;overflow:auto;background:white;border-radius:24px;padding:25px;position:relative;animation:pop .22s ease}@keyframes pop{from{opacity:0;transform:scale(.96)}to{opacity:1;transform:none}}.modal-close{position:absolute;right:15px;top:12px;border:0;background:#eee;border-radius:50%;width:32px;height:32px;font-size:20px}.detail-box img{width:100%;max-height:390px;object-fit:cover;border-radius:17px}.detail-box h2{font-size:27px;margin:16px 0 8px}.detail-actions{display:flex;gap:8px;margin-top:18px}.detail-actions button{flex:1}
.loader{position:fixed;inset:0;background:#fff;z-index:100;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:15px;font-size:12px;font-weight:700}.loader-ring{width:35px;height:35px;border:3px solid #ddd;border-top-color:#111;border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
.bottom-nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);z-index:40;width:min(650px,calc(100% - 24px));height:68px;background:#0a0a0af2;color:white;backdrop-filter:blur(20px);border-radius:21px 21px 0 0;display:flex;justify-content:space-around;align-items:center;box-shadow:0 -12px 40px #0002}.nav-item{background:none;border:0;color:#888;display:flex;flex-direction:column;align-items:center;gap:3px;font-size:20px}.nav-item small{font-size:9px}.nav-item.active{color:white}.create-nav span{background:white;color:#111;width:35px;height:35px;border-radius:11px;display:grid;place-items:center;font-size:24px}
#toast-root{position:fixed;top:85px;right:18px;z-index:120;display:flex;flex-direction:column;gap:8px}.toast{background:#111;color:white;padding:12px 15px;border-radius:13px;font-size:12px;box-shadow:var(--shadow);animation:toastIn .25s}.toast.bad{background:#8b1e16}@keyframes toastIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
@media(max-width:820px){.hero{padding:32px;min-height:450px;align-items:flex-start;flex-direction:column}.hero-card{margin-top:auto;align-self:flex-end}.listing-grid,.listing-grid.wide{grid-template-columns:repeat(2,1fr)}.filters{grid-template-columns:1fr 1fr}.filters .searchbox{grid-column:1/-1}.chat-layout{grid-template-columns:1fr}.conversation-list{max-height:190px;border-right:0;border-bottom:1px solid var(--line)}}
@media(max-width:560px){main{padding:15px 13px 95px}.topbar{height:66px;padding:0 14px}.hero{border-radius:22px;padding:27px 22px}.hero h1{font-size:49px;letter-spacing:-3px}.hero-card{align-self:stretch;display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center}.hero-card strong{font-size:27px}.hero-stat{border:0;padding:0;margin:0}.listing-grid,.listing-grid.wide{grid-template-columns:1fr}.listing-image{height:220px}.section-head,.page-title{margin:32px 0 16px}.page-title h1{font-size:33px}.two-col{grid-template-columns:1fr}.quota-card{grid-template-columns:1fr}.filters{grid-template-columns:1fr}.filters .searchbox{grid-column:auto}.bottom-nav{width:100%;border-radius:18px 18px 0 0}.profile-grid{grid-template-columns:1fr}.profile-cover{padding:25px}.auth-card{padding:26px}}
