:root{
    --primary:#8FAE5A;
    --primary-hover:#7C944E;
    --primary-border:#7C944E;
    --primary-border-hover:#6F8444;
    --link:#4b86c5;
    --link-hover:#3a6ea8;
    --accent:#8b7a45;
    --background:#f5f5f5;
    --surface:#fff;
    --text:#222;
    --text-secondary:#3f3f46;
    --muted:#666;
    --border:rgba(0,0,0,.1);
    --header-bg:rgba(255,255,255,.95);
    --callout:#f0faf2;
    --callout-cream:#f7f4e4;
    --shadow:0 8px 24px rgba(28,40,24,.08);
    --hover:#f4f4f5;
    --footer-bg:#1f2530;
    --footer-edge:#171b22;
    --shell:rgba(245,245,245,.92);
    --cookie-h:32px;
}

[data-theme="dark"]{
    --background:#171b22;
    --surface:#222933;
    --text:#e8eaed;
    --text-secondary:#c5cad3;
    --muted:#9aa3b2;
    --border:rgba(255,255,255,.12);
    --header-bg:rgba(23,27,34,.95);
    --callout:#1e2e24;
    --callout-cream:#313a34;
    --shadow:0 8px 24px rgba(0,0,0,.28);
    --hover:#2c3544;
    --link:#6aa3d8;
    --link-hover:#8bb8e4;
    --shell:rgba(23,27,34,.92);
    color-scheme:dark;
}

*{
    box-sizing:border-box;
}

html,
body{
    min-width:320px;
    min-height:100%;
}

html{
    color-scheme:light;
    height:100%;
    background:var(--footer-edge);
}

body{
    margin:0;
    min-height:100vh;
    display:flex;
    flex-direction:column;
    font-family:Inter,system-ui,Segoe UI,Arial,sans-serif;
    color:var(--text);
    background:transparent;
}

body::before{
    content:"";
    position:fixed;
    top:0;
    left:50%;
    z-index:1;
    width:min(1200px,100%);
    height:100vh;
    height:calc(100lvh + 80px);
    transform:translateX(-50%);
    pointer-events:none;
    background:var(--shell);
    box-shadow:0 0 0 1px var(--border), 0 0 28px rgba(0,0,0,.12);
}

.topbar,
.header,
.main,
.main-home,
.content,
.footer,
.page-error-main{
    position:relative;
    z-index:2;
}

.atmosphere{
    position:fixed;
    top:0;
    right:0;
    left:0;
    z-index:0;
    height:100vh;
    height:calc(100lvh + 80px);
    pointer-events:none;
    overflow:hidden;
}

.atmosphere-bg{
    position:absolute;
    inset:-5%;
    background:#1e2c24 url("/img/background.png") center / cover no-repeat;
    filter:blur(clamp(6px,calc(100vw / 320),16px));
    transform:scale(1.08);
}

.atmosphere-bg::after{
    content:"";
    position:absolute;
    inset:0;
    background:rgba(16,24,18,.38);
}

[data-theme="dark"] .atmosphere-bg::after{
    background:rgba(20,26,24,.82);
}

.embers{
    display:none;
}

.ember{
    position:absolute;
    bottom:8%;
    width:4px;
    height:4px;
    border-radius:50%;
    background:#8eefe8;
    box-shadow:0 0 12px 3px rgba(110,220,214,.6);
    animation:ember-rise var(--dur,9s) linear infinite;
    animation-delay:var(--delay,0s);
    opacity:0;
}

@keyframes ember-rise{
    0%{
        transform:translate3d(0,40px,0) scale(.6);
        opacity:0;
    }
    12%{
        opacity:.85;
    }
    100%{
        transform:translate3d(var(--drift,20px),-70vh,0) scale(.2);
        opacity:0;
    }
}

@media (prefers-reduced-motion:reduce){
    .ember{
        animation:none;
        display:none;
    }
}

