*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;padding:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:#111;background:#fff;line-height:1.6}.container{max-width:680px;margin:0 auto;padding:0 16px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.header{position:sticky;top:0;z-index:20;background:#fffffff2;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid #eee;box-shadow:0 2px 8px #0000000a}.header .container{display:flex;align-items:center;justify-content:space-between;height:60px}.brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:18px}.logo{width:28px;height:28px}.brand-name{font-weight:700}.icon-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid #ddd;background:#fff;width:40px;height:40px;border-radius:12px;font-size:18px;display:grid;place-items:center;cursor:pointer;transition:all .2s}.icon-btn:hover{background:#f5f5f5;border-color:#bbb}.icon-btn:active{transform:scale(.95)}.icon-btn.close{position:absolute;top:12px;right:12px;z-index:2;background:#0009;color:#fff;border:none}.main{padding-bottom:100px}.hero{padding:20px 16px 8px}.video-player-container{position:relative;overflow:hidden;aspect-ratio:16/9;background:#000;margin-bottom:16px}.main-video{width:100%;height:100%;object-fit:contain;display:block}.video-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#0000004d;cursor:pointer;transition:opacity .3s}.video-overlay:hover{background:#0006}.play-btn-large{background:#fffffff2;color:#111;border:none;border-radius:50%;width:80px;height:80px;font-size:28px;cursor:pointer;box-shadow:0 8px 24px #0000004d;transition:all .2s;display:flex;align-items:center;justify-content:center}.play-btn-large:hover{transform:scale(1.1);background:#fff}.thumb-wrap{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:16/9;background:#000;cursor:pointer}.thumb{width:100%;height:100%;object-fit:cover;display:block}.play-btn{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:#ffffffe6;color:#111;border:none;border-radius:50%;width:64px;height:64px;font-size:24px;cursor:pointer;box-shadow:0 6px 18px #00000040;transition:all .2s}.play-btn:hover{transform:translate(-50%,-50%) scale(1.1);background:#fff}.badge{position:absolute;top:12px;left:12px;background:#111111e6;color:#fff;font-size:12px;padding:6px 12px;border-radius:20px;font-weight:600;z-index:1}.badge-offer{left:auto;right:12px;background:linear-gradient(135deg,#fa8c16,#ff6b35)}.title{margin:16px 0 8px;font-size:20px;line-height:1.5;font-weight:700}.price-display{font-size:18px;color:#fa8c16;font-weight:700;margin-bottom:12px}.carousel{display:grid;grid-auto-flow:column;gap:12px;overflow-x:auto;padding:12px 0 24px;scroll-snap-type:x mandatory}.carousel img{width:180px;height:100px;object-fit:cover;border-radius:10px;flex:0 0 auto;scroll-snap-align:start}.popup-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000d9;z-index:100;display:flex;align-items:center;justify-content:center;padding:20px;animation:fadeIn .3s ease}.popup-overlay.popup-forced{background:#000000f2;z-index:999999}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.popup-modal{position:relative;background:#fff;border-radius:20px;max-width:400px;width:100%;max-height:90vh;overflow:hidden;box-shadow:0 20px 60px #00000080;animation:slideUp .3s ease}@keyframes slideUp{0%{transform:translateY(50px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-5px)}20%,40%,60%,80%{transform:translate(5px)}}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.05);box-shadow:0 0 20px #fa8c1680}to{transform:scale(1)}}.popup-close{position:absolute;top:12px;right:12px;z-index:2;width:36px;height:36px;border-radius:50%;background:#0009;color:#fff;border:none;font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.popup-close:hover{background:#000c;transform:scale(1.1)}.popup-content{display:flex;flex-direction:column}.popup-video-container{position:relative;width:100%;aspect-ratio:9/16;background:#000;overflow:hidden}.popup-video{width:100%;height:100%;object-fit:cover}.popup-info{padding:16px 20px}.popup-platform{font-size:14px;font-weight:700;color:#666;margin-bottom:8px;text-transform:uppercase;letter-spacing:.5px}.popup-title{margin:0 0 8px;font-size:18px;font-weight:700;line-height:1.4;color:#111}.popup-price{font-size:20px;color:#fa8c16;font-weight:700;margin:8px 0}.popup-badge{display:inline-block;padding:6px 12px;background:linear-gradient(135deg,#fa8c16,#ff6b35);color:#fff;border-radius:20px;font-size:12px;font-weight:600;margin-top:8px}.popup-cta{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;color:#fff;background:#ff4d4f;height:56px;border-radius:0 0 20px 20px;font-weight:700;font-size:18px;cursor:pointer;transition:all .2s;width:100%}.popup-cta:hover{background:#f33;transform:scale(1.02)}.popup-cta:active{transform:scale(.98)}.popup-cta-tiktok{background:linear-gradient(135deg,#000,#333)}.popup-cta-tiktok:hover{background:linear-gradient(135deg,#111,#444)}.popup-cta-shopee{background:linear-gradient(135deg,#ee4d2d,#ff6b35)}.popup-cta-shopee:hover{background:linear-gradient(135deg,#f53,#f74)}.popup-tiktok{border:2px solid #000}.popup-shopee{border:2px solid #ee4d2d}.popup-simple{border:2px solid #ddd}.popup-content-simple{display:flex;flex-direction:column}.popup-thumbnail-container{width:100%;aspect-ratio:16/9;background:#000;overflow:hidden;border-radius:12px 12px 0 0}.popup-thumbnail{width:100%;height:100%;object-fit:cover;display:block}.popup-links{display:flex;flex-direction:column;gap:12px;padding:20px}.popup-link-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;color:#fff;height:56px;border-radius:12px;font-weight:700;font-size:18px;cursor:pointer;transition:all .2s;width:100%}.popup-link-shopee{background:linear-gradient(135deg,#ee4d2d,#ff6b35)}.popup-link-shopee:hover{background:linear-gradient(135deg,#f53,#f74);transform:scale(1.02)}.popup-link-shopee:active{transform:scale(.98)}.popup-link-tiktok{background:linear-gradient(135deg,#000,#333)}.popup-link-tiktok:hover{background:linear-gradient(135deg,#111,#444);transform:scale(1.02)}.popup-link-tiktok:active{transform:scale(.98)}.sticky-cta{display:none}.cta-btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;color:#fff;background:#ff4d4f;height:52px;border-radius:14px;font-weight:700;font-size:16px;cursor:pointer;transition:all .2s;box-shadow:0 4px 12px #ff4d4f4d}.cta-btn:hover{transform:translateY(-2px);box-shadow:0 6px 16px #ff4d4f66}.cta-btn:active{transform:translateY(0)}.cta-secondary{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:2px solid #ddd;background:#fff;color:#111;height:52px;border-radius:14px;padding:0 16px;font-weight:600;cursor:pointer;transition:all .2s}.cta-secondary:hover{border-color:#bbb;background:#f9f9f9}.cta-secondary:active{transform:scale(.98)}.toast{position:fixed;left:50%;bottom:80px;transform:translate(-50%) translateY(20px);background:#111111f2;color:#fff;padding:12px 18px;border-radius:12px;opacity:0;pointer-events:none;transition:all .3s ease;z-index:40;font-size:14px}.toast.show{opacity:1;transform:translate(-50%) translateY(0)}.lightbox{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000eb;display:none;align-items:center;justify-content:center;z-index:50}.lightbox[aria-hidden=false]{display:flex}.lightbox-inner{position:relative;width:100%;max-width:900px;margin:0 16px}.lightbox video{width:100%;border-radius:12px;background:#000}.footer{padding:24px 0 110px;color:#666;border-top:1px solid #eee;margin-top:32px}.footer .container{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}.footer a{color:inherit;text-decoration:none;transition:color .2s}.footer a:hover{color:#111}.disclosure{font-size:12px}.footer-nav{display:flex;gap:16px}.admin-container{max-width:1200px;margin:0 auto;padding:24px 16px;min-height:100vh;background:#f5f7fa}.admin-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;padding:20px;background:#fff;border-radius:16px;box-shadow:0 2px 8px #0000000f}.admin-header h1{margin:0;font-size:24px;font-weight:700}.admin-loading{text-align:center;padding:40px;font-size:18px;color:#666}.alert{padding:12px 16px;border-radius:12px;margin-bottom:16px;font-size:14px}.alert-error{background:#fee;color:#c33;border:1px solid #fcc}.alert-success{background:#efe;color:#3c3;border:1px solid #cfc}.admin-grid{display:grid;gap:20px}.admin-card{background:#fff;border-radius:16px;padding:24px;box-shadow:0 2px 8px #0000000f}.admin-card.full-width{grid-column:1 / -1}.admin-card h2{margin:0 0 20px;font-size:20px;font-weight:700}.upload-area{margin-bottom:16px}.upload-label{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:40px;border:2px dashed #ddd;border-radius:12px;cursor:pointer;transition:all .2s;background:#fafafa}.upload-label:hover{border-color:#fa8c16;background:#fff5e6}.upload-icon{font-size:48px}.upload-progress{width:100%;height:8px;background:#eee;border-radius:4px;overflow:hidden}.upload-progress-bar{height:100%;background:linear-gradient(90deg,#fa8c16,#ff6b35);transition:width .3s}.video-key-display{margin-top:12px;padding:8px 12px;background:#f0f0f0;border-radius:8px;font-size:14px}.video-preview-container{margin-top:16px}.video-preview{width:100%;border-radius:12px;background:#000;max-height:400px}.form-grid{display:grid;gap:16px}.form-group{display:flex;flex-direction:column;gap:6px}.form-group.full-width{grid-column:1 / -1}.form-group label{font-size:14px;font-weight:600;color:#333}.form-input{padding:12px 16px;border:2px solid #ddd;border-radius:10px;font-size:15px;transition:all .2s}.form-input:focus{outline:none;border-color:#fa8c16;box-shadow:0 0 0 3px #fa8c161a}.utm-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.btn-primary{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;background:linear-gradient(135deg,#fa8c16,#ff6b35);color:#fff;padding:14px 24px;border-radius:12px;font-weight:700;font-size:16px;cursor:pointer;transition:all .2s;width:100%;margin-top:8px}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 4px 12px #fa8c164d}.btn-primary:active{transform:translateY(0)}.btn-primary:disabled{opacity:.6;cursor:not-allowed}.btn-secondary{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:2px solid #ddd;background:#fff;color:#111;padding:10px 20px;border-radius:10px;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s}.btn-secondary:hover{border-color:#bbb;background:#f9f9f9}.links-list{display:grid;gap:16px}.link-item{border:2px solid #eee;border-radius:12px;padding:20px;transition:all .2s}.link-item:hover{border-color:#fa8c16;box-shadow:0 4px 12px #00000014}.link-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;flex-wrap:wrap;gap:12px}.link-id{font-family:Courier New,monospace;font-size:14px;font-weight:700;color:#fa8c16}.link-actions{display:flex;gap:8px;flex-wrap:wrap}.btn-small{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid #ddd;background:#fff;color:#111;padding:6px 12px;border-radius:8px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s}.btn-small:hover{background:#f5f5f5;border-color:#bbb}.btn-small.btn-edit{border-color:#fa8c16;color:#fa8c16}.btn-small.btn-edit:hover{background:#fff5e6}.btn-small.btn-copy{border-color:#52c41a;color:#52c41a}.btn-small.btn-copy:hover{background:#f6ffed}.btn-small.btn-delete{border-color:#ff4d4f;color:#ff4d4f}.btn-small.btn-delete:hover{background:#fee}.btn-small.btn-open{text-decoration:none;border-color:#1890ff;color:#1890ff}.btn-small.btn-open:hover{background:#e6f7ff}.link-content{display:grid;gap:8px}.link-url{font-size:14px;color:#666;word-break:break-all}.link-meta{font-size:14px;color:#333}.link-video-preview{margin-top:12px}.link-video{width:100%;border-radius:8px;background:#000;max-height:300px}.admin-card .empty-state{text-align:center;padding:40px;color:#999;font-size:16px}.home-container{max-width:1200px;margin:0 auto;padding:20px 16px;min-height:100vh}.home-header{text-align:center;margin-bottom:32px;padding:24px 0}.home-header h1{margin:0 0 8px;font-size:28px;font-weight:800;background:linear-gradient(135deg,#fa8c16,#ff6b35);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.home-header p{margin:0;font-size:16px;color:#666}.products-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-bottom:40px}.product-card{display:block;text-decoration:none;color:inherit;border:1px solid #eee;border-radius:16px;overflow:hidden;background:#fff;transition:all .3s}.product-card:hover{transform:translateY(-4px);box-shadow:0 8px 24px #0000001f;border-color:#fa8c16}.product-image{position:relative;width:100%;aspect-ratio:1;background:#f5f5f5;overflow:hidden}.product-image img{width:100%;height:100%;object-fit:cover;transition:transform .3s}.product-card:hover .product-image img{transform:scale(1.05)}.media-badge{position:absolute;top:8px;right:8px;background:#000c;color:#fff;padding:4px 8px;border-radius:12px;font-size:12px;font-weight:600}.product-info{padding:16px;display:flex;flex-direction:column;gap:8px}.product-title{margin:0;font-size:16px;font-weight:700;line-height:1.4;color:#111;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.product-desc{margin:0;font-size:13px;color:#666;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.product-action{margin-top:8px;padding-top:12px;border-top:1px solid #eee}.product-action span{font-size:14px;font-weight:600;color:#fa8c16}.empty-state{text-align:center;padding:60px 20px}.empty-icon{font-size:64px;margin-bottom:16px;opacity:.5}.empty-state p{margin:0;font-size:16px;color:#999}@media (min-width: 640px){.products-grid{grid-template-columns:repeat(3,1fr);gap:20px}.product-title{font-size:17px}.product-desc{font-size:14px}}@media (min-width: 1024px){.products-grid{grid-template-columns:repeat(4,1fr);gap:24px}.home-header h1{font-size:36px}.home-header p{font-size:18px}}@media (min-width: 768px){.admin-grid{grid-template-columns:repeat(2,1fr)}.utm-grid{grid-template-columns:repeat(4,1fr)}.main{padding-bottom:120px}.cta-btn,.cta-secondary{height:56px;font-size:17px}.toast{bottom:100px}.title{font-size:22px}}@media (min-width: 1024px){.admin-container{padding:32px 24px}.admin-card{padding:32px}}
