/* Giao diện xanh lá pastel & hồng. Chữ đậm để dễ đọc, không dùng chữ pastel trên nền sáng. */
:root{--ink:#24452a;--muted:#4c6650;--green:#397340;--cream:#f3faec;--line:#c8dfb8;--orange:#a54e70;--soft:#e2f2d4;--shadow:0 12px 35px #284a3b0b;--pink:#f5dfe7;--mint:#d6edbf}
body{font-size:17px;line-height:1.7;background:linear-gradient(145deg,#edf7df 0%,#f5faed 45%,#fff5f9 78%,#edf7df 100%);overflow-wrap:break-word}
button,input,select,textarea{line-height:1.55}
.preview-bar{background:#d5ebbd;color:#365c2e;font-size:13px;padding:10px 18px}
.header{padding-top:23px;padding-bottom:23px}
.brand{font-size:24px;letter-spacing:-.5px}.brand small{font-size:13px;letter-spacing:0;line-height:1.4}.brand-mark{background:#cee7b6;color:#397340}.brand-mark span{color:#a54e70}
nav{font-size:15px;gap:22px}.text-button{font-size:15px;min-height:44px;display:inline-flex;align-items:center}
.button{font-size:16px;min-height:48px;border-radius:12px;padding:13px 20px;gap:13px}.primary{background:#397340}.primary:hover{background:#2c5d32}.light{background:#ffffffa0;border-color:#b2ce99}.light:hover{background:#dcefc9}
.hero{gap:28px;padding-top:52px;padding-bottom:45px;grid-template-columns:1.14fr 1fr}.eyebrow{font-size:12px;letter-spacing:1.2px}.hero h1{font-size:clamp(38px,4vw,54px);letter-spacing:-1.7px;line-height:1.22}.lead{font-size:18px;line-height:1.85}.hero-note{font-size:15px;max-width:520px}.hero-copy{min-width:0}.hero-actions{gap:12px}
.hero-art.mascot-scene{margin:0;position:relative;height:420px;min-width:0;transform:none;isolation:isolate}.mascot-scene .art-orbit{width:310px;height:310px;background:#c8e5a7;top:30px;left:50%;transform:translateX(-50%);border-radius:47% 53% 46% 54%}.pink-orbit{position:absolute;right:10%;bottom:76px;width:180px;height:180px;background:#f4dce6;border-radius:50%;z-index:-1}.mascot-image{position:absolute;inset:0 0 auto;width:100%;height:355px;object-fit:contain;z-index:1;filter:drop-shadow(0 12px 12px #39734012)}
.mascot-scene .floating-note{font-size:14px;z-index:2;border-color:#c8dfb8;background:#ffffffed;border-radius:14px;padding:10px 14px}.mascot-scene .note-one{top:32px;left:-5px;transform:rotate(-5deg)}.mascot-scene .note-two{bottom:80px;right:-4px;transform:rotate(4deg);background:#fff0f5}.mascot-scene .art-flower{right:12px;top:8px;color:#bf7292;font-size:43px;z-index:2}.mascot-caption{position:absolute;bottom:0;left:0;right:0;text-align:center;line-height:1.6}.mascot-caption strong{display:block;font-size:19px;color:#397340}.mascot-caption span{font-size:14px;color:var(--muted)}
.pathways{gap:12px}.path,.path+.path{background:#ffffffc7;border:1px solid #c8dfb8;border-radius:15px;padding:19px 12px;gap:10px;box-shadow:var(--shadow);min-width:0}.path strong{font-size:15px;line-height:1.4}.path small{font-size:12px;display:block;line-height:1.5;margin-top:5px}.path-icon{width:39px;height:45px}.path>b{flex-shrink:0}.peach{background:#f5dfe7;color:#965172}.green{background:#c8e5a7;color:#397340}.yellow{background:#e5f1db;color:#4d683d}.lavender{background:#f3e4ef;color:#7d5271}
h2{font-size:29px;line-height:1.35}.section-heading{align-items:center}.sample-label{font-size:13px;background:#f6e6ed;color:#78475e}.explore{padding-top:55px}.search-panel{padding:13px;border-radius:15px}.search-field input,.province-field select{font-size:17px;min-height:48px}.search-field{min-width:0}.province-field{min-width:0;max-width:280px}.category-label select{font-size:15px;max-width:230px;min-height:44px}.chip{font-size:15px;min-height:44px;padding:8px 15px}.filter-row{align-items:flex-start;gap:14px}.chips{gap:8px}.results-heading p{font-size:15px}.results-heading .text-button{font-size:14px}
.card{border-radius:17px;border-color:#c8dfb8}.card-visual{height:185px}.visual-produce{background:#d2ebbb}.visual-food{background:#f7e1e8}.visual-books{background:#e0efc9}.visual-bike{background:#d6ebcd}.visual-desk{background:#f0e2ee}.visual-basket{background:#dcecc5}.card-visual .category-tag{font-size:12px;padding:5px 10px;max-width:calc(100% - 24px)}.card-visual .demo-tag{font-size:11px;color:#425d4b}.card-meta{flex-wrap:wrap;gap:9px}.badge{font-size:12px;border-radius:6px;padding:4px 9px;background:#e0efcd;color:#365f3e}.badge.sell{background:#f7e4ec;color:#8f4564}.badge.need{background:#edf2dd;color:#56662f}.badge.buy{background:#eee4f2;color:#74547f}.place{font-size:13px;color:#4c6650}.card-body{padding:21px}.card h3{font-size:21px;line-height:1.4}.card h3 button{font-size:inherit;min-height:44px;line-height:1.4}.card-desc{font-size:16px;line-height:1.75}.priority-note{font-size:13px;color:#4c6650}.card-foot{flex-wrap:wrap}.card-price{font-size:15px}.card-link{font-size:15px;min-height:44px}.card-bottom-space{height:16px}
.support{background:linear-gradient(115deg,#d3eab9,#e2f0ce 65%,#f6dce8);border:1px solid #c4dcac;border-radius:20px}.support .eyebrow{font-size:12px}.support p:not(.eyebrow){font-size:17px;line-height:1.8}.support .button{font-size:16px}.b1{background:#a3cb7d;color:#2b4a36}.b2{background:#e8b5c8;color:#5e3447}.book-art>span{color:#a65e7a}.how h2{font-size:29px}.steps h3{font-size:19px;line-height:1.45}.steps p{font-size:16px;line-height:1.8}.steps article>span{color:#3e654b;background:#deedc9;border-color:#bad59f;font-size:14px;width:37px;height:37px}.contact-strip{background:#e3f1d3;border-radius:16px;border:1px solid #c8dfb8}.contact-strip p{font-size:16px}.contact-strip h2{font-size:26px}.footer-top p{font-size:15px}.footer-top .brand{font-size:22px}.footer-bottom{font-size:13px;line-height:1.6}
dialog{border-color:#c8dfb8;border-radius:19px;max-width:690px;background:#fbfdfb}.modal-top{font-size:13px}.close{background:#f4dfe8;color:#754357;width:44px;height:44px;flex-shrink:0}.detail-grid>div{font-size:16px;background:#e4f1d6}.detail-grid small{font-size:13px}.notice{background:#f8eaf0;border-color:#ead1dd;color:#70465a;font-size:15px!important}#modal-body p{font-size:16px;line-height:1.8}#modal-body p[style]{font-size:14px!important}.detail-actions{gap:12px}.report-types label{font-size:16px;min-height:48px}.report-types input{width:20px;height:20px;flex-shrink:0;accent-color:var(--green)}.form-field{font-size:16px}.form-field input,.form-field select,.form-field textarea{font-size:17px;min-height:48px}.form-field input[type=checkbox]{min-height:20px;accent-color:var(--green)}.admin-item h3{font-size:18px}.admin-item p{font-size:15px!important}.admin-item button{font-size:15px}.admin-status{font-size:14px}.empty p{font-size:16px}.toast{font-size:15px}
@media(max-width:1100px){.hero{grid-template-columns:1.15fr 1fr}.hero h1{font-size:43px}.header{flex-wrap:wrap}.header nav{gap:20px}.brand{font-size:22px}.pathways{grid-template-columns:1fr 1fr}.path,.path+.path{padding:17px}.path strong{font-size:16px}.path small{font-size:13px}.path>b{margin-left:auto}.filter-row{flex-wrap:wrap}.cards{gap:18px}.card-body{padding:17px}.card h3{font-size:20px}.card-foot{gap:2px}.card-price{font-size:14px}.card-desc{font-size:16px}}
@media(max-width:850px){.header nav{order:3;width:100%;justify-content:space-between;border-top:1px solid var(--line);padding-top:12px}.cards{grid-template-columns:1fr 1fr}.hero{grid-template-columns:1fr 1fr;gap:12px}.hero h1{font-size:37px}.lead{font-size:17px}.hero-art.mascot-scene{height:370px}.mascot-image{height:300px}.mascot-scene .art-orbit{width:235px;height:250px;top:27px}.mascot-scene .floating-note{font-size:12px;padding:8px 10px}.mascot-scene .note-one{left:-6px;top:8px}.mascot-scene .note-two{bottom:70px;right:0}.mascot-scene .art-flower{font-size:30px;right:0;top:12px}.mascot-caption span{font-size:13px}.hero-actions .button{width:100%}.category-label select{max-width:100%}.support{gap:15px}.book-art{min-width:0}.book{width:105px;height:150px;font-size:11px;padding:25px 10px}.book-art>span{right:0;font-size:35px}.section-heading h2{font-size:26px}}
@media(max-width:600px){html{scroll-padding-top:14px}.wrap{padding-left:20px;padding-right:20px}.preview-bar{font-size:12px;padding:9px 14px;line-height:1.5}.header{gap:17px;padding-top:18px;padding-bottom:15px}.header>.button{font-size:14px;min-height:46px;padding:10px 13px}.brand{font-size:20px;gap:9px}.brand small{font-size:11px;max-width:170px}.brand-mark{width:37px;height:40px;font-size:35px}.header nav{font-size:14px;gap:10px}.header nav .text-button{font-size:14px}.hero{grid-template-columns:1fr;padding-top:34px;padding-bottom:30px;gap:12px}.hero h1{font-size:clamp(34px,8.5vw,46px);letter-spacing:-1.1px}.hero-copy .eyebrow{font-size:11px;letter-spacing:.6px;line-height:1.7}.lead{font-size:18px;margin-top:20px}.hero-actions .button{width:auto;font-size:15px;flex:1 1 170px}.hero-note{font-size:14px}.hero-art.mascot-scene{height:365px;max-width:430px;width:100%;margin:10px auto 0;transform:none}.mascot-image{height:300px}.mascot-scene .art-orbit{width:280px;height:265px;top:10px}.pink-orbit{width:150px;height:150px;right:8%;bottom:64px}.mascot-scene .note-one{left:0;top:20px}.mascot-scene .note-two{right:0;bottom:76px}.mascot-scene .floating-note{font-size:13px}.mascot-scene .art-flower{right:15px;top:5px;font-size:35px}.mascot-caption strong{font-size:19px}.mascot-caption span{font-size:14px}.pathways{grid-template-columns:1fr 1fr;gap:10px}.path,.path+.path{padding:14px 12px;flex-wrap:wrap;gap:8px;border:1px solid var(--line)}.path-icon{width:34px;height:34px;font-size:25px}.path>span:nth-child(2){flex-basis:100%}.path strong{font-size:16px}.path small{font-size:13px}.path>b{display:none}.explore{padding-top:39px}.section-heading{gap:10px;flex-wrap:wrap}.section-heading h2,.how h2{font-size:26px}.sample-label{display:inline-block;font-size:12px}.eyebrow{font-size:11px;line-height:1.7}.search-panel{gap:9px;padding:11px}.search-field{flex-basis:100%;padding-left:4px}.search-field input{font-size:17px}.province-field{padding-left:3px;flex:1 1 100%;max-width:100%;border:0}.province-field select{font-size:17px;width:100%}.search-panel>.button{width:100%;font-size:16px}.filter-row{margin-top:18px;gap:10px}.chips{gap:7px}.chip{font-size:14px;padding:8px 13px;min-height:44px}.category-label{width:100%}.category-label select{width:100%;font-size:16px;border-bottom:1px solid var(--line);padding:8px 2px}.results-heading p{font-size:14px}.results-heading .text-button{font-size:14px;white-space:nowrap}.cards{grid-template-columns:1fr;gap:21px}.card-visual{height:190px}.card-body{padding:20px}.card-meta{flex-wrap:wrap}.place{font-size:14px}.card h3{font-size:23px}.card-desc{font-size:17px;line-height:1.8}.card-price{font-size:16px}.card-link{font-size:16px}.priority-note{font-size:14px}.card-visual .category-tag{font-size:13px}.card-visual .demo-tag{font-size:11px}.product-art svg{width:165px;height:125px}.support{margin-left:20px;margin-right:20px;padding-top:28px;padding-bottom:28px;grid-template-columns:1fr}.support .eyebrow{font-size:11px}.support h2{font-size:29px}.support p:not(.eyebrow){font-size:17px}.book-art{min-height:210px}.book{width:125px;height:160px;font-size:12px}.book-art>span{right:8px;top:10px}.steps{grid-template-columns:1fr;gap:27px}.steps h3{font-size:19px}.steps p{font-size:17px}.steps article{padding-left:50px}.contact-strip{margin:0 20px;padding:24px 20px;max-width:calc(100% - 40px);align-items:stretch;flex-direction:column}.contact-strip h2{font-size:26px}.contact-strip p{font-size:17px}.contact-strip .button{width:100%}.footer-top{flex-direction:column;gap:18px}.footer-top p{font-size:15px}.footer-bottom{font-size:13px;flex-direction:column}.detail-grid{grid-template-columns:1fr}.field-row{grid-template-columns:1fr}dialog{padding:20px;max-height:92dvh}#modal-body h2{font-size:26px}.detail-actions>.button{flex:1 1 180px}.report-types label{padding:12px}.modal-top{font-size:12px}.hero-art .note-two{white-space:nowrap}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}.button:hover,.card:hover{transform:none}}