.brand{
    display:flex;
    align-items:center;
    flex-shrink:0;
    line-height:0;
    text-decoration:none;
}

.brand img{
    display:block;
    height:40px;
    width:auto;
    user-select:none;
    -webkit-user-select:none;
    -webkit-user-drag:none;
}

.brand .logo-dark{
    display:none;
}

[data-theme="dark"] .brand .logo-light{
    display:none;
}

[data-theme="dark"] .brand .logo-dark{
    display:block;
}

.theme-toggle{
    width:38px;
    padding:0;
}

.theme-toggle svg{
    width:18px;
    height:18px;
}

.theme-toggle .theme-icon-sun{
    display:none;
}

.theme-toggle .theme-icon-moon{
    display:block;
}

[data-theme="dark"] .theme-toggle .theme-icon-moon{
    display:none;
}

[data-theme="dark"] .theme-toggle .theme-icon-sun{
    display:block;
}

.topbar,
.header{
    position:sticky;
    top:0;
    z-index:50;
    background:var(--header-bg);
    border-bottom:1px solid var(--border);
    backdrop-filter:blur(12px);
}

.topbar-inner,
.header-inner{
    max-width:1120px;
    margin:auto;
    min-height:72px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    padding:12px 24px;
}

.header-left,
.header-right{
    display:flex;
    align-items:center;
    gap:8px;
}

.header-left{
    min-width:0;
    flex:1;
    gap:16px;
}

.breadcrumbs{
    display:flex;
    align-items:center;
    gap:8px;
    min-width:0;
    font-size:14px;
    color:var(--muted);
    user-select:none;
    -webkit-user-select:none;
}

.breadcrumbs::before{
    content:"";
    width:1px;
    height:18px;
    background:var(--border);
    flex-shrink:0;
}

.breadcrumbs a{
    color:var(--muted);
    text-decoration:none;
    font-size:16px;
    font-weight:600;
    white-space:nowrap;
}

.breadcrumbs a:hover{
    color:var(--primary);
}

.breadcrumbs .bc-sep{
    color:#c4c4c4;
    font-size:16px;
    line-height:1;
}

.breadcrumbs .current{
    color:var(--text);
    font-weight:600;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}

.breadcrumbs .current:first-child{
    font-size:16px;
}

.btn-icon{
    width:14px;
    height:14px;
    display:block;
    flex-shrink:0;
}

.top-btn,
.home-btn,
.page-btn{
    appearance:none;
    -webkit-appearance:none;
    margin:0;
    height:38px;
    padding:0 14px;
    background:var(--surface);
    border:1px solid var(--border);
    color:var(--text-secondary);
    text-decoration:none;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    white-space:nowrap;
    border-radius:5px;
    font-size:14px;
    font-weight:500;
    font-family:inherit;
    cursor:pointer;
    transition:background .15s ease,border-color .15s ease,color .15s ease;
}

.top-btn:hover,
.home-btn:hover,
.page-btn:hover:not(:disabled){
    background:var(--hover);
}

.header-buy{
    order:1;
    height:38px;
    padding:0 14px;
    border:1px solid var(--primary-border);
    border-radius:5px;
    background:var(--primary);
    color:#fff;
    text-decoration:none;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font:500 14px Inter,system-ui,sans-serif;
    white-space:nowrap;
    cursor:pointer;
}

.header-buy:hover{
    background:var(--primary-hover);
    border-color:var(--primary-border-hover);
    color:#fff;
}

.lang-wrapper{
    position:relative;
}

.lang-toggle{
    cursor:pointer;
    gap:6px;
}

.lang-menu{
    position:absolute;
    top:calc(100% + 6px);
    right:0;
    background:var(--surface);
    border:1px solid var(--border);
    min-width:160px;
    display:none;
    z-index:1000;
    border-radius:5px;
    box-shadow:0 10px 30px rgba(0,0,0,.12);
    overflow:hidden;
}

.lang-menu.show{
    display:block;
}

