@font-face {
    font-family: ManaYB;
    src: url('/fonts/yb.woff2') format('woff2');
    font-display: swap;
}

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    background: #f3f5fa;
    color: #111827;
    font-family: ManaYB, Tahoma, Arial, sans-serif;
}

.site-header {
    min-height: 68px;
    padding: 0 5vw;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #fff;
    border-bottom: 1px solid #e5e7eb;
    position: sticky;
    top: 0;
    z-index: 50;
}

.logo {
    font-size: 22px;
    font-weight: 900;
    text-decoration: none;
    color: #5b42e8;
}

.site-header nav {
    display: flex;
    align-items: center;
    gap: 18px;
}

.site-header nav a,
.link-button {
    color: #334155;
    text-decoration: none;
    border: 0;
    background: none;
    font: inherit;
    cursor: pointer;
}

.site-header form {
    margin: 0;
}

.site-main {
    max-width: 1280px;
    margin: 0 auto;
    padding: 36px 5vw;
}

.hero {
    padding: 80px 0;
    max-width: 900px;
}

.hero h1 {
    font-size: clamp(42px, 7vw, 88px);
    line-height: 1.1;
    margin: 12px 0;
}

.hero p {
    font-size: 20px;
    line-height: 2;
    color: #475569;
}

.eyebrow {
    background: #ede9fe;
    color: #5b21b6;
    padding: 7px 12px;
    border-radius: 99px;
    font-weight: 800;
}

.button,
.small-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 12px;
    background: #6d5dfc;
    color: #fff;
    padding: 11px 17px;
    text-decoration: none;
    font: inherit;
    cursor: pointer;
    font-weight: 800;
}

.small-button {
    padding: 8px 11px;
    font-size: 13px;
}

.button.secondary {
    background: #fff;
    color: #4f46e5;
    border: 1px solid #c7d2fe;
}

.actions {
    display: flex;
    gap: 9px;
    flex-wrap: wrap;
    align-items: center;
}

.actions form {
    margin: 0;
}

.page-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 22px;
}

.page-head h1 {
    margin: 0;
}

.cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 16px;
}

.cards.one {
    grid-template-columns: 1fr;
}

.card,
.auth-card,
.product-detail,
.comments {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 20px;
    padding: 22px;
    box-shadow: 0 12px 35px rgba(15, 23, 42, 0.05);
}

.split {
    display: grid;
    grid-template-columns: minmax(300px, 420px) 1fr;
    gap: 20px;
}

.form-card,
.auth-card {
    display: grid;
    gap: 14px;
}

.form-card label,
.auth-card label {
    display: grid;
    gap: 6px;
    font-weight: 700;
}

.form-card input,
.form-card textarea,
.form-card select,
.auth-card input {
    width: 100%;
    border: 1px solid #cbd5e1;
    border-radius: 11px;
    padding: 11px;
    font: inherit;
}

.check {
    display: flex !important;
    grid-template-columns: auto 1fr !important;
    align-items: center;
    justify-content: flex-start;
}

.check input {
    width: auto !important;
}

.auth-card {
    max-width: 480px;
    margin: 45px auto;
}

.error {
    background: #fee2e2;
    color: #991b1b;
    border-radius: 10px;
    padding: 10px;
}

.success {
    background: #dcfce7;
    color: #166534;
    border-radius: 10px;
    padding: 10px;
}

.product-row {
    display: grid;
    grid-template-columns: 150px 1fr;
    gap: 16px;
}

.product-row img {
    width: 150px;
    height: 130px;
    object-fit: cover;
    border-radius: 14px;
}

.product-admin-content {
    min-width: 0;
}

.admin-details {
    margin: 14px 0;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    overflow: hidden;
}

.admin-details > summary {
    cursor: pointer;
    padding: 12px 14px;
    font-weight: 900;
    background: #f8fafc;
}

.compact-form {
    padding: 14px;
}

.comment-admin {
    margin: 12px;
    padding: 13px;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
}

.comment-admin.pending {
    background: #fff7ed;
    border-color: #fed7aa;
}

.comment-admin.approved {
    background: #f0fdf4;
    border-color: #bbf7d0;
}

.danger-button {
    border: 0;
    background: #fee2e2;
    color: #b91c1c;
    border-radius: 9px;
    padding: 8px 11px;
    margin-top: 10px;
    cursor: pointer;
    font: inherit;
}

