*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f7f9f8;color:#17332f;font-family:Tahoma,"Segoe UI",Arial,sans-serif;line-height:1.7;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}img,video{max-width:100%;display:block}button,input,select,textarea{font:inherit}button{cursor:pointer}.container{width:min(1180px,calc(100% - 32px));margin:auto}.site-main{min-height:58vh}.topbar{background:#fff;border-bottom:1px solid #e6ecea;position:sticky;top:0;z-index:50;box-shadow:0 5px 24px rgba(15,58,52,.04)}.header-inner{height:82px;display:flex;align-items:center;gap:28px}.brand{display:flex;align-items:center;gap:11px;min-width:max-content}.brand img{width:46px;height:46px;object-fit:contain;border-radius:13px}.brand-mark{width:48px;height:48px;display:grid;place-items:center;border-radius:15px;background:linear-gradient(145deg,var(--primary,#075c58),#0c7a72);color:#fff;font-size:27px;font-weight:900;box-shadow:0 7px 18px rgba(7,92,88,.18)}.brand-mark.small{width:38px;height:38px;border-radius:11px;font-size:21px}.brand b{display:block;color:#123c37;font-size:18px}.brand small{display:block;color:#7b928e;font-size:11px;margin-top:-2px}.header-search{flex:1;max-width:480px;margin-inline:auto;position:relative}.header-search input{width:100%;background:#f3f7f6;border:1px solid transparent;border-radius:13px;padding:12px 16px 12px 44px;outline:0}.header-search input:focus{border-color:#b8d8d4;background:#fff}.header-search button{position:absolute;left:6px;top:5px;border:0;background:transparent;font-size:23px;color:var(--primary)}.account-nav{display:flex;align-items:center;gap:13px;font-size:14px}.icon-link{position:relative;font-size:20px}.icon-link i{position:absolute;top:-7px;right:-9px;background:#d84c4c;color:#fff;border-radius:20px;min-width:17px;height:17px;display:grid;place-items:center;font-size:9px;font-style:normal;border:2px solid #fff}.section-nav{border-top:1px solid #f0f3f2}.nav-scroll{height:47px;display:flex;align-items:center;gap:25px;overflow:auto;scrollbar-width:none;font-size:13px;white-space:nowrap}.nav-scroll::-webkit-scrollbar{display:none}.nav-scroll a{color:#506b67}.nav-scroll a:hover{color:var(--primary)}.btn{border:0;border-radius:11px;padding:10px 17px;display:inline-flex;align-items:center;justify-content:center;gap:7px;font-weight:700;transition:.2s}.btn.primary{background:var(--primary);color:#fff;box-shadow:0 5px 14px rgba(7,92,88,.16)}.btn.secondary{background:var(--secondary);color:#38270b}.btn.white{background:#fff;color:var(--primary)}.btn.subtle{background:#eef5f3;color:var(--primary)}.btn.danger{background:#fff0f0;color:#b52f2f}.btn.whatsapp{background:#25d366;color:#063b1a}.btn.large{padding:13px 22px;font-size:15px}.btn.tiny{padding:7px 10px;font-size:12px}.btn:hover{transform:translateY(-1px);filter:brightness(.98)}.eyebrow{display:block;color:var(--secondary);font-size:12px;font-weight:800;margin-bottom:7px}.eyebrow.light{color:#ffd99a}.hero{background:var(--primary);position:relative;overflow:hidden;color:#fff}.hero:before{content:"";position:absolute;width:560px;height:560px;border-radius:50%;background:rgba(255,255,255,.045);top:-320px;right:-130px}.hero:after{content:"";position:absolute;width:320px;height:320px;border-radius:50%;border:1px solid rgba(255,255,255,.08);bottom:-180px;left:5%}.hero-grid{min-height:490px;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:55px;position:relative;z-index:1}.hero-copy h1{font-size:51px;line-height:1.22;margin:8px 0 18px;letter-spacing:-1.5px}.hero-copy h1 em{font-style:normal;color:#ffd99a}.hero-copy>p{color:#d3e4e1;font-size:17px;max-width:610px;margin:0 0 26px}.hero-search{display:flex;background:#fff;padding:6px;border-radius:15px;max-width:620px;box-shadow:0 18px 45px rgba(0,0,0,.14)}.hero-search input{border:0;outline:0;flex:1;min-width:0;padding:9px 13px;background:transparent}.hero-actions{display:flex;align-items:center;gap:24px;margin-top:18px}.text-link{font-size:13px;color:#d4e9e6}.hero-visual{display:grid;place-items:center}.city-card{width:min(420px,100%);aspect-ratio:1.05;background:linear-gradient(180deg,#f7ddb0,#edbc74);border-radius:38px;position:relative;overflow:hidden;box-shadow:0 28px 70px rgba(0,0,0,.2);border:8px solid rgba(255,255,255,.12)}.sun{position:absolute;width:74px;height:74px;border-radius:50%;background:#fff2c9;left:55px;top:54px;box-shadow:0 0 50px #ffe8a6}.city-lines{position:absolute;bottom:0;right:0;left:0;height:68%;display:flex;align-items:flex-end;justify-content:center;gap:8px;padding:0 35px}.city-lines i{display:block;width:17%;background:#22645e;border-radius:5px 5px 0 0;box-shadow:inset 0 0 0 4px rgba(255,255,255,.08)}.city-lines i:nth-child(1){height:54%}.city-lines i:nth-child(2){height:73%}.city-lines i:nth-child(3){height:100%;width:14%;position:relative}.city-lines i:nth-child(3):before{content:"";position:absolute;top:-52px;left:39%;width:22%;height:54px;background:#22645e;border-radius:20px 20px 0 0}.city-lines i:nth-child(4){height:66%}.city-lines i:nth-child(5){height:46%}.floating-card{position:absolute;background:#fff;color:#244c47;border-radius:12px;padding:8px 11px;box-shadow:0 8px 28px rgba(28,67,62,.14);font-size:18px}.floating-card span{font-size:10px;font-weight:700}.f1{right:18px;top:32px}.f2{left:15px;bottom:50px}.f3{right:30px;bottom:107px}.banner-slot{margin-top:26px}.banner-slot a{display:block;border-radius:19px;overflow:hidden;max-height:210px;background:#e9f3f1;box-shadow:0 8px 30px rgba(17,72,64,.07)}.banner-slot img,.banner-slot video{width:100%;height:210px;object-fit:cover}.banner-slot strong{min-height:105px;display:grid;place-items:center;font-size:24px;color:var(--primary)}.quick-sections,.home-section{padding-top:58px}.section-title{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:22px}.section-title h1,.section-title h2{margin:0;color:#173f39;line-height:1.25}.section-title h2{font-size:26px}.section-title>a{font-size:13px;color:var(--primary);font-weight:700}.quick-grid{display:grid;grid-template-columns:repeat(9,1fr);gap:10px}.quick-grid a{background:#fff;border:1px solid #e6edeb;border-radius:18px;padding:18px 10px;text-align:center;transition:.2s;box-shadow:0 4px 18px rgba(20,62,57,.03)}.quick-grid a:hover{border-color:#b7d5d1;transform:translateY(-3px)}.quick-grid span{font-size:25px;display:block}.quick-grid b{font-size:12px;display:block;margin-top:5px}.quick-grid small{font-size:9px;color:#8aa09d;display:block}.cards-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:17px}.content-card{background:#fff;border:1px solid #e6edeb;border-radius:18px;overflow:hidden;box-shadow:0 7px 22px rgba(18,63,57,.045);transition:.2s}.content-card:hover{transform:translateY(-3px);box-shadow:0 14px 32px rgba(18,63,57,.08)}.card-media{display:block;aspect-ratio:1.55;background:#e6efed;position:relative;overflow:hidden}.card-media img{width:100%;height:100%;object-fit:cover;transition:.3s}.content-card:hover .card-media img{transform:scale(1.025)}.card-media.placeholder{display:grid;place-items:center;background:linear-gradient(145deg,#e7f1ef,#f6faf9);font-size:43px}.badge{display:inline-flex;align-items:center;padding:3px 8px;border-radius:20px;background:#ecf5f3;color:var(--primary);font-size:10px;font-weight:800}.badge.featured{position:absolute;top:10px;right:10px;background:#ffdf9f;color:#61400c}.card-body{padding:14px 15px 13px}.meta-line{display:flex;align-items:center;gap:10px;color:#879c98;font-size:10px}.meta-line time{margin-right:auto}.card-body h3{font-size:15px;line-height:1.55;margin:7px 0 5px;color:#193d38}.card-body p{font-size:11px;line-height:1.8;color:#6e8581;margin:0;min-height:39px}.price{color:var(--primary);font-weight:900;font-size:18px;min-height:39px}.price small{font-size:10px}.price del{color:#a7b4b2;font-size:11px;margin-right:8px}.card-foot{border-top:1px solid #f0f4f3;margin-top:11px;padding-top:10px;display:flex;justify-content:space-between;color:#829793;font-size:10px}.card-foot a{color:var(--primary);font-weight:700}.home-section:last-of-type{padding-bottom:65px}.empty{background:#fff;border:1px dashed #cddbd8;border-radius:18px;text-align:center;padding:36px 20px;color:#708681;grid-column:1/-1}.empty>span{font-size:28px;color:var(--secondary)}.empty h3{margin:6px 0 1px;color:#365c56;font-size:16px}.empty p{margin:0;font-size:11px}.page-hero{background:linear-gradient(120deg,var(--primary),#0a756e);color:#fff;padding:38px 0}.page-hero .container{display:flex;align-items:center;gap:18px}.page-hero h1{margin:0;font-size:33px}.page-hero p{margin:3px 0 0;color:#d3e4e1;font-size:12px}.page-hero .btn{margin-right:auto}.page-hero.compact{padding:26px 0}.page-icon{font-size:39px;width:75px;height:75px;border-radius:20px;background:rgba(255,255,255,.12);display:grid;place-items:center}.listing,.search-page{padding-top:32px;padding-bottom:65px}.filter-bar{background:#fff;border:1px solid #e4ecea;border-radius:14px;padding:10px 13px;display:flex;align-items:center;gap:10px;margin-bottom:20px}.filter-bar form{display:flex;gap:8px}.filter-bar>span{margin-right:auto;color:#8ca09d;font-size:11px}.filter-bar input,.filter-bar select{border:1px solid #dde8e5;background:#f9fbfa;border-radius:9px;padding:8px 10px;min-width:170px}.pagination{display:flex;justify-content:center;gap:7px;margin-top:28px}.pagination a{width:35px;height:35px;display:grid;place-items:center;border-radius:9px;background:#fff;border:1px solid #dce8e5}.pagination a.active{background:var(--primary);color:#fff}.search-page{padding-top:45px}.search-box{background:#fff;border:1px solid #dde9e6;padding:12px;border-radius:16px;display:grid;grid-template-columns:1fr 180px 160px auto;gap:9px}.search-box input,.search-box select{border:1px solid #dce7e5;border-radius:10px;padding:10px 12px;outline:0}.results-count{font-size:12px;color:#7d918d;margin:17px 3px}.detail-page{padding-top:28px;padding-bottom:60px}.breadcrumbs{display:flex;gap:8px;align-items:center;color:#859a96;font-size:11px;margin-bottom:15px}.breadcrumbs b{color:#4b6964;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.detail-card{background:#fff;border:1px solid #e4ebe9;border-radius:22px;overflow:hidden;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);box-shadow:0 10px 32px rgba(18,61,55,.055)}.detail-image{min-height:480px;background:#edf3f2}.detail-image img{width:100%;height:100%;object-fit:cover}.detail-content{padding:30px}.detail-content h1{font-size:30px;line-height:1.45;margin:12px 0 14px;color:#153d37}.detail-price{font-size:31px;color:var(--primary);font-weight:900;margin-bottom:12px}.detail-price small{font-size:13px}.detail-price del{font-size:14px;color:#a3afad;margin-right:10px}.prose{color:#496762;line-height:2;font-size:14px}.prose.large{font-size:16px;min-height:260px}.detail-video{border-radius:14px;margin-top:18px;width:100%}.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:15px}.gallery img{aspect-ratio:1;object-fit:cover;border-radius:10px}.facts{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:18px}.facts div{background:#f4f8f7;border-radius:11px;padding:10px 12px}.facts small,.owner-chip small{display:block;font-size:9px;color:#869a96}.facts b{font-size:12px}.owner-chip{display:flex;align-items:center;gap:10px;margin:18px 0;padding:12px 0;border-top:1px solid #edf1f0;border-bottom:1px solid #edf1f0}.avatar{width:37px;height:37px;border-radius:50%;background:#d8ebe7;color:var(--primary);display:grid;place-items:center;font-weight:900}.avatar.large{width:58px;height:58px;font-size:21px}.owner-chip b{font-size:12px}.share-row{display:flex;flex-wrap:wrap;gap:9px;align-items:center;font-size:11px;color:#728883}.share-row a,.share-row button{border:0;background:#f0f6f4;color:var(--primary);border-radius:8px;padding:5px 8px}.contact-actions,.owner-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}.owner-actions{border-top:1px solid #edf1f0;padding-top:14px}.inline-form{display:inline}.link-button{border:0;background:none;color:var(--primary);font-weight:700;padding:4px 0}.booking-panel{margin-top:22px;display:grid;grid-template-columns:.7fr 1.3fr;gap:34px}.report-link{text-align:center;margin-top:18px;font-size:11px;color:#8b9c99}.panel{background:#fff;border:1px solid #e3ece9;border-radius:18px;padding:21px;box-shadow:0 7px 22px rgba(18,60,55,.035)}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}.panel-head h1,.panel-head h2,.panel-head h3{margin:0}.form-panel{max-width:900px;margin:auto}.form-panel .panel-head{padding-bottom:14px;border-bottom:1px solid #eaf0ee}.section-icon.big{font-size:34px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.stack-form{display:grid;gap:14px}.span-2{grid-column:1/-1}label{display:grid;gap:6px;font-size:11px;font-weight:700;color:#52716c}input,select,textarea{width:100%;border:1px solid #d9e6e3;background:#fbfdfc;color:#173f39;border-radius:10px;padding:10px 11px;outline:0}input:focus,select:focus,textarea:focus{border-color:#77aaa4;box-shadow:0 0 0 3px rgba(7,92,88,.06)}textarea{resize:vertical}.upload-zone{background:#f5f9f8;border:1px dashed #cbdeda;border-radius:13px;padding:10px}.upload-zone small{color:#8ca09c;font-size:9px}.publish-note{display:flex;gap:12px;align-items:center;background:#ecf8f3;border:1px solid #cce9dd;color:#367362;border-radius:12px;padding:10px 13px;font-size:11px}.publish-note b{color:#18714d;white-space:nowrap}.auth-wrap{max-width:1000px;margin:45px auto 70px;width:calc(100% - 32px);display:grid;grid-template-columns:1fr 1fr;background:var(--primary);border-radius:28px;overflow:hidden;box-shadow:0 20px 55px rgba(12,58,52,.14)}.auth-copy{padding:55px 47px;color:#fff;align-self:center}.auth-copy h1{font-size:37px;line-height:1.45;margin:7px 0 17px}.auth-copy p{color:#cfe2df;font-size:14px}.auth-card{background:#fff;margin:10px;border-radius:21px;padding:42px}.auth-card h2{margin:0 0 24px}.auth-card>p,.auth-card>small{font-size:11px;color:#829591}.auth-card a{color:var(--primary);font-weight:700}.dashboard-shell,.admin-shell{display:grid;grid-template-columns:220px minmax(0,1fr);gap:23px;padding-top:30px;padding-bottom:65px}.member-side,.admin-side{background:#fff;border:1px solid #e4ecea;border-radius:17px;padding:13px;height:max-content;position:sticky;top:154px}.member-side h3{padding:4px 8px;margin:2px 0 9px}.member-side>a,.admin-side>a,.admin-side form button{display:flex;align-items:center;gap:9px;width:100%;border:0;background:transparent;padding:10px 11px;border-radius:9px;color:#59736f;font-size:12px;text-align:right}.member-side>a.active,.admin-side>a.active{background:#eaf5f3;color:var(--primary);font-weight:800}.member-side>a:hover,.admin-side>a:hover{background:#f3f7f6}.side-user{text-align:center;border-bottom:1px solid #edf2f0;padding:10px 5px 16px;margin-bottom:8px}.side-user .avatar{margin:0 auto 7px}.side-user b,.side-user small{display:block}.side-user small{font-size:9px;color:#8da19d}.side-logout{width:100%;border:0;background:transparent;padding:10px 11px;text-align:right;color:#b85151}.dashboard-main,.admin-main{min-width:0}.dash-welcome{background:#fff;border:1px solid #e3ebe9;border-radius:18px;padding:22px 24px;display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:17px}.dash-welcome h1{margin:0;font-size:23px}.dash-welcome p{font-size:11px;color:#80938f;margin:5px 0 0}.stats-grid,.admin-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:11px;margin-bottom:17px}.stats-grid a,.admin-stats a{background:#fff;border:1px solid #e3ebe9;border-radius:15px;padding:14px 15px;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;gap:0 10px}.stats-grid span,.admin-stats span{grid-row:1/3;width:39px;height:39px;display:grid;place-items:center;background:#eff6f4;border-radius:11px}.stats-grid small,.admin-stats small{color:#79908c;font-size:10px}.stats-grid b,.admin-stats b{font-size:20px;color:#19423c}.responsive-table{overflow:auto;width:100%}table{border-collapse:collapse;width:100%;font-size:11px;min-width:680px}th{text-align:right;background:#f3f7f6;color:#52706b;font-size:10px;padding:10px;border-bottom:1px solid #e1ebe8}td{padding:11px 10px;border-bottom:1px solid #edf2f0;color:#476761;vertical-align:middle}td a{color:var(--primary);font-weight:700}.block{display:block;color:#92a19e}.status{display:inline-block;padding:3px 8px;border-radius:20px;background:#f0f4f3;font-size:9px}.status.active{background:#e3f7ec;color:#197049}.status.hidden,.status.disabled{background:#fff0e9;color:#a75b2e}.admin-side{background:#123d38;color:#fff;border:0;padding:14px;top:154px}.admin-side>a,.admin-side form button{color:#cadbd8}.admin-side>a.active{background:rgba(255,255,255,.11);color:#fff}.admin-side>a:hover{background:rgba(255,255,255,.07)}.admin-side-head{display:flex;align-items:center;gap:10px;padding:6px 5px 14px;border-bottom:1px solid rgba(255,255,255,.1);margin-bottom:8px}.admin-side-head b,.admin-side-head small{display:block}.admin-side-head b{font-size:12px}.admin-side-head small{font-size:9px;color:#9ebbb6}.admin-welcome{border-right:4px solid var(--secondary)}.admin-stats{grid-template-columns:repeat(4,1fr)}.admin-stats a{transition:.2s}.admin-stats a:hover{border-color:#afd0cb;transform:translateY(-2px)}.admin-page-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:16px}.admin-page-head h1{margin:0;font-size:24px}.action-row,.row-actions{display:flex;gap:7px;align-items:center}.row-actions form{margin:0}.row-actions button{border:0;background:transparent;color:var(--primary);font:inherit;font-weight:700}.row-actions .text-danger{color:#b84646}.table-panel{padding:0;overflow:hidden}.bulk-bar{display:flex;gap:8px;padding:12px;border-bottom:1px solid #e8efed}.bulk-bar select{width:auto}.activity-list>div{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;padding:10px 4px;border-bottom:1px solid #eef3f1}.activity-list>div>span{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:#eaf6f1;color:#227b59}.activity-list p{margin:0}.activity-list b,.activity-list small{display:block}.activity-list b{font-size:11px}.activity-list small,.activity-list time{font-size:9px;color:#91a19e}.compact-form{grid-template-columns:repeat(3,1fr)}.check{display:flex;grid-auto-flow:column;grid-template-columns:auto 1fr;align-items:center;justify-content:start}.check input{width:auto}.permissions-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:3px;min-width:300px;padding:8px}.permissions-grid label{display:flex;font-size:9px;font-weight:400}.permissions-grid input{width:auto}.user-perm-form select{margin-bottom:5px}.notifications-list{display:grid;gap:9px}.notification{display:flex;gap:12px;padding:15px;background:#fff;border:1px solid #e4ecea;border-radius:14px}.notification.unread{border-right:4px solid var(--secondary);background:#fffdf8}.notification>span{font-size:20px}.notification h3{margin:0;font-size:13px}.notification p{margin:3px 0;color:#6e8581;font-size:11px}.notification time{font-size:9px;color:#95a5a2}.messages-grid,.pages-editor{display:grid;gap:11px}.message-card p{font-size:12px;color:#56736e}.message-card form{border-top:1px solid #edf2f0;margin-top:13px;padding-top:13px}.pages-editor details>summary{font-weight:800;cursor:pointer}.pages-editor details[open]>summary{margin-bottom:17px}.package-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.package-grid h3{margin:8px 0}.package-grid ul{padding-right:18px;color:#69827e;font-size:11px}.profile-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;padding-top:40px;padding-bottom:65px}.narrow-page{max-width:920px;padding-top:40px;padding-bottom:65px}.static-page{max-width:900px;padding-top:40px;padding-bottom:65px}.requirements{display:flex;flex-wrap:wrap;gap:7px;margin:17px 0}.requirements span{background:#edf7f4;border-radius:20px;padding:5px 10px;font-size:10px}.installer{min-height:100vh;background:linear-gradient(145deg,#eaf4f2,#f9fbfa);display:grid;place-items:center;padding:30px}.install-card{background:#fff;border:1px solid #dce8e5;border-radius:25px;width:min(760px,100%);padding:35px;box-shadow:0 22px 70px rgba(13,64,56,.1)}.install-card>.brand-mark{margin-bottom:12px}.install-card h1{margin:0}.muted{color:#7f938f}.alert{border-radius:11px;padding:10px 13px;margin:14px auto;font-size:12px}.alert.success{background:#e7f7ee;color:#1f714e}.alert.warning{background:#fff8e8;color:#846020}.alert.danger{background:#fff0f0;color:#a63d3d}.success-panel{background:#eff9f5;border-radius:15px;padding:22px}.footer{background:#102f2c;color:#d2e0de;margin-top:30px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px;padding-top:40px;padding-bottom:35px}.footer h3,.footer h4{color:#fff;margin-top:0}.footer p{color:#93aaa6;font-size:11px;max-width:460px}.footer a{display:block;color:#aac0bc;font-size:11px;margin:7px 0}.copyright{text-align:center;border-top:1px solid rgba(255,255,255,.08);padding:14px;color:#748f8a;font-size:10px}.mobile-nav{display:none}
@media(max-width:1050px){.quick-grid{grid-template-columns:repeat(5,1fr)}.cards-grid{grid-template-columns:repeat(3,1fr)}.hero-grid{gap:25px}.hero-copy h1{font-size:43px}.dashboard-shell,.admin-shell{grid-template-columns:185px 1fr}.admin-stats{grid-template-columns:repeat(3,1fr)}}
@media(max-width:800px){body{padding-bottom:68px}.topbar{position:relative}.header-inner{height:69px}.header-search{display:none}.account-nav .btn,.account-nav>a:first-child:not(.icon-link){display:none}.section-nav{display:none}.brand b{font-size:16px}.brand small{font-size:9px}.brand-mark{width:41px;height:41px;font-size:23px}.hero-grid{grid-template-columns:1fr;min-height:auto;padding-top:45px;padding-bottom:34px}.hero-copy h1{font-size:37px}.hero-copy>p{font-size:14px}.hero-visual{display:none}.hero-search{max-width:none}.quick-sections,.home-section{padding-top:40px}.quick-grid{grid-template-columns:repeat(3,1fr)}.cards-grid{grid-template-columns:repeat(2,1fr)}.page-hero .container{align-items:flex-start}.page-hero .btn{display:none}.search-box{grid-template-columns:1fr 1fr}.search-box input{grid-column:1/-1}.detail-card{grid-template-columns:1fr}.detail-image{min-height:0;aspect-ratio:1.35}.booking-panel{grid-template-columns:1fr}.dashboard-shell,.admin-shell{grid-template-columns:1fr;padding-top:18px}.member-side,.admin-side{position:static;display:flex;overflow:auto;white-space:nowrap;border-radius:12px;gap:3px}.member-side h3,.side-user,.member-side form,.admin-side-head,.admin-side form{display:none}.member-side>a,.admin-side>a{width:auto;flex:0 0 auto}.stats-grid,.admin-stats{grid-template-columns:repeat(2,1fr)}.compact-form{grid-template-columns:1fr 1fr}.auth-wrap{grid-template-columns:1fr;margin-top:20px}.auth-copy{padding:33px}.auth-copy h1{font-size:28px}.auth-card{padding:28px}.profile-grid{grid-template-columns:1fr}.mobile-nav{position:fixed;z-index:60;bottom:0;left:0;right:0;height:64px;background:#fff;border-top:1px solid #dce8e5;display:flex;justify-content:space-around;align-items:center;padding-bottom:env(safe-area-inset-bottom);box-shadow:0 -6px 22px rgba(15,57,51,.08)}.mobile-nav a{font-size:9px;color:#617b76;text-align:center;min-width:55px}.mobile-nav span{display:block;font-size:18px;line-height:1.1;color:var(--primary)}.mobile-nav .mobile-add{transform:translateY(-12px);width:52px;height:52px;border-radius:18px;background:var(--primary);color:#fff;display:grid;place-items:center;box-shadow:0 8px 20px rgba(7,92,88,.25)}.mobile-nav .mobile-add span{color:#fff;font-size:23px}.footer{margin-bottom:-68px;padding-bottom:68px}}
@media(max-width:540px){.container{width:min(100% - 20px,1180px)}.hero-grid{padding-top:36px}.hero-copy h1{font-size:32px}.hero-search{display:grid;grid-template-columns:1fr}.hero-search .btn{width:100%}.hero-actions{gap:15px;flex-wrap:wrap}.quick-grid{gap:7px}.quick-grid a{padding:13px 5px;border-radius:13px}.quick-grid span{font-size:21px}.quick-grid b{font-size:10px}.cards-grid{grid-template-columns:1fr 1fr;gap:9px}.card-media{aspect-ratio:1.28}.card-body{padding:11px}.card-body h3{font-size:13px}.card-body p{font-size:10px}.page-hero h1{font-size:27px}.page-icon{width:58px;height:58px;font-size:29px}.filter-bar{align-items:stretch;flex-direction:column}.filter-bar form{display:grid;grid-template-columns:1fr}.filter-bar select{width:100%}.search-box{grid-template-columns:1fr}.search-box input{grid-column:auto}.detail-content{padding:19px}.detail-content h1{font-size:24px}.facts{grid-template-columns:1fr}.form-grid,.compact-form{grid-template-columns:1fr}.span-2{grid-column:auto}.publish-note{align-items:flex-start;flex-direction:column;gap:2px}.dash-welcome{align-items:flex-start;flex-direction:column}.dash-welcome .btn{width:100%}.stats-grid,.admin-stats{grid-template-columns:1fr 1fr;gap:8px}.stats-grid a,.admin-stats a{padding:10px}.admin-page-head{align-items:flex-start;flex-direction:column}.action-row{width:100%;overflow:auto}.package-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr;gap:15px}.auth-copy{padding:27px 24px}.auth-card{padding:24px;margin:7px}.install-card{padding:22px}.installer{padding:10px}.booking-panel{padding:16px}.permissions-grid{min-width:240px}.gallery{grid-template-columns:repeat(3,1fr)}}
@media print{body{background:#fff;color:#000;padding:0}.topbar,.footer,.mobile-nav,.admin-side,.member-side,.btn,.action-row,.filter-bar,.bulk-bar,.row-actions,form button{display:none!important}.container,.admin-shell,.dashboard-shell{width:100%;max-width:none;display:block;padding:0;margin:0}.admin-main,.dashboard-main{width:100%}.panel{border:0;box-shadow:none;padding:0}.responsive-table{overflow:visible}table{min-width:0;font-size:9pt}th,td{padding:6px;border:1px solid #bbb}.admin-page-head:after{content:"تاريخ الطباعة: " attr(data-date);display:block;font-size:9pt}.site-main{min-height:0}}

/* واجهة تريم الاحترافية — الإصدار 9 */
:root {
  --ink: #123a35;
  --muted: #708985;
  --line: #dfe9e7;
  --surface: #ffffff;
  --surface-soft: #f1f7f5;
  --shadow-sm: 0 8px 28px rgba(14, 62, 55, 0.07);
  --shadow-lg: 0 24px 70px rgba(10, 55, 49, 0.14);
}

body {
  background:
    radial-gradient(circle at 8% 8%, rgba(234, 166, 58, 0.08), transparent 24rem),
    linear-gradient(180deg, #f8fbfa 0, #f4f8f7 100%);
  color: var(--ink);
  font-size: 15px;
}

.container {
  width: min(1200px, calc(100% - 40px));
}

.site-main {
  min-height: 66vh;
  overflow: hidden;
}

.topbar {
  background: rgba(255, 255, 255, 0.97);
  border: 0;
  box-shadow: 0 8px 34px rgba(18, 58, 53, 0.08);
  backdrop-filter: blur(14px);
}

.header-inner {
  min-height: 88px;
  height: auto;
  padding: 13px 0;
  display: grid;
  grid-template-columns: auto minmax(300px, 1fr) auto;
  align-items: center;
  gap: 30px;
}

.brand {
  min-width: 214px;
}

.brand-mark {
  width: 52px;
  height: 52px;
  border-radius: 17px 7px 17px 17px;
  background: linear-gradient(145deg, var(--primary), #0b8077);
  box-shadow: 0 12px 28px rgba(7, 92, 88, 0.24);
}

.brand b {
  font-size: 19px;
  letter-spacing: -0.3px;
}

.brand small {
  color: #7a918d;
  font-size: 10px;
}

.header-search {
  width: 100%;
  max-width: 620px;
  margin: auto;
  display: grid;
  grid-template-columns: 1fr 44px;
  align-items: center;
  overflow: hidden;
  border: 1px solid #dce8e5;
  border-radius: 16px;
  background: #f6f9f8;
  transition: 0.2s ease;
}

.header-search:focus-within {
  background: #fff;
  border-color: #9ec9c3;
  box-shadow: 0 0 0 4px rgba(7, 92, 88, 0.06);
}

.header-search input {
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 12px 16px;
  box-shadow: none;
}

.header-search button {
  position: static;
  width: 44px;
  height: 42px;
  border: 0;
  border-radius: 12px;
  background: var(--primary);
  color: #fff;
  font-size: 21px;
}

.account-nav {
  justify-self: end;
  direction: rtl;
  gap: 9px;
  white-space: nowrap;
}

.account-nav .login-btn {
  color: var(--primary);
  background: #fff;
  border: 1px solid #b9d4d0;
}

.account-nav .register-btn {
  box-shadow: 0 10px 24px rgba(7, 92, 88, 0.2);
}

.section-nav {
  display: block;
  border-top: 1px solid #edf2f1;
  background: #fbfdfc;
}

.nav-scroll {
  height: 50px;
  gap: 8px;
  font-size: 12px;
}

.nav-scroll a {
  padding: 7px 11px;
  border-radius: 10px;
  font-weight: 700;
  color: #506e69;
  transition: 0.2s ease;
}

.nav-scroll a:hover {
  background: #eaf4f2;
  color: var(--primary);
}

.chat-room-nav {
  border-top: 1px solid #e4eeeb;
  background: linear-gradient(90deg, #edf7f5, #f8fbfa);
}

.chat-room-scroll {
  height: 49px;
  display: flex;
  align-items: center;
  gap: 7px;
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
  scrollbar-width: thin;
  scrollbar-color: #a9c9c4 transparent;
}

.chat-room-scroll::-webkit-scrollbar,
.room-switcher::-webkit-scrollbar {
  height: 4px;
}

.chat-room-scroll::-webkit-scrollbar-thumb,
.room-switcher::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background: #a9c9c4;
}

.chat-room-scroll a {
  flex: 0 0 auto;
  padding: 6px 11px;
  border: 1px solid #d9e9e6;
  border-radius: 20px;
  background: #fff;
  color: #436963;
  font-size: 11px;
  font-weight: 700;
  transition: 0.2s ease;
}

.chat-room-scroll a:hover {
  border-color: #93c2bb;
  color: var(--primary);
  transform: translateY(-1px);
}

.chat-room-scroll .chat-room-title {
  position: sticky;
  right: 0;
  z-index: 2;
  border-color: var(--primary);
  background: var(--primary);
  color: #fff;
  box-shadow: 9px 0 18px rgba(237, 247, 245, 0.95);
}

.btn {
  min-height: 42px;
  border-radius: 13px;
  padding: 9px 18px;
}

.btn.primary {
  background: linear-gradient(135deg, var(--primary), #08756d);
  box-shadow: 0 9px 23px rgba(7, 92, 88, 0.2);
}

.btn.secondary {
  background: linear-gradient(135deg, var(--secondary), #f4c461);
  color: #3d2b0e;
}

.hero {
  color: #fff;
  background:
    radial-gradient(circle at 18% 30%, rgba(255, 220, 160, 0.2), transparent 23rem),
    linear-gradient(120deg, #064e4b 0%, var(--primary) 48%, #0a746c 100%);
}

.hero::before {
  width: 680px;
  height: 680px;
  top: -450px;
  right: 18%;
}

.hero-grid {
  min-height: 550px;
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.92fr);
  gap: 72px;
  padding: 54px 0;
}

.hero-copy h1 {
  max-width: 680px;
  margin: 8px 0 20px;
  font-size: clamp(43px, 5vw, 68px);
  line-height: 1.17;
  letter-spacing: -2px;
}

.hero-copy > p {
  max-width: 650px;
  margin-bottom: 30px;
  color: #d9ece9;
  font-size: 17px;
  line-height: 2;
}

.hero-search {
  max-width: 680px;
  padding: 7px;
  border-radius: 19px;
  box-shadow: 0 22px 60px rgba(0, 0, 0, 0.19);
}

.hero-search input {
  min-height: 48px;
  padding: 10px 17px;
}

.hero-actions {
  margin-top: 21px;
}

.hero-actions .white {
  min-width: 145px;
}

.city-card {
  width: min(430px, 100%);
  border: 9px solid rgba(255, 255, 255, 0.13);
  border-radius: 46px 18px 46px 46px;
  background: linear-gradient(155deg, #fff1cd, #e6af5e);
  box-shadow: 0 32px 80px rgba(0, 0, 0, 0.25);
  transform: rotate(-1.5deg);
}

.floating-card {
  border: 1px solid rgba(7, 92, 88, 0.08);
  border-radius: 14px;
  padding: 10px 13px;
  font-size: 19px;
  box-shadow: 0 14px 32px rgba(25, 62, 57, 0.16);
}

.floating-card span {
  font-size: 11px;
}

.banner-slot {
  margin-top: 34px;
}

.banner-slot a {
  border: 1px solid var(--line);
  border-radius: 24px;
  box-shadow: var(--shadow-sm);
}

.quick-sections,
.home-section {
  padding-top: 72px;
}

.section-title {
  margin-bottom: 25px;
}

.section-title h1,
.section-title h2 {
  letter-spacing: -0.5px;
}

.section-title h2 {
  font-size: 30px;
}

.section-title > a {
  padding: 8px 12px;
  border-radius: 10px;
  background: #eaf4f2;
}

.quick-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.quick-grid a {
  min-height: 92px;
  padding: 16px 18px;
  display: grid;
  grid-template-columns: 54px 1fr;
  grid-template-rows: auto auto;
  align-items: center;
  column-gap: 14px;
  text-align: right;
  border: 1px solid var(--line);
  border-radius: 20px;
  box-shadow: var(--shadow-sm);
}

.quick-grid a:hover {
  border-color: #9fc7c1;
  box-shadow: 0 16px 40px rgba(18, 63, 57, 0.12);
}

.quick-grid span {
  grid-row: 1 / 3;
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  background: linear-gradient(145deg, #eaf5f2, #f8fbfa);
  font-size: 26px;
}

.quick-grid b {
  align-self: end;
  margin: 0;
  font-size: 14px;
}

.quick-grid small {
  align-self: start;
  font-size: 10px;
}

.home-section {
  position: relative;
}

.home-section::before {
  content: "";
  position: absolute;
  inset: 38px -50vw -22px;
  z-index: -1;
  background: rgba(255, 255, 255, 0.42);
  border-top: 1px solid rgba(223, 233, 231, 0.65);
}

.home-section:nth-of-type(even)::before {
  background: rgba(235, 244, 242, 0.45);
}

.cards-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
}

.content-card {
  border: 1px solid var(--line);
  border-radius: 22px;
  box-shadow: var(--shadow-sm);
}

.content-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 20px 48px rgba(18, 63, 57, 0.13);
}

.interaction-bar,
.chat-interactions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.interaction-bar {
  margin-top: 11px;
  padding-top: 11px;
  border-top: 1px solid #edf2f1;
}

.interaction-bar form,
.chat-interactions form {
  margin: 0;
}

.like-button,
.report-button {
  width: auto;
  min-height: 31px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  border-radius: 9px;
  padding: 5px 9px;
  font-size: 10px;
  font-weight: 800;
  line-height: 1;
}

.like-button {
  border: 1px solid #d99a13;
  background: #f4b62e;
  color: #4d3400;
  box-shadow: 0 3px 10px rgba(218, 161, 38, 0.11);
}

.like-button span {
  color: #9b6300;
  font-size: 14px;
}

.like-button b {
  min-width: 20px;
  height: 20px;
  display: inline-grid;
  place-items: center;
  border-radius: 20px;
  background: #fff;
  color: #7a4d00;
  font-size: 9px;
}

.like-button:disabled {
  cursor: not-allowed;
  opacity: 0.58;
}

.report-button {
  border: 1px solid #efd9d6;
  background: #fff7f6;
  color: #a45d58;
}

.detail-content > .interaction-bar {
  margin: 16px 0 12px;
}

.card-media {
  aspect-ratio: 1.55;
}

.card-media.placeholder {
  background:
    radial-gradient(circle at 30% 30%, rgba(234, 166, 58, 0.16), transparent 8rem),
    linear-gradient(145deg, #e6f2ef, #f8fbfa);
  font-size: 48px;
}

.card-body {
  padding: 17px 18px 16px;
}

.meta-line {
  font-size: 10px;
}

.card-body h3 {
  min-height: 50px;
  margin: 8px 0 6px;
  font-size: 16px;
}

.card-body p {
  min-height: 45px;
  font-size: 12px;
}

.card-foot {
  margin-top: 14px;
  padding-top: 12px;
  font-size: 11px;
}

.empty {
  padding: 48px 24px;
  border-radius: 22px;
  box-shadow: 0 8px 28px rgba(14, 62, 55, 0.04);
}

.page-hero {
  padding: 48px 0;
  background:
    radial-gradient(circle at 20% 10%, rgba(255, 255, 255, 0.13), transparent 19rem),
    linear-gradient(120deg, #064d49, var(--primary), #0b7971);
}

.page-icon {
  width: 82px;
  height: 82px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 24px 10px 24px 24px;
}

.panel,
.detail-card,
.filter-bar,
.search-box,
.auth-card,
.dash-welcome,
.stats-grid a,
.admin-stats a,
.notification {
  border-color: var(--line);
  box-shadow: var(--shadow-sm);
}

.panel {
  padding: 26px;
  border-radius: 22px;
}

/* صورة صفحة التفاصيل: حجم متوازن مستقل عن طول نص الخبر أو المشاركة. */
.detail-card {
  align-items: start;
}

.detail-image {
  width: min(calc(100% - 48px), 500px);
  min-height: 0;
  max-height: 500px;
  aspect-ratio: 1 / 1;
  align-self: start;
  justify-self: center;
  margin: 24px auto;
  overflow: hidden;
  border: 1px solid #e1ebe8;
  border-radius: 20px;
  background: #f2f6f5;
  box-shadow: 0 8px 24px rgba(18, 63, 57, 0.07);
}

.detail-image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

.form-panel {
  max-width: 980px;
}

.form-panel .panel-head {
  margin-bottom: 24px;
  padding-bottom: 20px;
}

.form-grid {
  gap: 18px;
}

label {
  gap: 8px;
  color: #466b65;
  font-size: 12px;
}

input,
select,
textarea {
  min-height: 48px;
  padding: 11px 14px;
  border-color: #d6e4e1;
  border-radius: 13px;
  background: #fbfdfc;
}

textarea {
  min-height: 130px;
}

.upload-zone {
  padding: 15px;
  border-radius: 15px;
}

.auth-wrap {
  max-width: 1080px;
  margin-top: 54px;
  border-radius: 34px 14px 34px 34px;
  background:
    radial-gradient(circle at 20% 20%, rgba(255, 216, 150, 0.19), transparent 18rem),
    linear-gradient(135deg, #064e4b, var(--primary));
  box-shadow: var(--shadow-lg);
}

.auth-copy {
  padding: 64px 54px;
}

.auth-card {
  margin: 12px;
  padding: 48px;
  border-radius: 25px 10px 25px 25px;
}

.dashboard-shell,
.admin-shell {
  grid-template-columns: 240px minmax(0, 1fr);
  gap: 26px;
  padding-top: 36px;
}

.member-side,
.admin-side {
  top: 164px;
  border-radius: 21px;
  box-shadow: var(--shadow-sm);
}

.dash-welcome {
  padding: 27px 29px;
  border-radius: 22px;
}

.stats-grid,
.admin-stats {
  gap: 14px;
}

.stats-grid a,
.admin-stats a {
  padding: 17px;
  border-radius: 18px;
}

.add-types {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 15px;
}

.add-type-card {
  width: 100%;
  min-height: 150px;
  padding: 24px 18px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 5px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: #fff;
  color: inherit;
  font: inherit;
  text-decoration: none;
  box-shadow: var(--shadow-sm);
  transition: 0.2s ease;
}

.add-type-card:hover,
.add-type-card:focus-visible {
  transform: translateY(-5px);
  border-color: #9fc7c1;
  box-shadow: 0 18px 45px rgba(18, 63, 57, 0.13);
  outline: none;
}

.add-type-card span {
  font-size: 35px;
}

.add-type-card b {
  font-size: 16px;
}

.add-type-card small {
  color: var(--muted);
  font-size: 10px;
}

.post-media-box {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px dashed #cbdeda;
  border-radius: 15px;
  background: #f8fbfa;
}

.post-media-toggle {
  width: 100%;
}

.post-media-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.post-media-fields[hidden] {
  display: none;
}

.section-manager {
  margin-bottom: 20px;
  border-right: 4px solid var(--primary);
}

.main-section-editor,
.main-section-list {
  margin-bottom: 20px;
}

.main-section-editor {
  border-right: 4px solid var(--secondary);
  background: linear-gradient(100deg, #fffdf8, #fff);
}

.main-section-editor .panel-head p,
.main-section-list .panel-head p {
  margin: 5px 0 0;
  color: var(--muted);
  font-size: 11px;
}

.main-section-name {
  min-width: 145px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
}

.main-section-name i {
  width: 35px;
  height: 35px;
  display: grid;
  place-items: center;
  flex: 0 0 auto;
  border-radius: 10px;
  background: #eaf5f2;
  font-size: 18px;
  font-style: normal;
}

.main-section-name b {
  color: #234a45;
  font-size: 12px;
}

.section-manager .panel-head p {
  margin: 5px 0 0;
  color: var(--muted);
  font-size: 12px;
}

.section-controls {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 11px;
  margin-bottom: 18px;
}

.section-option {
  min-height: 76px;
  padding: 12px;
  display: grid;
  grid-template-columns: auto auto 1fr;
  grid-template-rows: auto auto;
  align-items: center;
  gap: 0 9px;
  border: 1px solid var(--line);
  border-radius: 15px;
  background: #f8fbfa;
  cursor: pointer;
}

.section-option input {
  grid-row: 1 / 3;
  width: 19px;
  min-height: 19px;
  accent-color: var(--primary);
}

.section-option > span {
  grid-row: 1 / 3;
  font-size: 25px;
}

.section-option b {
  align-self: end;
  font-size: 13px;
}

.section-option small {
  align-self: start;
  color: var(--muted);
  font-size: 10px;
}

.section-option:has(input:checked) {
  border-color: #9fc9c3;
  background: #edf7f5;
}

.chat-page {
  padding-top: 45px;
  padding-bottom: 75px;
}

.chat-page-head {
  min-height: 180px;
  margin-bottom: 24px;
  padding: 31px 35px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  border-radius: 27px;
  color: #fff;
  background:
    radial-gradient(circle at 12% 28%, rgba(255, 224, 167, 0.2), transparent 18rem),
    linear-gradient(120deg, #064e4b, var(--primary), #0a766f);
  box-shadow: 0 20px 55px rgba(7, 72, 67, 0.16);
}

.chat-page-head h1 {
  margin: 0 0 8px;
  font-size: 34px;
}

.chat-page-head p {
  max-width: 690px;
  margin: 0;
  color: #d9ece9;
  font-size: 14px;
}

.chat-head-icon {
  width: 90px;
  height: 90px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 28px 11px 28px 28px;
  background: rgba(255, 255, 255, 0.12);
  font-size: 43px;
}

.chat-rooms-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.chat-room-card {
  min-height: 105px;
  padding: 18px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 13px;
  border: 1px solid var(--line);
  border-radius: 19px;
  background: #fff;
  box-shadow: var(--shadow-sm);
  transition: 0.2s ease;
}

.chat-room-card:hover {
  border-color: #9cc9c2;
  transform: translateY(-3px);
  box-shadow: 0 16px 38px rgba(18, 63, 57, 0.12);
}

.chat-room-card > span {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 15px;
  background: #eaf6f3;
  font-size: 23px;
}

.chat-room-card h2 {
  margin: 0 0 3px;
  font-size: 16px;
}

.chat-room-card small {
  display: block;
  color: var(--muted);
  font-size: 9px;
}

.chat-room-card > b {
  color: var(--primary);
  font-size: 10px;
}

.chat-room-page {
  min-height: 75vh;
  padding: 34px 0 70px;
  background:
    radial-gradient(circle at 8% 12%, rgba(234, 166, 58, 0.08), transparent 20rem),
    #eef5f3;
}

.chat-room-shell {
  max-width: 940px;
}

.chat-room-heading {
  padding: 22px 25px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
  border-radius: 22px 22px 0 0;
  color: #fff;
  background: linear-gradient(125deg, #064d49, var(--primary), #0a766e);
}

.chat-room-heading a {
  color: #cce4e0;
  font-size: 10px;
}

.chat-room-heading h1 {
  margin: 3px 0;
  font-size: 26px;
}

.chat-room-heading p {
  margin: 0;
  color: #cfe3e0;
  font-size: 11px;
}

.chat-room-heading > span {
  padding: 6px 11px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 20px;
  background: rgba(255, 255, 255, 0.1);
  font-size: 9px;
}

.room-switcher {
  padding: 10px 12px;
  display: flex;
  gap: 6px;
  overflow-x: auto;
  border-right: 1px solid var(--line);
  border-left: 1px solid var(--line);
  background: #f8fbfa;
  white-space: nowrap;
  scrollbar-width: thin;
}

.room-switcher a {
  flex: 0 0 auto;
  padding: 5px 10px;
  border-radius: 18px;
  color: #57736f;
  background: #fff;
  font-size: 10px;
}

.room-switcher a.active {
  color: #fff;
  background: var(--primary);
}

.chat-messages {
  min-height: 440px;
  padding: 22px;
  display: flex;
  flex-direction: column;
  gap: 13px;
  border-right: 1px solid var(--line);
  border-left: 1px solid var(--line);
  background:
    linear-gradient(rgba(255, 255, 255, 0.82), rgba(255, 255, 255, 0.82)),
    radial-gradient(circle, #c9ddd9 1px, transparent 1px);
  background-size: auto, 18px 18px;
}

.chat-message {
  max-width: 84%;
  display: flex;
  align-items: flex-start;
  gap: 9px;
}

.chat-avatar {
  width: 37px;
  height: 37px;
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  border-radius: 12px;
  background: linear-gradient(145deg, var(--primary), #0a7d74);
  color: #fff;
  font-weight: 900;
}

.chat-bubble {
  min-width: 220px;
  padding: 12px 14px 8px;
  border: 1px solid #dce9e6;
  border-radius: 5px 17px 17px 17px;
  background: #fff;
  box-shadow: 0 7px 19px rgba(20, 63, 57, 0.06);
}

.chat-bubble header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
}

.chat-bubble header b {
  color: var(--primary);
  font-size: 11px;
}

.chat-bubble time {
  color: #8da19d;
  font-size: 8px;
}

.chat-bubble p {
  margin: 7px 0 9px;
  color: #264b46;
  font-size: 13px;
  line-height: 1.9;
  overflow-wrap: anywhere;
}

.chat-bubble footer {
  padding-top: 6px;
  border-top: 1px solid #edf2f1;
  text-align: right;
}

.chat-bubble footer form {
  margin: 0;
}

.chat-bubble footer button,
.chat-bubble footer a {
  width: auto;
  border: 0;
  background: transparent;
  color: #a76a65;
  font-size: 9px;
}

.chat-bubble footer .like-button,
.chat-bubble footer .report-button {
  min-height: 29px;
  padding: 5px 8px;
  font-size: 9px;
}

.chat-bubble footer .like-button {
  border: 1px solid #d99a13;
  background: #f4b62e;
  color: #4d3400;
}

.chat-bubble footer .report-button {
  border: 1px solid #efd9d6;
  background: #fff7f6;
  color: #a45d58;
}

.chat-empty {
  margin: auto;
  padding: 45px 20px;
  text-align: center;
  color: var(--muted);
}

.chat-empty > span {
  font-size: 40px;
}

.chat-empty h2 {
  margin: 8px 0 2px;
  color: var(--ink);
  font-size: 18px;
}

.chat-empty p {
  margin: 0;
  font-size: 11px;
}

.chat-composer {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 0 0 22px 22px;
  background: #fff;
  box-shadow: 0 18px 45px rgba(18, 63, 57, 0.1);
}

.chat-composer form > label {
  font-size: 11px;
}

.chat-composer textarea {
  min-height: 86px;
  border-radius: 15px;
  background: #f8fbfa;
}

.chat-composer form > div {
  margin-top: 9px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.chat-composer small {
  color: var(--muted);
  font-size: 9px;
}

.chat-login-callout {
  display: flex;
  align-items: center;
  gap: 10px;
}

.chat-login-callout > div {
  margin-left: auto;
}

.chat-login-callout b {
  font-size: 13px;
}

.chat-login-callout p {
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 10px;
}

.responsive-table {
  border-radius: 16px;
}

table {
  font-size: 12px;
}

th {
  padding: 13px 12px;
  background: #edf5f3;
}

td {
  padding: 14px 12px;
}

.table-input {
  min-width: 145px;
  min-height: 39px;
  padding: 8px 10px;
  background: #fff;
}

.reclassify-form {
  min-width: 205px;
  display: flex;
  align-items: center;
  gap: 7px;
}

.reclassify-form select {
  min-width: 130px;
  padding: 8px 9px;
  background: #fff;
}

.reclassify-form .btn {
  min-height: 39px;
  flex: 0 0 auto;
}

.form-actions {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 9px;
}

.edit-panel {
  border-right: 4px solid var(--secondary);
  background: linear-gradient(100deg, #fffdf8, #fff);
  box-shadow: 0 16px 42px rgba(18, 60, 55, 0.08);
}

.row-actions {
  flex-wrap: wrap;
}

.row-actions > a,
.row-actions > form > button {
  min-height: 34px;
  padding: 6px 10px;
  border-radius: 9px;
  background: #edf6f4;
}

.row-actions > a:hover,
.row-actions > form > button:hover {
  background: #dcefeb;
}

.package-grid article .row-actions {
  margin-top: 16px;
  padding-top: 13px;
  border-top: 1px solid var(--line);
}

.footer {
  margin-top: 70px;
  background:
    radial-gradient(circle at 15% 20%, rgba(234, 166, 58, 0.09), transparent 18rem),
    #0d312d;
}

.footer-grid {
  padding-top: 52px;
  padding-bottom: 44px;
}

.copyright {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 9px;
}

.footer .developer-credit {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  margin: 0;
  padding: 7px 18px;
  border-radius: 11px;
  color: #dcebe8;
  line-height: 1.55;
  transition: 0.2s ease;
}

.footer .developer-credit strong {
  color: #fff;
  font-size: 12px;
}

.footer .developer-credit small {
  color: #96b1ac;
  font-size: 9px;
}

.footer .developer-credit:hover {
  background: rgba(255, 255, 255, 0.07);
  transform: translateY(-1px);
}

@media (max-width: 1050px) {
  .header-inner {
    grid-template-columns: auto minmax(240px, 1fr) auto;
    gap: 18px;
  }

  .brand {
    min-width: auto;
  }

  .brand small {
    display: none;
  }

  .hero-grid {
    grid-template-columns: minmax(0, 1.1fr) minmax(300px, 0.9fr);
    gap: 38px;
  }

  .quick-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .cards-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .chat-rooms-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 800px) {
  body {
    padding-bottom: 72px;
  }

  .container {
    width: min(100% - 24px, 1200px);
  }

  .detail-image {
    width: min(calc(100% - 24px), 500px);
    max-height: 500px;
    aspect-ratio: 1 / 1;
    margin: 12px auto 0;
    border-radius: 16px;
  }

  .topbar {
    position: sticky;
  }

  .header-inner {
    min-height: 0;
    height: auto;
    padding: 10px 0 12px;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
  }

  .brand {
    min-width: 0;
  }

  .brand-mark {
    width: 42px;
    height: 42px;
    border-radius: 13px 6px 13px 13px;
    font-size: 22px;
  }

  .brand b {
    font-size: 15px;
  }

  .header-search {
    grid-column: 1 / -1;
    grid-row: 2;
    display: grid;
    max-width: none;
  }

  .account-nav {
    display: flex;
    justify-self: end;
    gap: 6px;
  }

  .account-nav .btn,
  .account-nav > a:first-child:not(.icon-link) {
    display: inline-flex;
  }

  .account-nav .btn {
    min-height: 36px;
    padding: 6px 10px;
    font-size: 11px;
  }

  .section-nav {
    display: block;
  }

  .nav-scroll {
    height: 46px;
    gap: 4px;
  }

  .nav-scroll a {
    padding: 6px 9px;
    font-size: 11px;
  }

  .hero-grid {
    min-height: 0;
    grid-template-columns: 1fr;
    gap: 30px;
    padding: 54px 0 46px;
  }

  .hero-copy h1 {
    font-size: clamp(38px, 10vw, 52px);
  }

  .hero-visual {
    display: none;
  }

  .quick-sections,
  .home-section {
    padding-top: 52px;
  }

  .quick-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cards-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .home-section .cards-grid {
    display: flex;
    gap: 14px;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 4px 2px 18px;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    scrollbar-width: thin;
    scrollbar-color: #a7c8c3 transparent;
    -webkit-overflow-scrolling: touch;
  }

  .home-section .cards-grid::-webkit-scrollbar {
    height: 5px;
  }

  .home-section .cards-grid::-webkit-scrollbar-track {
    background: transparent;
  }

  .home-section .cards-grid::-webkit-scrollbar-thumb {
    border-radius: 20px;
    background: #a7c8c3;
  }

  .home-section .cards-grid .content-card {
    flex: 0 0 min(82vw, 330px);
    scroll-snap-align: start;
  }

  .dashboard-shell,
  .admin-shell {
    grid-template-columns: 1fr;
    padding-top: 20px;
  }

  .member-side,
  .admin-side {
    top: auto;
  }

  .member-side form,
  .admin-side form {
    display: flex;
    flex: 0 0 auto;
    margin: 0;
  }

  .member-side form .side-logout,
  .admin-side form button {
    width: auto;
    min-height: 38px;
    padding: 8px 12px;
    border-radius: 9px;
    white-space: nowrap;
  }

  .member-side form .side-logout {
    background: #fff0f0;
    color: #a83c3c;
  }

  .mobile-nav a,
  .mobile-nav .mobile-logout {
    flex: 1 1 0;
    min-width: 0;
  }

  .mobile-nav .mobile-logout {
    display: block;
    margin: 0;
  }

  .mobile-nav .mobile-logout button {
    width: 100%;
    min-width: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: #ad4545;
    font-size: 9px;
    text-align: center;
  }

  .mobile-nav .mobile-logout span {
    display: block;
    color: #ad4545;
    font-size: 18px;
    line-height: 1.1;
  }

  .add-types {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .section-controls {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .auth-wrap {
    grid-template-columns: 1fr;
    margin-top: 24px;
  }

  .chat-room-scroll {
    height: 46px;
  }

  .chat-page {
    padding-top: 25px;
  }

  .chat-message {
    max-width: 92%;
  }
}

@media (max-width: 560px) {
  .brand span:last-child {
    min-width: 0;
  }

  .brand b {
    max-width: 118px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .account-nav .register-btn {
    padding-inline: 9px;
  }

  .hero-grid {
    padding-top: 42px;
  }

  .hero-copy h1 {
    font-size: 36px;
    letter-spacing: -1px;
  }

  .hero-copy > p {
    font-size: 14px;
  }

  .hero-search {
    display: grid;
    grid-template-columns: 1fr;
  }

  .hero-search .btn {
    width: 100%;
  }

  .section-title {
    align-items: flex-start;
  }

  .section-title h2 {
    font-size: 24px;
  }

  .quick-grid,
  .add-types {
    grid-template-columns: 1fr;
  }

  .post-media-fields {
    grid-template-columns: 1fr;
  }

  .section-controls {
    grid-template-columns: 1fr;
  }

  .chat-rooms-grid {
    grid-template-columns: 1fr;
  }

  .chat-page-head {
    min-height: 0;
    padding: 25px 22px;
  }

  .chat-page-head h1 {
    font-size: 27px;
  }

  .chat-head-icon,
  .chat-room-heading > span {
    display: none;
  }

  .chat-room-heading {
    padding: 20px;
  }

  .chat-room-heading h1 {
    font-size: 22px;
  }

  .chat-messages {
    min-height: 360px;
    padding: 15px 10px;
  }

  .chat-message {
    max-width: 100%;
  }

  .chat-avatar {
    width: 32px;
    height: 32px;
    border-radius: 10px;
    font-size: 12px;
  }

  .chat-bubble {
    min-width: 0;
    flex: 1;
  }

  .chat-login-callout,
  .chat-composer form > div {
    align-items: stretch;
    flex-direction: column;
  }

  .chat-login-callout > div {
    margin-left: 0;
  }

  .chat-login-callout .btn,
  .chat-composer .btn {
    width: 100%;
  }

  .quick-grid a {
    min-height: 86px;
  }

  .card-body h3,
  .card-body p {
    min-height: 0;
  }

  .form-grid,
  .compact-form {
    grid-template-columns: 1fr;
  }

  .span-2 {
    grid-column: auto;
  }

  .auth-copy {
    padding: 34px 25px;
  }

  .auth-card {
    margin: 8px;
    padding: 28px 22px;
  }

  .panel {
    padding: 19px;
  }

  .stats-grid,
  .admin-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media print {
  body {
    background: #fff;
    padding: 0;
  }

  .topbar,
  .footer,
  .mobile-nav,
  .admin-side,
  .member-side,
  .btn,
  .action-row,
  .filter-bar,
  .bulk-bar,
  .row-actions,
  form button {
    display: none !important;
  }
}