.lang-menu a{
    display:flex;
    align-items:center;
    gap:8px;
    padding:10px 12px;
    text-decoration:none;
    color:var(--text);
    font-size:14px;
}

.lang-menu a:hover{
    background:var(--hover);
}

.flag-icon{
    width:16px;
    height:12px;
    vertical-align:middle;
}

.main{
    flex:1 1 auto;
    padding:28px 20px 48px;
}

.main-home{
    flex:0 0 auto;
    display:flex;
    flex-direction:column;
    padding:0;
}

.hero-wrap{
    max-width:1120px;
    width:100%;
    margin:0 auto;
    padding:72px 20px 36px;
}

.product-card{
    max-width:1040px;
    margin:0 auto;
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:6px;
    display:flex;
    gap:30px;
    padding:28px;
    box-shadow:var(--shadow);
}

.product-image{
    width:260px;
    flex-shrink:0;
}

.product-image img{
    width:100%;
    height:auto;
    display:block;
    margin-top:32px;
}

.product-content{
    flex:1;
    min-width:0;
}

.product-title,
.content-card h1,
.page-title{
    font-size:26px;
    font-weight:700;
    letter-spacing:-.02em;
    color:var(--text);
    margin:0 0 16px;
    text-align:left;
}

.product-title{
    font-size:18px;
    font-weight:500;
    letter-spacing:0;
    margin:0 0 14px;
    text-align:center;
}

.page-title{
    color:var(--text);
    text-shadow:none;
    text-align:center;
    font-weight:600;
    margin:12px 0 10px;
}

.product-desc{
    margin-bottom:18px;
    font-size:15px;
    line-height:1.4;
    color:var(--text-secondary);
    text-align:center;
}

.notice,
.notice-yellow{
    background:var(--callout-cream);
    border-left:4px solid var(--accent);
    padding:14px;
    line-height:1.35;
    font-weight:500;
    border-radius:0 4px 4px 0;
}

.notice-green{
    background:var(--callout);
    border-left:4px solid var(--primary);
    padding:16px 18px;
    border-radius:0 4px 4px 0;
}

.features-list{
    margin:12px 0 4px 22px;
    padding:0;
}

.features-list li{
    margin:4px 0;
}

.more-link{
    display:inline-block;
    margin-top:16px;
    text-decoration:none;
    color:var(--link);
    font-weight:400;
}

.more-link:hover{
    color:var(--link-hover);
    text-decoration:underline;
}

.bottom-row{
    margin-top:18px;
    display:flex;
    justify-content:flex-end;
    align-items:center;
    gap:18px;
}

.price,
.price-value{
    font-size:26px;
    font-weight:700;
    color:var(--text);
}

.price-currency,
.currency{
    font-size:16px;
    font-weight:500;
    color:var(--muted);
}

.buy-btn,
.buy-button{
    background:var(--primary);
    border:1px solid var(--primary-border);
    color:#fff;
    text-decoration:none;
    padding:14px 28px;
    font-size:22px;
    font-weight:600;
    line-height:1;
    border-radius:4px;
    min-width:140px;
    text-align:center;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-family:inherit;
    cursor:pointer;
    transition:background .15s ease;
}

.buy-btn:hover,
.buy-button:hover,
.buy-button:focus,
.buy-button:active{
    background:var(--primary-hover);
    border-color:var(--primary-border-hover);
    color:#fff;
}

.footer{
    position:relative;
    z-index:2;
    flex-shrink:0;
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    max-width:none;
    min-height:84px;
    margin-top:auto;
    padding:20px;
    text-align:center;
    background:var(--footer-bg);
    color:#fff;
}

.footer-links{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:8px 4px;
}

.footer-links a,
.footer a{
    color:rgba(255,255,255,.72);
    text-decoration:none;
    margin:0 12px;
    white-space:nowrap;
    font-size:14px;
    user-select:none;
    -webkit-user-select:none;
}

.footer-links a:hover,
.footer a:hover{
    color:#fff;
}