.product-detail,
.comments {
    max-width: 900px;
    margin: 0 auto 20px;
}

.product-detail > img {
    width: 100%;
    max-height: 560px;
    object-fit: cover;
    border-radius: 16px;
}

.product-price {
    font-size: 28px;
    font-weight: 900;
    margin: 14px 0;
}

.product-description {
    line-height: 2;
    white-space: pre-wrap;
}

.comment {
    padding: 13px 0;
    border-bottom: 1px solid #e2e8f0;
}

@media (max-width: 800px) {
    .site-header {
        height: auto;
        padding: 14px;
        align-items: flex-start;
    }

    .site-header nav {
        gap: 9px;
        flex-wrap: wrap;
    }

    .split {
        grid-template-columns: 1fr;
    }

    .product-row {
        grid-template-columns: 1fr;
    }

    .product-row img {
        width: 100%;
        height: 220px;
    }

    .page-head {
        align-items: flex-start;
        flex-direction: column;
    }
}

.subdomain-input {
    display: flex;
    align-items: stretch;
    width: 100%;
    overflow: hidden;
    border: 1px solid #d8deea;
    border-radius: 10px;
    background: #fff;
}

.subdomain-input input {
    min-width: 0;
    flex: 1;
    border: 0 !important;
    border-radius: 0 !important;
    direction: ltr;
    text-align: left;
}

.subdomain-input span {
    display: inline-flex;
    align-items: center;
    padding: 0 12px;
    border-inline-start: 1px solid #d8deea;
    background: #f3f5f9;
    color: #536078;
    white-space: nowrap;
}

.availability-success {
    color: #087f5b;
}

.availability-error {
    color: #c92a2a;
}

.muted-text {
    color: #6b7280;
}

.project-overview-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 18px;
    align-items: center;
}

.project-domain {
    margin-block: 8px;
    overflow-wrap: anywhere;
}

.status-badge {
    display: inline-flex;
    width: max-content;
    padding: 4px 9px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
}

.status-badge.published {
    background: #d3f9d8;
    color: #146c2e;
}

.status-badge.draft {
    background: #fff3bf;
    color: #8a5d00;
}

.inline-subdomain-form {
    display: grid;
    gap: 8px;
    max-width: 520px;
}

.project-actions-wrap {
    align-items: center;
}

.button.success {
    background: #087f5b;
}

.button.danger {
    background: #c92a2a;
}

@media (max-width: 760px) {
    .project-overview-card {
        grid-template-columns: 1fr;
    }
}

/* v10.2 — keep every management and public page inside the viewport */
html,body{max-width:100%;overflow-x:hidden}
.site-header,.site-main,.page-head,.cards,.card,.auth-card,.product-detail,.comments,.split,.product-row{min-width:0;max-width:100%}
img,video,iframe,table,pre,code{max-width:100%}
pre,code{white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word}
.site-header nav,.actions,.page-head{flex-wrap:wrap}
.form-card input,.form-card textarea,.form-card select,.auth-card input{min-width:0}
@media(max-width:760px){
 .site-header{padding:10px 4vw;gap:10px;flex-wrap:wrap}.site-header nav{gap:10px}
 .site-main{padding:24px 4vw}.split,.product-row{grid-template-columns:1fr}.product-row img{width:100%;height:auto;max-height:280px}
 .page-head{align-items:flex-start}.page-head>*{min-width:0}
}