html.cookie-open body{
    padding-bottom:var(--cookie-h);
}

html.cookie-open #vs-chat-btn{
    bottom:calc(20px + var(--cookie-h));
}

html.cookie-open #vs-chat{
    bottom:calc(90px + var(--cookie-h));
}

.content-card{
    max-width:1080px;
    margin:24px auto 0;
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:6px;
    padding:40px 44px 36px;
    box-shadow:var(--shadow);
}

.content-card::before{
    content:"";
    display:block;
    height:3px;
    width:56px;
    background:var(--primary);
    border-radius:99px;
    margin-bottom:24px;
}

.content-card p{
    margin:0 0 16px;
    line-height:1.7;
    font-size:17px;
    color:var(--text-secondary);
}

.content-card a{
    color:var(--link);
    text-decoration:none;
    font-weight:500;
}

.content-card a:hover{
    color:var(--link-hover);
    text-decoration:underline;
}

.content{
    max-width:1120px;
    width:100%;
    flex:1 1 auto;
    margin:0 auto;
    padding:20px 20px 24px;
}

.card{
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:6px;
    box-shadow:0 8px 24px rgba(28,40,24,.06);
}

.gallery-card{
    padding:18px;
    width:100%;
    overflow:hidden;
}

.image-viewer{
    height:340px;
    display:flex;
    align-items:center;
    justify-content:center;
    margin-bottom:16px;
}

.main-image{
    display:block;
    max-width:100%;
    max-height:100%;
    width:auto;
    height:auto;
    border-radius:4px;
}

.thumbs{
    display:flex;
    justify-content:center;
    gap:10px;
    margin-top:12px;
}

.thumbs img{
    width:64px;
    height:64px;
    object-fit:cover;
    border:1px solid var(--border);
    border-radius:4px;
    cursor:pointer;
}

.buy-col{
    grid-area:panel;
    width:350px;
    display:flex;
    flex-direction:column;
    gap:12px;
    align-self:stretch;
}

.buy-panel{
    width:100%;
    flex-shrink:0;
    padding:0;
    opacity:0;
    visibility:hidden;
}

.buy-panel.loaded{
    opacity:1;
    visibility:visible;
    transition:opacity .15s ease;
}

.buy-panel .price{
    padding:22px 22px 8px;
    font-size:36px;
    font-weight:600;
    line-height:1;
}

.stats{
    border-top:1px solid var(--border);
    margin-top:8px;
    padding:24px 22px 0;
}

.stats div{
    margin:0;
    font-size:15px;
    color:var(--muted);
}

.stats strong{
    color:var(--text);
    font-weight:700;
}

.qty-box{
    padding:20px 22px 0;
    margin:0;
    display:flex;
    align-items:center;
    gap:14px;
}

.qty-btn{
    width:38px;
    height:38px;
    border:1px solid var(--border);
    background:var(--surface);
    border-radius:4px;
    font-size:24px;
    cursor:pointer;
    font-family:inherit;
}

.qty-value{
    min-width:20px;
    text-align:center;
    font-size:18px;
    font-weight:700;
}

.buy-button{
    display:block;
    margin:20px 22px 22px;
    padding:16px 0;
    font-size:24px;
}

.stock{
    display:inline-block;
    margin:0 22px 18px;
    padding:4px 10px;
    background:var(--callout);
    border-radius:4px;
    color:var(--primary-hover);
    font-size:13px;
    font-weight:500;
}

.info-card{
    width:100%;
    margin-top:14px;
    padding:22px;
    line-height:1.7;
}

.info-title{
    margin:0 0 20px;
    text-align:center;
    font-size:22px;
    font-weight:600;
    color:var(--text);
}

.info-card p{
    margin:0 0 12px;
}

.benefits-block{
    margin-top:24px;
}

.section-title{
    margin:0 0 6px;
    font-weight:600;
}

.benefits{
    line-height:1.45;
    margin-left:8px;
}

.benefits div{
    padding-left:14px;
    position:relative;
}

.benefits div::before{
    content:"•";
    position:absolute;
    left:0;
    color:var(--primary);
}

.steam-note{
    margin-top:4px;
    margin-bottom:32px;
    padding:12px 14px;
    background:var(--callout);
    border-left:4px solid var(--primary);
    color:var(--muted);
    font-size:14px;
    line-height:1.6;
    border-radius:0 4px 4px 0;
}

.info-subtitle{
    margin:0 0 12px;
    font-size:20px;
    font-weight:600;
    color:var(--text-secondary);
}

.faq-item{
    margin-top:12px;
    border:1px solid var(--border);
    border-radius:4px;
    background:var(--hover);
}

.faq-item summary{
    padding:10px 14px;
    cursor:pointer;
    font-weight:500;
    user-select:none;
}

.faq-item[open]{
    background:var(--surface);
}

.faq-item[open] summary{
    border-bottom:1px solid var(--border);
}

.faq-item p{
    margin:0;
    padding:0 14px 12px;
    line-height:1.6;
}

.faq-item p:first-of-type{
    padding-top:8px;
}

.faq-item p:last-of-type{
    margin-bottom:0;
    padding-bottom:8px;
}

.info-card a,
.notice-yellow a,
.notice-green a,
.notice a{
    color:var(--link);
    text-decoration:none;
    font-weight:500;
}

.info-card a:hover,
.notice-yellow a:hover,
.notice-green a:hover,
.notice a:hover{
    color:var(--link-hover);
    text-decoration:underline;
}

.qty-box.message{
    justify-content:center;
    align-items:center;
    color:#d93025;
    font-size:14px;
    font-weight:700;
    user-select:none;
    -webkit-user-select:none;
}

.max-label{
    color:#d93025;
    font-size:13px;
    font-weight:700;
    display:none;
}

.qty-title{
    color:var(--muted);
    font-size:14px;
    white-space:nowrap;
}

.product-layout{
    display:grid;
    grid-template-columns:minmax(0,1fr) 350px;
    grid-template-areas:
        "title ."
        "main panel";
    column-gap:16px;
    row-gap:8px;
    align-items:start;
    width:100%;
}

.page-title{
    grid-area:title;
}

.product-main{
    grid-area:main;
    min-width:0;
}

.pay-methods{
    padding:14px 16px 16px;
    margin-top:auto;
    user-select:none;
    -webkit-user-select:none;
}

.pay-methods-title{
    margin:0 0 12px;
    font-size:13px;
    font-weight:500;
    color:var(--muted);
    text-align:center;
}

.pay-methods-list{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:center;
    gap:8px;
    margin:0;
    padding:0;
    list-style:none;
}

.pay-methods-list img{
    display:block;
    height:24px;
    width:auto;
    max-width:58px;
    object-fit:contain;
    -webkit-user-drag:none;
}

.pay-methods-list .pay-wide{
    height:15px;
    max-width:58px;
}

.pay-methods-list img.pay-pill{
    height:24px;
    max-width:none;
}

.pay-methods-list .pay-mark{
    height:24px;
}

.review{
    display:flex;
    gap:14px;
    align-items:flex-start;
    padding:14px 0;
    border-top:1px solid var(--border);
}

.review:first-child{
    border-top:none;
}

.review-vote{
    width:20px;
    height:20px;
    flex-shrink:0;
    margin-top:2px;
    background-size:contain;
    background-repeat:no-repeat;
    background-position:center;
    mask-size:contain;
    mask-repeat:no-repeat;
    mask-position:center;
    -webkit-mask-size:contain;
    -webkit-mask-repeat:no-repeat;
    -webkit-mask-position:center;
    user-select:none;
    -webkit-user-select:none;
}

.review-vote.good{
    background-color:var(--primary);
    mask-image:url("/img/vote/up.svg");
    -webkit-mask-image:url("/img/vote/up.svg");
}