/* v10.5 — unified management, commerce and role-based access */
.management-head,.section-head,.project-title-line{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.management-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 20px;padding:8px;border:1px solid #e2e8f0;border-radius:16px;background:#fff}
.management-tabs a{padding:10px 14px;border-radius:11px;color:#475569;text-decoration:none;font-weight:750}
.management-tabs a:hover,.management-tabs a.active{background:#ede9fe;color:#5b21b6}
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin-bottom:18px}
.stat-card{display:grid;gap:5px;padding:20px;border:1px solid #e2e8f0;border-radius:18px;background:linear-gradient(145deg,#fff,#f8fafc);box-shadow:0 10px 28px rgba(15,23,42,.05)}
.stat-card strong{font-size:30px;color:#5b21b6}.stat-card span{color:#64748b}
.management-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start}.product-management-grid{grid-template-columns:minmax(0,1.4fr) minmax(270px,.6fr)}
.stack-form{display:grid;gap:14px}.stack-form label,.inline-manage-form label{display:grid;gap:7px;font-weight:700;color:#334155}
.stack-form input,.stack-form textarea,.stack-form select,.inline-manage-form input,.inline-manage-form select{width:100%;min-width:0;padding:11px 12px;border:1px solid #cbd5e1;border-radius:11px;background:#fff;font:inherit;color:#0f172a}
.form-grid{display:grid;gap:12px}.form-grid.two-columns{grid-template-columns:repeat(2,minmax(0,1fr))}
.permission-grid,.settings-switches{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.compact-switches{grid-template-columns:repeat(2,minmax(180px,1fr))}
.permission-check,.setting-switch{display:flex!important;align-items:center!important;grid-template-columns:none!important;gap:9px!important;padding:11px 12px;border:1px solid #e2e8f0;border-radius:12px;background:#f8fafc;font-weight:650!important;cursor:pointer}
.permission-check input,.setting-switch input{width:18px!important;height:18px;margin:0;accent-color:#6d28d9}
.role-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:13px}.role-card{padding:16px;border:1px solid #e2e8f0;border-radius:15px;background:#fff}.role-card small{display:block;color:#64748b;direction:ltr;text-align:left}.role-card ul{margin:12px 0;padding-inline-start:20px;color:#475569}
.admin-table-wrap{width:100%;overflow-x:hidden}.admin-table{width:100%;border-collapse:collapse;table-layout:auto}.admin-table th,.admin-table td{padding:12px;border-bottom:1px solid #e2e8f0;text-align:start;vertical-align:top;overflow-wrap:anywhere}.admin-table th{background:#f8fafc;color:#475569}.admin-table small{display:block;color:#64748b}
.inline-manage-form{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.inline-manage-form select{width:auto;max-width:240px}.inline-manage-form .button{padding:9px 12px}
.submission-card{margin:10px 0;border:1px solid #e2e8f0;border-radius:14px;background:#fff;overflow:hidden}.submission-card summary{display:flex;justify-content:space-between;gap:12px;padding:15px;cursor:pointer;background:#f8fafc}.submission-card summary div{display:grid;gap:3px}.submission-body{display:grid;gap:10px;padding:15px}.answer-row{display:grid;grid-template-columns:minmax(110px,.35fr) minmax(0,1fr);gap:12px;padding:10px;border-radius:10px;background:#f8fafc}.answer-row span{overflow-wrap:anywhere;white-space:pre-wrap}
.product-admin-list{display:grid;gap:16px}.product-admin-card{display:grid;gap:14px;padding:17px;border:1px solid #e2e8f0;border-radius:18px;background:#fff}.product-admin-summary{display:flex;align-items:center;gap:15px;min-width:0}.product-admin-summary img{width:90px;height:90px;object-fit:cover;border-radius:14px}.product-admin-summary h3{margin:0 0 5px}.product-admin-summary p,.product-admin-summary small{margin:0;color:#64748b}.wrap-actions{flex-wrap:wrap}.admin-details{border-top:1px solid #e2e8f0;padding-top:12px}.admin-details summary{cursor:pointer;font-weight:750;color:#5b21b6}
.comment-admin{margin:12px 0;padding:13px;border-radius:12px;border-inline-start:4px solid #f59e0b;background:#fffbeb}.comment-admin.approved{border-inline-start-color:#10b981;background:#ecfdf5}.comment-admin p{white-space:pre-wrap;overflow-wrap:anywhere}
.feature-list{display:grid;gap:10px;padding-inline-start:22px;color:#475569}.product-help-card{position:sticky;top:18px}.project-picker-card{margin-bottom:18px}.status-badge.owner{background:#ede9fe;color:#5b21b6}.status-badge.member{background:#e0f2fe;color:#0369a1}
.product-category{display:inline-flex;padding:5px 10px;border-radius:999px;background:#ede9fe;color:#5b21b6;font-weight:750}.product-price-row{display:flex;align-items:center;gap:10px;font-size:25px}.product-price-row del{font-size:15px;color:#94a3b8}.stock-state{font-weight:700;color:#0f766e}.add-cart-form{display:flex;align-items:end;gap:10px;flex-wrap:wrap}.add-cart-form label{display:grid;gap:5px}.add-cart-form input{width:90px;padding:10px;border:1px solid #cbd5e1;border-radius:10px}
.site-toast-host{position:fixed;z-index:2147483000;inset-block-start:18px;inset-inline-end:18px;display:grid;gap:10px;width:min(360px,calc(100vw - 32px));pointer-events:none}.site-toast{padding:13px 15px;border-radius:13px;background:#0f172a;color:#fff;box-shadow:0 18px 45px rgba(15,23,42,.24);font-weight:700;animation:siteToastIn .2s ease}.site-toast.success{background:#047857}.site-toast.error{background:#b91c1c}@keyframes siteToastIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.success-message{padding:12px 14px;border-radius:12px;background:#dcfce7;color:#166534}.hint,.empty-state{color:#64748b}.button:disabled{opacity:.62;cursor:wait}
@media(max-width:900px){.management-grid,.product-management-grid{grid-template-columns:1fr}.product-help-card{position:static}}
@media(max-width:680px){.form-grid.two-columns,.permission-grid,.settings-switches,.compact-switches{grid-template-columns:1fr}.admin-table,.admin-table tbody,.admin-table tr,.admin-table td{display:block;width:100%}.admin-table thead{display:none}.admin-table tr{padding:10px 0;border-bottom:1px solid #e2e8f0}.admin-table td{border:0;padding:6px 0}.answer-row{grid-template-columns:1fr}.submission-card summary{display:grid}.product-admin-summary{align-items:flex-start}.product-admin-summary img{width:72px;height:72px}.site-toast-host{inset-inline:16px;width:auto}}

.submission-attachments{display:flex;flex-wrap:wrap;align-items:center;gap:.55rem;margin:1rem 0;padding:.85rem;border-radius:16px;background:var(--surface-soft,#f6f8fc)}
.attachment-link{display:inline-flex;align-items:center;max-width:100%;padding:.55rem .75rem;border-radius:12px;background:#fff;border:1px solid #dce3ef;overflow-wrap:anywhere;text-decoration:none}
.attachment-link:hover{border-color:#6c5ce7;box-shadow:0 6px 18px rgba(30,39,70,.08)}
.submission-actions{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:14px}.submission-actions form{margin:0}

/* Public storefront */
.public-site-header{position:sticky;top:0;z-index:5000;display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:68px;padding:12px clamp(16px,4vw,64px);background:rgba(255,255,255,.94);border-bottom:1px solid #e5e7eb;backdrop-filter:blur(16px)}
.public-site-brand{font-size:1.15rem;font-weight:900;color:#111827;text-decoration:none}.public-site-header nav{display:flex;align-items:center;flex-wrap:wrap;gap:8px}.public-site-header nav>a,.public-link-button{border:0;background:transparent;color:#334155;text-decoration:none;font:inherit;font-weight:700;padding:8px 10px;border-radius:10px;cursor:pointer}.public-site-header nav>a:hover,.public-link-button:hover{background:#eef2ff;color:#4f46e5}.public-site-header form{margin:0}.public-site-main{width:min(1180px,calc(100% - 28px));margin:0 auto;padding:28px 0 64px;min-width:0}.store-products-head{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:22px}.store-products-head h1{margin:0 0 4px}.store-products-head p{margin:0;color:#64748b}.store-product-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(250px,100%),1fr));gap:20px}.store-product-card{overflow:hidden;background:#fff;border:1px solid #e5e7eb;border-radius:20px;box-shadow:0 12px 34px rgba(15,23,42,.08)}.store-product-image{display:grid;place-items:center;aspect-ratio:4/3;background:linear-gradient(135deg,#f8fafc,#eef2ff);color:#94a3b8;text-decoration:none}.store-product-image img{width:100%;height:100%;object-fit:cover}.store-product-content{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:18px}.store-product-content h2{font-size:1.08rem;margin:0}.store-product-content h2 a{color:#111827;text-decoration:none}.store-product-content small{color:#6366f1;font-weight:800}.store-product-content .button{margin-top:auto}.store-empty{text-align:center;padding:42px}
@media(max-width:640px){.public-site-header{position:relative;align-items:flex-start;flex-direction:column;padding:14px 16px}.public-site-header nav{width:100%}.public-site-main{width:min(100% - 20px,1180px);padding-top:18px}}