.review-vote.bad{
    background-color:#d9534f;
    mask-image:url("/img/vote/down.svg");
    -webkit-mask-image:url("/img/vote/down.svg");
}

.review-content{
    flex:1;
}

.review-date{
    margin-bottom:4px;
    font-size:12px;
    font-weight:400;
    color:#a8adb5;
}

.reviews-pagination{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:12px;
    width:max-content;
    max-width:100%;
    margin:16px auto 0;
    padding:8px 14px;
    background:var(--surface);
    border:1px solid var(--border);
    border-radius:6px;
    color:var(--text);
    box-shadow:var(--shadow);
}

.reviews-pagination .page-btn{
    font-size:13px;
    font-weight:400;
}

.reviews-pagination span{
    color:var(--text-secondary);
    font-weight:400;
    font-size:13px;
}

.reviews-pagination > span{
    user-select:none;
    -webkit-user-select:none;
}

.page-btn:disabled{
    opacity:.5;
    cursor:default;
}

.reviews-page-input{
    width:44px;
    height:34px;
    text-align:center;
    border:1px solid var(--border);
    border-radius:4px;
    background:var(--surface);
    color:var(--text);
    font-size:16px;
    font-weight:400;
    font-family:inherit;
    appearance:textfield;
    -moz-appearance:textfield;
}

.reviews-page-input::-webkit-outer-spin-button,
.reviews-page-input::-webkit-inner-spin-button{
    -webkit-appearance:none;
    margin:0;
}

.info-card,
.reviews-header,
.reviews-card{
    width:100%;
}

.card.reviews-card{
    padding:18px;
    border-radius:0 0 6px 6px;
}

.reviews-tab{
    display:flex;
    align-items:center;
    gap:14px;
    background:#2f3542;
    color:#fff;
    padding:10px 24px;
    font-size:13px;
    font-weight:700;
    margin-bottom:0;
    border-radius:4px 4px 0 0;
    user-select:none;
    -webkit-user-select:none;
}

.reviews-header{
    margin-top:14px;
    margin-bottom:0;
    display:flex;
    align-items:flex-end;
    border-bottom:none;
}

.reviews-stats{
    display:flex;
    align-items:center;
    gap:10px;
    color:#c7ccd5;
}

.review-stat{
    display:flex;
    align-items:center;
    gap:4px;
}

.review-icon{
    width:13px;
    height:13px;
    display:block;
    mask-size:contain;
    mask-repeat:no-repeat;
    mask-position:center;
    -webkit-mask-size:contain;
    -webkit-mask-repeat:no-repeat;
    -webkit-mask-position:center;
}

.review-icon.good{
    background:var(--primary);
    mask-image:url("/img/vote/up.svg");
    -webkit-mask-image:url("/img/vote/up.svg");
}

.review-icon.bad{
    background:#d9534f;
    mask-image:url("/img/vote/down.svg");
    -webkit-mask-image:url("/img/vote/down.svg");
}

.buy-button.loading{
    background:#9FBF6B;
    border-color:#8AA85C;
    pointer-events:none;
    position:relative;
    color:transparent;
}

.buy-button.loading::after{
    content:".";
    color:#fff;
    font-weight:bold;
    font-size:40px;
    line-height:1;
    position:absolute;
    inset:0;
    display:flex;
    align-items:center;
    justify-content:center;
    text-shadow:-12px 0 0 #fff, 12px 0 0 #fff;
    transform:translateY(-12px);
    animation:digiload 1s infinite;
}

@keyframes digiload{
    0%{opacity:.2}
    50%{opacity:1}
    100%{opacity:.2}
}

.review-comment{
    margin-top:10px;
    padding:10px 12px;
    background:var(--callout);
    border-left:3px solid var(--primary);
    font-size:14px;
    overflow-wrap:anywhere;
    word-break:break-word;
}

.review-comment-header{
    margin-bottom:4px;
    color:#666;
    font-size:12px;
    font-weight:700;
}

.review-comment-date{
    color:#999;
    font-weight:400;
}

.product-desc,
.notice,
.notice-yellow,
.notice-green,
.info-card{
    overflow-wrap:break-word;
}

.price.loading{
    visibility:hidden;
}

.top-btn,
.home-btn,
.header-buy,
.buy-btn,
.buy-button,
.qty-btn,
.page-btn{
    user-select:none;
    -webkit-user-select:none;
}

.page-error-main{
    position:relative;
    z-index:2;
    flex:1 1 auto;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow:hidden;
    padding:48px 20px 64px;
    text-align:center;
}

.page-error-glow{
    position:absolute;
    border-radius:50%;
    pointer-events:none;
    filter:blur(72px);
}

.page-error-glow-left{
    top:80px;
    left:-80px;
    width:280px;
    height:280px;
    background:color-mix(in srgb,var(--primary) 12%,transparent);
}

.page-error-glow-right{
    right:-60px;
    bottom:40px;
    width:320px;
    height:320px;
    background:color-mix(in srgb,var(--accent) 16%,transparent);
}

.page-error-inner{
    position:relative;
    max-width:640px;
}

.page-error-code{
    margin:0;
    user-select:none;
    -webkit-user-select:none;
    font-size:clamp(7rem,22vw,11rem);
    font-weight:700;
    line-height:.9;
    letter-spacing:-.06em;
    color:var(--primary);
    opacity:.15;
}

.page-error-copy{
    margin-top:-40px;
}

.page-error-copy h1{
    margin:0 0 12px;
    font-size:32px;
    font-weight:700;
    color:var(--text);
}

.page-error-copy p{
    margin:0 auto 28px;
    max-width:420px;
    color:var(--muted);
    line-height:1.7;
    font-size:18px;
}

.page-error-copy .home-btn{
    height:auto;
    padding:14px 32px;
    background:var(--primary);
    color:#fff;
    border:none;
    border-radius:999px;
    font-weight:600;
    font-size:16px;
    gap:8px;
}

.page-error-copy .home-btn svg{
    width:20px;
    height:20px;
}

.page-error-copy .home-btn:hover{
    background:var(--primary-hover);
    color:#fff;
}

@media (max-width:1025px){
    .page-title{
        width:100%;
        font-size:26px;
    }

    .product-layout{
        grid-template-columns:1fr;
        grid-template-areas:
            "title"
            "panel"
            "main";
        column-gap:14px;
        row-gap:12px;
    }

    .buy-col{
        width:100%;
    }

    .pay-methods{
        display:none;
    }

    .buy-col:has(.buy-panel:not(.loaded)){
        display:none;
    }

    .buy-panel{
        width:100%;
        flex:none;
    }

    .buy-panel:not(.loaded){
        display:none;
    }

    .product-main{
        width:100%;
        flex:none;
    }

    .image-viewer{
        height:auto;
        min-height:200px;
    }
}

@media (min-width:981px) and (max-width:1199px){
    .footer{
        padding-bottom:80px;
    }
}

@media (min-width:901px) and (min-height:1100px){
    .main-home{
        flex:1 1 auto;
        justify-content:center;
    }
}

@media (min-width:2200px){
    body:has(.main-home)::before{
        width:min(1440px,100%);
    }

    body:has(.main-home) .topbar-inner{
        max-width:1360px;
    }

    .hero-wrap{
        max-width:1360px;
    }

    .product-card{
        max-width:1240px;
        padding:36px;
        gap:40px;
    }

    .product-image{
        width:300px;
    }
}

@media (min-width:3000px){
    body:has(.main-home)::before{
        width:min(1680px,100%);
    }

    body:has(.main-home) .topbar-inner{
        max-width:1600px;
    }

    .hero-wrap{
        max-width:1600px;
    }

    .product-card{
        max-width:1480px;
        padding:44px;
        gap:48px;
    }

    .product-image{
        width:340px;
    }
}

@media (max-width:980px){
    .footer{
        min-height:0;
        padding:28px 20px 56px;
    }

    .footer-links{
        flex-direction:column;
        align-items:center;
        gap:18px;
    }

    .footer-links a,
    .footer a{
        display:block;
        margin:0;
    }
}

@media (max-width:900px){
    .brand{
        display:none;
    }

    .breadcrumbs::before{
        display:none;
    }

    .breadcrumbs{
        font-size:13px;
        gap:6px;
    }

    .breadcrumbs a,
    .breadcrumbs .current:first-child{
        font-size:16px;
    }

    .header-left{
        gap:10px;
    }

    .topbar-inner,
    .header-inner{
        min-height:64px;
        padding:12px 16px;
        flex-wrap:wrap;
    }

    .product-card{
        flex-direction:column;
        gap:20px;
        padding:20px;
        margin:0 16px;
    }

    .hero-wrap{
        padding:16px 0 28px;
    }

    .product-image img{
        margin-top:8px;
    }

    .content{
        padding:12px 16px 24px;
    }

    .main{
        padding:16px 16px 24px;
    }

    .product-image{
        width:100%;
        max-width:260px;
        margin:0 auto;
    }

    .bottom-row{
        justify-content:space-between;
        flex-wrap:nowrap;
        gap:10px;
    }

    .product-title{
        font-size:18px;
        text-align:center;
        margin-top:0;
    }

    .content-card{
        margin:0;
        padding:24px;
    }

    .content-card h1{
        font-size:22px;
    }

    .content-card p{
        font-size:16px;
    }

    .header-right > a.top-btn{
        display:none;
    }

    body:has(.main-home) .header-right > a.top-btn,
    body:has(.product-layout) .header-right > a.top-btn{
        display:inline-flex;
        width:34px;
        padding:0;
    }

    .top-btn{
        height:34px;
        padding:0 10px;
    }

    .theme-toggle,
    .lang-toggle{
        width:34px;
        padding:0;
    }

    .top-btn span,
    .top-btn .lang-text{
        display:none;
    }

    .home-btn span{
        display:inline;
    }

    .header-buy{
        height:34px;
        padding:0 12px;
        font-size:13px;
    }

    .page-title{
        width:100%;
        font-size:18px;
    }
}

@media (max-width:768px){
    .product-desc,
    .notice,
    .more-link{
        display:none;
    }

    .product-title{
        font-size:16px;
        text-align:left;
        margin-top:15px;
    }

    .product-card{
        padding:18px;
    }
}

@media (max-width:700px){
    .page-error-copy h1{
        font-size:24px;
    }

    .page-error-copy p{
        font-size:16px;
    }

    .page-error-copy{
        margin-top:-28px;
    }
}

.cookie-banner{
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    z-index:40;
    display:none;
    width:100%;
    border:none;
    border-top:1px solid var(--border);
    border-radius:0;
    background:var(--header-bg);
    padding:4px 16px;
    box-sizing:border-box;
    backdrop-filter:blur(12px);
    user-select:none;
    -webkit-user-select:none;
}

.cookie-banner.show{
    display:block;
}

.cookie-banner-inner{
    max-width:1120px;
    margin:0 auto;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:12px;
}

.cookie-banner p{
    margin:0;
    min-width:0;
    font-size:13px;
    line-height:1.3;
    text-align:center;
    color:var(--text-secondary);
    user-select:none;
    -webkit-user-select:none;
}

.cookie-accept{
    flex-shrink:0;
    height:24px;
    padding:0 16px;
    border:none;
    border-radius:999px;
    background:#2C8C69;
    color:#fff;
    font:500 13px Inter,system-ui,sans-serif;
    cursor:pointer;
    white-space:nowrap;
}

.cookie-accept:hover{
    background:#24785A;
}

@media (max-width:980px){
    html.cookie-open #vs-chat-btn{
        bottom:calc(10px + var(--cookie-h));
    }

    .cookie-banner p{
        font-size:12px;
    }
}
