/* =========================================================
   APLIKACJA ZADANIA — NOWY FRONTEND
   Podmień obecny style.css tym plikiem
   ========================================================= */

:root {
    --bg: #f4f7ff;
    --surface: #ffffff;
    --surface-soft: #f8faff;
    --text: #172033;
    --muted: #758097;
    --line: #e8edf7;

    --primary: #6457f5;
    --primary-2: #7d72ff;
    --primary-dark: #5044df;
    --primary-soft: #efedff;

    --cyan: #29b6d8;
    --green: #24b47e;
    --green-soft: #eaf9f2;
    --red: #ef5b67;
    --red-soft: #fff0f1;
    --orange: #ff9f43;
    --yellow: #ffc94a;

    --shadow-sm: 0 8px 24px rgba(42, 55, 95, .07);
    --shadow-md: 0 16px 42px rgba(42, 55, 95, .12);
    --shadow-lg: 0 24px 70px rgba(42, 55, 95, .16);

    --radius-sm: 14px;
    --radius: 20px;
    --radius-lg: 28px;
}

* {
    box-sizing: border-box;
}

html {
    min-height: 100%;
}

body {
    margin: 0;
    min-height: 100vh;
    color: var(--text);
    font-family:
        Inter,
        ui-rounded,
        "SF Pro Rounded",
        "Segoe UI",
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        sans-serif;
    background:
        radial-gradient(circle at 10% 0%, rgba(100, 87, 245, .11), transparent 28%),
        radial-gradient(circle at 92% 9%, rgba(41, 182, 216, .10), transparent 24%),
        linear-gradient(180deg, #f8faff 0%, var(--bg) 100%);
    -webkit-font-smoothing: antialiased;
}

button,
input,
select,
textarea {
    font: inherit;
}

a {
    color: inherit;
}

::selection {
    background: #dcd8ff;
}

/* =========================================================
   GLOBAL
   ========================================================= */

.panel {
    width: 1160px;
    max-width: calc(100% - 36px);
    margin: 34px auto 70px;
}

.top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 26px;
}

.top h1 {
    margin: 0;
    font-size: clamp(30px, 4vw, 44px);
    line-height: 1.05;
    letter-spacing: -1.5px;
}

.subtitle,
.description,
.profile-description,
.result-description {
    color: var(--muted);
}

.subtitle {
    margin: 9px 0 0;
    font-size: 15px;
}

.top-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 9px;
}

.logout,
.back-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 15px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: rgba(255,255,255,.76);
    color: #536078;
    text-decoration: none;
    font-weight: 700;
    font-size: 13px;
    box-shadow: 0 3px 10px rgba(42,55,95,.035);
    transition: .18s ease;
}

.logout:hover,
.back-link:hover {
    border-color: #d9dff0;
    color: var(--primary);
    background: #fff;
    transform: translateY(-1px);
}

.section-title {
    margin: 31px 0 17px;
    font-size: 24px;
    letter-spacing: -.6px;
}

.primary-action,
.secondary-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 50px;
    padding: 0 21px;
    border-radius: 15px;
    text-decoration: none;
    font-weight: 850;
    font-size: 14px;
    transition: .18s ease;
}

.primary-action {
    color: white;
    background: linear-gradient(135deg, var(--primary), var(--primary-2));
    box-shadow: 0 10px 22px rgba(100,87,245,.24);
}

.primary-action:hover {
    transform: translateY(-2px);
    box-shadow: 0 14px 28px rgba(100,87,245,.30);
}

.secondary-action {
    color: #536078;
    background: #f1f4fa;
    border: 1px solid var(--line);
}

.secondary-action:hover {
    color: var(--text);
    background: #e9edf6;
}

.small-link {
    color: var(--primary);
    text-decoration: none;
    font-size: 13px;
    font-weight: 850;
}

.small-link:hover {
    text-decoration: underline;
}

/* =========================================================
   LOGIN
   ========================================================= */

.login-box {
    position: relative;
    overflow: hidden;
    width: 470px;
    max-width: calc(100% - 30px);
    margin: min(14vh, 125px) auto 50px;
    padding: 48px 44px 42px;
    background: rgba(255,255,255,.95);
    border: 1px solid rgba(224,229,241,.88);
    border-radius: 30px;
    box-shadow: var(--shadow-lg);
    text-align: center;
}

.login-box::before {
    content: "";
    position: absolute;
    width: 210px;
    height: 210px;
    top: -130px;
    left: -70px;
    border-radius: 50%;
    background: rgba(100,87,245,.13);
}

.login-box::after {
    content: "✦";
    position: absolute;
    top: 23px;
    right: 27px;
    color: var(--primary);
    font-size: 25px;
    opacity: .55;
}

.login-box h1 {
    position: relative;
    margin: 0 0 10px;
    font-size: 35px;
    letter-spacing: -1px;
}

.description {
    position: relative;
    margin: 0 0 28px;
    line-height: 1.55;
}

.login-box input,
.profile-form input {
    width: 100%;
    min-height: 58px;
    padding: 0 18px;
    border: 2px solid #e5eaf4;
    border-radius: 16px;
    background: #fbfcff;
    color: var(--text);
    outline: none;
    transition: .18s ease;
}

.login-box input {
    font-size: 20px;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: 750;
}

.login-box input[type="password"] {
    text-transform: none;
    letter-spacing: 0;
}

.login-box input:focus,
.profile-form input:focus {
    border-color: var(--primary);
    background: #fff;
    box-shadow: 0 0 0 5px rgba(100,87,245,.09);
}

.login-box button,
.profile-form button {
    width: 100%;
    min-height: 58px;
    margin-top: 13px;
    border: 0;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--primary), var(--primary-2));
    color: white;
    font-size: 16px;
    font-weight: 850;
    cursor: pointer;
    box-shadow: 0 12px 26px rgba(100,87,245,.25);
    transition: .18s ease;
}

.login-box button:hover,
.profile-form button:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 32px rgba(100,87,245,.31);
}

.error,
.success-box {
    margin: 0 0 19px;
    padding: 13px 15px;
    border-radius: 14px;
    font-size: 14px;
    font-weight: 700;
}

.error {
    color: #b83542;
    background: var(--red-soft);
    border: 1px solid #ffd9dd;
}

.success-box {
    color: #167653;
    background: var(--green-soft);
    border: 1px solid #ccefe0;
}

/* =========================================================
   DASHBOARD / STATS
   ========================================================= */

.stats-bar,
.stats-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 13px;
    margin-bottom: 18px;
}

.stats-bar > div,
.stat-card {
    position: relative;
    overflow: hidden;
    padding: 19px 18px;
    border: 1px solid rgba(226,231,242,.92);
    border-radius: 18px;
    background: rgba(255,255,255,.94);
    box-shadow: var(--shadow-sm);
    text-align: center;
}

.stats-bar > div::after,
.stat-card::after {
    content: "";
    position: absolute;
    width: 55px;
    height: 55px;
    right: -17px;
    bottom: -20px;
    border-radius: 50%;
    background: rgba(100,87,245,.055);
}

.stats-bar strong,
.stat-card strong {
    display: block;
    margin-bottom: 3px;
    font-size: 28px;
    line-height: 1;
    letter-spacing: -.8px;
}

.stats-bar span,
.stat-card span {
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}



.player-main {
    display: flex;
    align-items: center;
    gap: 15px;
}





.player-main strong {
    display: block;
    font-size: 20px;
    letter-spacing: -.35px;
}

.player-main small {
    display: block;
    margin-top: 4px;
    color: var(--muted);
    font-size: 12px;
}









.grade-tabs {
    display: flex;
    gap: 9px;
    margin: 22px 0;
    padding: 5px;
    width: fit-content;
    max-width: 100%;
    border: 1px solid #e3e8f3;
    border-radius: 16px;
    background: rgba(235,239,248,.82);
}

.grade-tab {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 43px;
    padding: 0 20px;
    border-radius: 12px;
    color: #69758c;
    text-decoration: none;
    font-size: 13px;
    font-weight: 850;
    transition: .18s ease;
}

.grade-tab:hover {
    color: var(--primary);
    background: rgba(255,255,255,.7);
}

.grade-tab.active {
    color: white;
    background: linear-gradient(135deg, var(--primary), var(--primary-2));
    box-shadow: 0 7px 17px rgba(100,87,245,.22);
}

/* =========================================================
   OPTIONAL FEATURE BANNER
   ========================================================= */

















/* =========================================================
   TASK CARDS
   ========================================================= */

.tasks {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

.task-card {
    position: relative;
    overflow: hidden;
    display: block;
    min-height: 188px;
    padding: 22px;
    border: 1px solid #e7ebf4;
    border-radius: 22px;
    background: rgba(255,255,255,.96);
    color: var(--text);
    text-decoration: none;
    box-shadow: 0 8px 26px rgba(42,55,95,.065);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.task-card::after {
    content: "";
    position: absolute;
    width: 95px;
    height: 95px;
    right: -38px;
    bottom: -42px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(100,87,245,.08), rgba(41,182,216,.05));
    transition: transform .2s ease;
}

.task-card:hover {
    transform: translateY(-5px);
    border-color: #dcd7ff;
    box-shadow: 0 18px 38px rgba(42,55,95,.12);
}

.task-card:hover::after {
    transform: scale(1.3);
}

.task-card-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.task-icon {
    display: flex;
    width: 50px;
    height: 50px;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: linear-gradient(145deg, #f0edff, #faf9ff);
    box-shadow: inset 0 0 0 1px #e7e2ff;
    font-size: 27px;
}

.category-badge,
.exercise-category {
    display: inline-flex;
    align-items: center;
    min-height: 27px;
    padding: 0 10px;
    border-radius: 999px;
    color: #5f54cf;
    background: #efedff;
    font-size: 10px;
    font-weight: 850;
}

.task-card h2 {
    margin: 18px 0 7px;
    font-size: 19px;
    line-height: 1.25;
    letter-spacing: -.3px;
}

.task-card p {
    margin: 0;
    color: var(--muted);
    font-size: 13px;
    line-height: 1.55;
}

/* =========================================================
   COMPACT LISTS
   ========================================================= */





















.empty-state {
    padding: 16px;
    border-radius: 14px;
    color: var(--muted);
    background: #f6f8fc;
    text-align: center;
    font-size: 13px;
}

/* =========================================================
   EXERCISE
   ========================================================= */

.exercise-box {
    width: 760px;
    max-width: calc(100% - 36px);
    margin: 34px auto 70px;
    padding: 26px;
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    background: rgba(255,255,255,.96);
    box-shadow: var(--shadow-md);
}

.exercise-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-bottom: 23px;
}

.exercise-category {
    margin-bottom: 9px;
}



.round-info {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 20px;
    color: var(--muted);
    font-size: 12px;
    font-weight: 700;
}

.round-score {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 55px;
    min-height: 31px;
    padding: 0 10px;
    border-radius: 999px;
    color: #17845d;
    background: var(--green-soft);
    font-weight: 900;
}

.progress-track {
    width: 100%;
    height: 10px;
    margin: 9px 0 0;
    overflow: hidden;
    border-radius: 999px;
    background: #edf0f6;
}

.progress-fill {
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--primary), #8e82ff);
    box-shadow: 0 2px 8px rgba(100,87,245,.28);
    transition: width .3s ease;
}

.exercise-message {
    min-height: 33px;
    margin: 18px 0 5px;
    font-size: 17px;
    font-weight: 850;
}

.exercise-message.success {
    color: #16815a;
}

.exercise-message.wrong {
    color: #c34853;
}

.explanation {
    margin: 8px auto 15px;
    padding: 12px 15px;
    max-width: 560px;
    border: 1px solid #e3e6ff;
    border-radius: 13px;
    color: #546078;
    background: #f6f5ff;
    font-size: 13px;
    line-height: 1.5;
}

.equation {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 130px;
    margin: 16px auto 24px;
    padding: 22px;
    max-width: 610px;
    border: 1px solid #e8ecf5;
    border-radius: 21px;
    background:
        radial-gradient(circle at top right, rgba(100,87,245,.08), transparent 33%),
        #fafbfe;
    font-size: clamp(32px, 6vw, 48px);
    font-weight: 900;
    line-height: 1.25;
    letter-spacing: -.8px;
}

.answer-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 13px;
}

.answer-grid.two-answers {
    grid-template-columns: 1fr 1fr;
}

.answer-button {
    min-height: 72px;
    padding: 15px 14px;
    border: 2px solid #e5e9f3;
    border-bottom-width: 4px;
    border-radius: 18px;
    color: #3e4961;
    background: #fff;
    font-size: clamp(19px, 3vw, 25px);
    font-weight: 900;
    cursor: pointer;
    transition: .13s ease;
}

.answer-button:hover {
    border-color: #cfc9ff;
    color: var(--primary);
    background: #f9f8ff;
    transform: translateY(-2px);
    box-shadow: 0 8px 18px rgba(100,87,245,.10);
}

.answer-button:active {
    transform: translateY(1px);
    border-bottom-width: 2px;
}

/* =========================================================
   RESULTS
   ========================================================= */

.result-screen {
    padding: 10px 5px 4px;
}

.result-icon {
    display: flex;
    width: 90px;
    height: 90px;
    align-items: center;
    justify-content: center;
    margin: 8px auto 16px;
    border-radius: 28px;
    background: linear-gradient(145deg, #fff5d9, #fffaf0);
    box-shadow: inset 0 0 0 1px #f7e8bb;
    font-size: 46px;
}

.result-description {
    margin: 0 0 20px;
}

.result-score {
    font-size: 55px;
    font-weight: 950;
    line-height: 1;
    letter-spacing: -2px;
}

.result-score span {
    color: #a3aabd;
    font-size: 23px;
}

.result-percent {
    margin-top: 7px;
    color: var(--primary);
    font-size: 18px;
    font-weight: 900;
}

.result-details {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 11px;
    margin: 24px 0;
}

.result-details > div {
    padding: 15px;
    border-radius: 16px;
}

.result-good {
    color: #187655;
    background: var(--green-soft);
}

.result-bad {
    color: #b6404a;
    background: var(--red-soft);
}

.result-details strong {
    display: block;
    margin-bottom: 3px;
    font-size: 24px;
}

.result-details span {
    font-size: 12px;
    font-weight: 700;
}

.result-actions {
    display: flex;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
}

/* =========================================================
   EXTENDED RESULT SCREEN
   ========================================================= */






























.profile-link {
    color: var(--primary-dark);
    background: var(--primary-soft);
    border-radius: 999px;
    font-weight: 800;
}

/* =========================================================
   PROFILE
   ========================================================= */

.profile-box {
    width: 560px;
    text-align: left;
}

.profile-box h1 {
    text-align: center;
}

.profile-description {
    margin: 0 auto 23px;
    max-width: 440px;
    text-align: center;
    line-height: 1.55;
}

.profile-form {
    display: grid;
    gap: 4px;
}

.profile-form label {
    margin-bottom: 5px;
    color: #59647b;
    font-size: 12px;
    font-weight: 850;
}

.profile-form input {
    font-size: 16px;
    font-weight: 700;
}





/* =========================================================
   DATA TABLES
   ========================================================= */







.my-rank-card {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 10px;
    margin: 18px 0;
}

.my-rank-card-five {
    grid-template-columns: repeat(5, 1fr);
}

.my-rank-card > div {
    padding: 15px 12px;
    border: 1px solid #e7ebf4;
    border-radius: 16px;
    background: white;
    text-align: center;
    box-shadow: 0 7px 19px rgba(42,55,95,.045);
}

.my-rank-card span {
    display: block;
    margin-bottom: 4px;
    color: var(--muted);
    font-size: 10px;
    font-weight: 750;
}

.my-rank-card strong {
    font-size: 16px;
}



.table-box {
    overflow-x: auto;
    border: 1px solid #e5e9f3;
    border-radius: 20px;
    background: white;
    box-shadow: var(--shadow-sm);
}















/* =========================================================
   TIERS
   ========================================================= */











/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 920px) {
    .tasks {
        grid-template-columns: repeat(2, 1fr);
    }

    

    .my-rank-card-five {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 720px) {
    .panel {
        max-width: calc(100% - 24px);
        margin-top: 20px;
    }

    .top {
        flex-direction: column;
        align-items: stretch;
    }

    .top-links {
        justify-content: flex-start;
    }

    .stats-bar,
    .stats-grid {
        gap: 8px;
    }

    .stats-bar > div,
    .stat-card {
        padding: 15px 8px;
    }

    .stats-bar strong,
    .stat-card strong {
        font-size: 24px;
    }

    

    

    

    

    

    

    

    .exercise-header {
        margin-bottom: 19px;
    }

    .equation {
        min-height: 110px;
    }

    

    .my-rank-card,
    .my-rank-card-five {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 560px) {
    body {
        background:
            radial-gradient(circle at 10% 0%, rgba(100,87,245,.10), transparent 25%),
            #f5f7fc;
    }

    .login-box {
        margin-top: 35px;
        padding: 38px 22px 30px;
        border-radius: 24px;
    }

    .top h1 {
        font-size: 31px;
    }

    .stats-bar {
        grid-template-columns: repeat(3, 1fr);
    }

    .stats-bar span {
        font-size: 10px;
    }

    .grade-tabs {
        width: 100%;
    }

    .grade-tab {
        flex: 1;
        padding: 0 8px;
    }

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

    .task-card {
        min-height: 0;
    }

    

    

    

    .answer-grid,
    .answer-grid.two-answers {
        grid-template-columns: 1fr;
    }

    .answer-button {
        min-height: 62px;
    }

    .equation {
        padding: 18px 12px;
        font-size: 34px;
    }

    .result-details {
        gap: 8px;
    }

    .result-actions {
        flex-direction: column;
    }

    .result-actions .primary-action,
    .result-actions .secondary-action {
        width: 100%;
    }

    

    

    .my-rank-card,
    .my-rank-card-five {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 390px) {
    .panel {
        max-width: calc(100% - 18px);
    }

    .stats-bar strong {
        font-size: 21px;
    }

    

    

    .my-rank-card,
    .my-rank-card-five {
        grid-template-columns: 1fr;
    }
}

/* =========================================================
   Szczegółowe statystyki rodzica — przedmiot + poziom
   ========================================================= */
.activity-details-card {
    margin: 22px 0;
    padding: 24px;
    border-radius: 24px;
    background: rgba(255,255,255,.94);
    border: 1px solid rgba(100,87,245,.12);
    box-shadow: 0 16px 40px rgba(43,39,90,.08);
}
.activity-details-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}
.activity-details-header h3 { margin: 4px 0 0; }
.activity-details-header small { color: var(--muted, #74748a); }
.subject-stats-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}
.subject-stat-card {
    min-width: 0;
    overflow: hidden;
    border: 1px solid rgba(100,87,245,.12);
    border-radius: 18px;
    background: #fff;
}
.subject-stat-title {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 15px 16px;
    border-bottom: 1px solid #efeff7;
    font-size: 16px;
}
.subject-stat-title span { font-size: 22px; }
.subject-stat-head,
.subject-stat-row {
    display: grid;
    grid-template-columns: 1.05fr .85fr .85fr 1.15fr;
    align-items: center;
    gap: 6px;
    padding: 10px 12px;
}
.subject-stat-head {
    background: #f8f8fc;
    color: #88889b;
    font-size: 10px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .035em;
}
.subject-stat-row {
    border-top: 1px solid #f2f2f7;
    color: #69697c;
    font-size: 12px;
}
.subject-stat-row.has-activity {
    background: linear-gradient(90deg, rgba(100,87,245,.075), rgba(95,210,180,.05));
}
.subject-stat-row strong,
.subject-stat-row b { color: #29283a; }
.subject-stat-row small { color: #9695a7; }
.activity-note {
    margin: 16px 0 0;
    color: #77768b;
    font-size: 13px;
}
.stats-migration-note {
    grid-column: 1 / -1;
    margin-bottom: 12px;
    padding: 12px 14px;
    border-radius: 12px;
    background: #fff7df;
    border: 1px solid #f3dda0;
    color: #705b1e;
    font-size: 13px;
}
@media (max-width: 1050px) {
    .subject-stats-grid { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
    .activity-details-card { padding: 16px; border-radius: 18px; }
    .activity-details-header { align-items: flex-start; flex-direction: column; }
    .subject-stat-head, .subject-stat-row {
        grid-template-columns: .95fr .8fr .8fr 1.15fr;
        padding-left: 9px;
        padding-right: 9px;
        font-size: 11px;
    }
    .subject-stat-head { font-size: 9px; }
}

/* =========================================================
   Kompaktowe statystyki na panelu dziecka
   ========================================================= */
.quick-summary-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin: 18px 0 20px;
}
.quick-summary-card {
    padding: 14px;
    border: 1px solid rgba(226,231,242,.95);
    border-radius: 18px;
    background: rgba(255,255,255,.92);
    box-shadow: 0 8px 24px rgba(43,39,90,.055);
}
.quick-summary-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 10px;
}
.quick-summary-title > span {
    color: #55536a;
    font-size: 11px;
    font-weight: 900;
    letter-spacing: .08em;
}
.quick-summary-title small,
.quick-summary-title a {
    color: #8a899c;
    font-size: 11px;
    font-weight: 700;
}
.quick-summary-title a { color: #6457f5; text-decoration: none; }
.quick-summary-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 7px;
}
.quick-summary-metrics .metric {
    min-width: 0;
    padding: 9px 7px;
    border-radius: 12px;
    text-align: center;
    background: #f8f8fc;
}
.quick-summary-metrics .metric.good { background: #edf9f3; }
.quick-summary-metrics .metric.bad { background: #fff1f2; }
.quick-summary-metrics .metric.accuracy { background: #f1efff; }
.quick-summary-metrics .metric strong {
    display: block;
    margin-bottom: 2px;
    color: #2e2d3e;
    font-size: 20px;
    line-height: 1;
}
.quick-summary-metrics .metric.good strong { color: #18825b; }
.quick-summary-metrics .metric.bad strong { color: #c84554; }
.quick-summary-metrics .metric.accuracy strong { color: #6457f5; }
.quick-summary-metrics .metric span {
    color: #89889b;
    font-size: 9px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .025em;
}
.parent-link { white-space: nowrap; }

/* =========================================================
   Strona „Dla rodzica”
   ========================================================= */
.parent-page { max-width: 1240px; }
.parent-overview-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 16px;
    margin: 20px 0;
}
.parent-overview-card {
    padding: 20px;
    border: 1px solid #e8eaf3;
    border-radius: 22px;
    background: rgba(255,255,255,.96);
    box-shadow: 0 12px 32px rgba(43,39,90,.065);
}
.parent-overview-card.today-card { border-top: 3px solid rgba(100,87,245,.65); }
.parent-overview-card.all-card { border-top: 3px solid rgba(41,182,216,.65); }
.overview-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 15px;
}
.overview-heading h2 { margin: 3px 0 0; font-size: 18px; }
.overview-tests {
    padding: 7px 10px;
    border-radius: 999px;
    background: #f4f3fb;
    color: #706e86;
    font-size: 11px;
    font-weight: 800;
}
.overview-metrics {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 9px;
}
.overview-metric {
    padding: 13px 8px;
    border-radius: 15px;
    background: #f8f8fb;
    text-align: center;
}
.overview-metric.good { background: #ebf8f1; }
.overview-metric.bad { background: #fff0f1; }
.overview-metric.accuracy { background: #f0efff; }
.overview-metric strong { display:block; margin-bottom:4px; font-size:25px; color:#302f42; }
.overview-metric.good strong { color:#177b56; }
.overview-metric.bad strong { color:#c24351; }
.overview-metric.accuracy strong { color:#5f52e7; }
.overview-metric span { color:#88879a; font-size:10px; font-weight:800; text-transform:uppercase; }
.parent-detail-card { margin-top: 16px; }
.parent-subject-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
.mini-correct-wrong { display:flex; gap:5px; flex-wrap:wrap; }
.mini-correct-wrong em { font-style:normal; font-weight:800; font-size:10px; padding:3px 5px; border-radius:7px; }
.mini-good { color:#177b56; background:#e9f8f0; }
.mini-bad { color:#bd3e4c; background:#ffedef; }
.recent-activity-card {
    margin: 18px 0 28px;
    padding: 24px;
    border: 1px solid rgba(100,87,245,.12);
    border-radius: 24px;
    background: rgba(255,255,255,.94);
    box-shadow: 0 16px 40px rgba(43,39,90,.08);
}
.recent-list { display:flex; flex-direction:column; gap:7px; }
.recent-row {
    display:grid;
    grid-template-columns: 78px minmax(0,1fr) 70px;
    align-items:center;
    gap:14px;
    padding:11px 13px;
    border:1px solid #eeeef5;
    border-radius:14px;
    background:#fbfbfd;
}
.recent-time strong,.recent-time small,.recent-main strong,.recent-main span,.recent-score strong,.recent-score span { display:block; }
.recent-time strong { color:#333245; font-size:14px; }
.recent-time small,.recent-main span,.recent-score span { color:#9291a2; font-size:10px; font-weight:700; }
.recent-main strong { margin-bottom:3px; color:#343348; font-size:13px; }
.recent-score { text-align:right; }
.recent-score strong { color:#6457f5; font-size:19px; }

@media (max-width: 960px) {
    .parent-subject-grid { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
    .quick-summary-grid,
    .parent-overview-grid { grid-template-columns: 1fr; }
    .overview-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 520px) {
    .quick-summary-card { padding: 11px; }
    .quick-summary-metrics { gap: 5px; }
    .quick-summary-metrics .metric { padding: 8px 3px; }
    .quick-summary-metrics .metric strong { font-size: 17px; }
    .quick-summary-metrics .metric span { font-size: 8px; }
    .parent-overview-card,.recent-activity-card { padding: 16px; border-radius:18px; }
    .recent-row { grid-template-columns: 58px minmax(0,1fr) 52px; gap:9px; padding:10px; }
    .recent-score strong { font-size:16px; }
}

/* ===== DLA RODZICA: HISTORIA 365 DNI ===== */
.history-toolbar{display:flex;justify-content:space-between;gap:18px;align-items:flex-end;margin:22px 0;flex-wrap:wrap}.period-tabs{display:flex;gap:8px;flex-wrap:wrap}.period-tab{padding:10px 15px;border-radius:12px;background:#fff;border:1px solid #e7e8ee;color:#5a5d69;text-decoration:none;font-weight:700}.period-tab:hover,.period-tab.active{background:#6d5ce7;color:#fff;border-color:#6d5ce7}.date-picker-form{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.date-picker-form label{font-size:13px;font-weight:700;color:#777b89}.date-picker-form input{border:1px solid #dddfe7;border-radius:10px;padding:9px 11px;background:#fff}.date-picker-form button{border:0;border-radius:10px;padding:10px 14px;background:#292b34;color:#fff;font-weight:700;cursor:pointer}.period-summary-card{margin-bottom:20px}.five-metrics{grid-template-columns:repeat(5,1fr)!important}.parent-charts-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:20px 0}.parent-chart-card{background:#fff;border:1px solid #ececf2;border-radius:18px;padding:18px;min-width:0}.mini-chart{height:230px;display:flex;align-items:stretch;gap:5px;overflow-x:auto;padding:14px 2px 0}.chart-col{min-width:24px;flex:1;display:flex;flex-direction:column;align-items:center;height:100%;font-size:10px;color:#8a8d98}.chart-value{height:24px;font-size:10px;font-weight:700;color:#666a76;white-space:nowrap}.chart-bar-wrap{height:165px;width:100%;max-width:24px;background:#f2f2f7;border-radius:7px 7px 3px 3px;display:flex;align-items:flex-end;overflow:hidden}.chart-bar{width:100%;min-height:0;background:#6d5ce7;border-radius:7px 7px 3px 3px}.accuracy-chart .chart-bar{background:#9a72df}.chart-col small{font-size:9px;margin-top:5px;white-space:nowrap}.selected-day-summary{font-size:13px;color:#727684}.day-detail-head,.day-detail-row{grid-template-columns:1fr 1fr 1.5fr 1fr!important}.daily-history-list{display:flex;flex-direction:column;gap:7px}.daily-history-row{display:grid;grid-template-columns:1.5fr repeat(5,1fr) 22px;align-items:center;gap:10px;text-decoration:none;color:#343640;border:1px solid #ececf2;border-radius:13px;padding:11px 14px;background:#fff;transition:.15s}.daily-history-row:hover{border-color:#cfc9fa;transform:translateY(-1px)}.daily-history-row.selected{border-color:#6d5ce7;box-shadow:0 0 0 1px #6d5ce7 inset}.daily-history-row.no-activity{opacity:.58}.daily-history-row>div:not(.daily-date){display:flex;flex-direction:column}.daily-history-row span{font-size:11px;color:#8a8d98}.daily-date small{display:block;margin-top:2px;color:#8a8d98}.daily-good strong{color:#2e9a62}.daily-bad strong{color:#d75a67}.daily-accuracy strong{color:#7655c9}.daily-arrow{font-size:26px!important;color:#9b9da7!important;text-align:right}.daily-history-card{margin-top:20px}
@media(max-width:900px){.five-metrics{grid-template-columns:repeat(2,1fr)!important}.parent-charts-grid{grid-template-columns:1fr}.daily-history-row{grid-template-columns:1.5fr repeat(2,1fr) 22px}.daily-history-row>div:nth-child(4),.daily-history-row>div:nth-child(6){display:none}}
@media(max-width:600px){.history-toolbar{align-items:stretch}.period-tabs{width:100%}.period-tab{flex:1;text-align:center;padding:9px 6px;font-size:12px}.date-picker-form{width:100%}.date-picker-form input{flex:1}.five-metrics{grid-template-columns:1fr 1fr!important}.day-detail-head,.day-detail-row{grid-template-columns:1fr 1fr 1.4fr!important}.day-detail-head span:last-child,.day-detail-row span:last-child{display:none}.daily-history-row{grid-template-columns:1.6fr 1fr 1fr 18px;padding:10px}.daily-history-row>div:nth-child(3),.daily-history-row>div:nth-child(4),.daily-history-row>div:nth-child(6){display:none}.mini-chart{height:210px}.chart-bar-wrap{height:145px}}

/* Punkt 2: profile dzieci */
.child-switcher{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.child-switcher>span{font-size:12px;font-weight:800;color:#7b7e8b}.child-chip{padding:8px 11px;border:1px solid #e2e3eb;border-radius:11px;text-decoration:none;color:#555866;background:#fff;font-size:13px;font-weight:800}.child-chip.active{background:#6d5ce7;border-color:#6d5ce7;color:#fff}.multi-profile-box{max-width:760px}.child-profile-list{display:flex;flex-direction:column;gap:12px;margin:22px 0}.child-profile-card{border:1px solid #e6e7ee;border-radius:16px;padding:16px;background:#fff}.child-profile-card.active{border-color:#8a7cf0;box-shadow:0 0 0 2px rgba(109,92,231,.08)}.child-profile-status{font-size:11px;font-weight:900;letter-spacing:.06em;color:#898c98;margin-bottom:9px}.child-profile-card.active .child-profile-status{color:#6d5ce7}.child-profile-edit{display:flex;gap:9px}.child-profile-edit input{flex:1;border:1px solid #dfe1e8;border-radius:11px;padding:11px 12px;font-size:16px}.child-profile-edit button,.secondary-btn{border:0;border-radius:10px;padding:10px 13px;background:#6d5ce7;color:#fff;font-weight:800;cursor:pointer}.child-profile-actions{display:flex;gap:8px;align-items:center;margin-top:10px}.child-profile-actions form{margin:0}.secondary-btn{background:#f0eefc;color:#5e50c9}.text-danger-btn{border:0;background:transparent;color:#c85a66;font-weight:700;cursor:pointer;padding:8px}.add-child-card{border:1px dashed #cfd1dc;border-radius:16px;padding:17px;margin-top:20px}.add-child-card h2{margin:0 0 10px}.add-child-card small{display:block;margin-top:8px;color:#7d808d}@media(max-width:700px){.child-profile-edit{flex-direction:column}.child-switcher{width:100%}}

/* Dla rodzica — uproszczony układ statystyk */
.simple-parent-stats .parent-filters-card,.simple-parent-stats .subject-filter-card{background:#fff;border:1px solid #ececf2;border-radius:18px;padding:18px;margin-top:18px}.simple-parent-stats .filter-title{display:block;font-size:12px;font-weight:800;letter-spacing:.06em;color:#777b89;text-transform:uppercase;margin-bottom:11px}.simple-parent-stats .period-tabs button{font:inherit;cursor:pointer}.simple-parent-stats .date-row{display:flex;align-items:center;gap:10px;margin-top:14px;padding-top:14px;border-top:1px solid #f0f0f4}.simple-parent-stats .date-row label{font-size:13px;font-weight:700;color:#666a76}.simple-parent-stats .date-row input{border:1px solid #dddfe7;border-radius:10px;padding:9px 11px;background:#fff}.simple-parent-stats .date-row button{border:0;border-radius:10px;padding:10px 14px;background:#292b34;color:#fff;font-weight:700;cursor:pointer}.simple-parent-stats .muted-date{opacity:.68}.simple-parent-stats .subject-filter-card{display:flex;align-items:center;gap:16px}.simple-parent-stats .subject-filter-card .filter-title{margin:0}.simple-parent-stats .subject-filter-card select{min-width:240px;border:1px solid #dddfe7;border-radius:11px;padding:11px 38px 11px 12px;background:#fff;font-weight:700;color:#343640}.simple-parent-stats .stats-context{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:18px 2px 0;color:#747784;font-size:13px}.simple-parent-stats .stats-context strong{color:#343640}.simple-parent-stats .mini-chart{scroll-behavior:auto}.simple-parent-stats .chart-col{flex:0 0 28px;min-width:28px}.simple-parent-stats .final-summary-card{margin-top:20px}.simple-parent-stats .subject-stat-title em{margin-left:auto;font-style:normal;font-size:12px;color:#7b7e8b;font-weight:700}.simple-parent-stats .parent-detail-card{margin-bottom:0}
@media(max-width:650px){.simple-parent-stats .date-row{align-items:stretch;flex-direction:column}.simple-parent-stats .subject-filter-card{align-items:stretch;flex-direction:column;gap:7px}.simple-parent-stats .subject-filter-card select{width:100%;min-width:0}.simple-parent-stats .period-tabs{display:grid;grid-template-columns:1fr 1fr}.simple-parent-stats .period-tab:last-child{grid-column:1/-1}.simple-parent-stats .selected-day-summary{margin-top:8px}.simple-parent-stats .activity-details-header{align-items:flex-start;flex-direction:column}}

/* Rejestracja i autoryzacja */
.auth-link{margin:16px 0 0;text-align:center}
.auth-link a{color:#5b4bc4;text-decoration:none;font-weight:700}
.auth-separator{text-align:center;color:#888;margin:18px 0 12px}
.secondary-auth-button,.dev-action{display:block;text-align:center;text-decoration:none;padding:13px 16px;border-radius:12px;font-weight:800;background:#eee;color:#333}
.dev-box{margin-top:18px;padding:16px;border:2px dashed #8d78db;border-radius:14px;background:#f5f1ff;text-align:center}
.dev-box strong{display:block;margin-bottom:8px;color:#5b4bc4}
.dev-box .dev-action{margin-top:12px;background:#6c5bd3;color:#fff}


/* ===== PANEL ADMINISTRATORA ===== */
.admin-body{background:#f5f6fa;min-height:100vh}
.admin-shell{max-width:1250px;margin:30px auto;padding:0 18px}
.admin-head,.admin-section-head{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.admin-head{margin-bottom:22px}
.admin-head h1{margin:4px 0}
.admin-muted{color:#777}
.admin-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:12px;margin:18px 0}
.admin-card{background:#fff;border-radius:16px;padding:18px;box-shadow:0 4px 18px rgba(0,0,0,.07)}
.admin-card strong{display:block;font-size:28px;margin-bottom:3px}
.admin-card span{color:#777}
.admin-section{background:#fff;border-radius:16px;padding:20px;margin:18px 0;box-shadow:0 4px 18px rgba(0,0,0,.07)}
.admin-section h2{margin-top:0}
.admin-table-wrap{overflow-x:auto}
.admin-table{width:100%;border-collapse:collapse}
.admin-table th,.admin-table td{text-align:left;padding:12px;border-bottom:1px solid #eee;vertical-align:middle}
.admin-table th{font-size:13px;color:#777;white-space:nowrap}
.admin-table small{color:#888}
.admin-btn,.admin-search button,.admin-actions button{display:inline-block;border:0;border-radius:9px;padding:9px 12px;background:#6c5bd3;color:#fff;text-decoration:none;font-weight:700;cursor:pointer}
.admin-btn-secondary{background:#eceaf9;color:#4e43a3}
.admin-btn-danger{background:#b43b3b!important}
.admin-search{display:flex;gap:8px}
.admin-search input{min-width:240px;padding:9px 11px;border:1px solid #ddd;border-radius:9px}
.admin-status{display:inline-block;padding:5px 9px;border-radius:999px;font-size:12px;font-weight:800}
.admin-status-active{background:#e8f7ec;color:#26733a}
.admin-status-pending{background:#fff3d8;color:#8a6110}
.admin-status-blocked{background:#fde8e8;color:#9b2929}
.admin-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.admin-actions form{margin:0}
.admin-login-note{margin-top:16px;color:#777;font-size:13px;text-align:center}
@media(max-width:650px){
  .admin-search{width:100%}
  .admin-search input{min-width:0;flex:1}
  .admin-section{padding:14px}
}

.admin-status-deleted{background:#ededed;color:#555}
.admin-validity-form{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:16px 0}
.admin-validity-form input[type=date]{padding:9px 11px;border:1px solid #ddd;border-radius:9px}
.admin-validity-form button{border:0;border-radius:9px;padding:9px 12px;background:#6c5bd3;color:#fff;font-weight:700;cursor:pointer}

/* ===== WAŻNOŚĆ DOSTĘPU / OKRES TESTOWY ===== */
.access-banner{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 18px;border-radius:15px;margin:0 0 18px}
.access-banner strong{display:block;font-size:17px;margin-bottom:3px}
.access-banner span{display:block;font-size:14px}
.access-ok{background:#eaf8ee;border:1px solid #ccebd4;color:#255f35}
.access-expired{background:#fff0f0;border:1px solid #f0cccc;color:#8b3030}
.access-date{white-space:nowrap}
.access-expired a{display:inline-block;padding:9px 12px;border-radius:9px;background:#9d3d3d;color:#fff;text-decoration:none;font-weight:700;white-space:nowrap}
.access-expired-box{max-width:560px}
.expired-date{padding:12px;border-radius:10px;background:#f5f5f5;text-align:center}
@media(max-width:650px){.access-banner{align-items:flex-start;flex-direction:column}.access-date{white-space:normal}}


/* ===== DARMOWE DEMO V1 ===== */
.demo-auth-button{display:block;text-align:center;text-decoration:none;font-weight:800;padding:13px 16px;border-radius:12px;border:2px solid #222;color:#222;background:#fff}
.demo-auth-button:hover{transform:translateY(-1px)}
.demo-badge{font-size:12px;font-weight:900;letter-spacing:.06em;padding:7px 10px;border-radius:999px;background:#f0f0f5;color:#444}
.demo-footnote{text-align:center;color:#777;font-size:13px;margin-top:18px}
.demo-trial-text{margin:18px 0 4px;line-height:1.6}
.demo-admin-form{display:grid;gap:16px;max-width:620px;margin-top:16px}
.demo-admin-form label{display:grid;gap:7px;font-weight:700}
.demo-admin-form label:first-child{display:flex;align-items:center;gap:9px}
.demo-admin-form input[type=number]{max-width:180px;padding:10px 12px;border:1px solid #d8d8df;border-radius:9px;font:inherit}
.demo-admin-form small{font-weight:400;color:#777}
.demo-ua{max-width:420px;word-break:break-word;font-size:12px;color:#666}
.admin-message{margin:14px 0;padding:12px 14px;border-radius:10px;background:#eef8ef;font-weight:700}


/* ======================================================
   ADMIN - KODY RABATOWE I PARTNERSKIE
   ====================================================== */
.admin-code-form { margin-top: 16px; }
.admin-form-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(160px, 1fr));
    gap: 14px;
    margin-bottom: 14px;
}
.admin-form-grid label,
.admin-code-form > label {
    display: flex;
    flex-direction: column;
    gap: 7px;
    font-weight: 700;
}
.admin-form-grid input,
.admin-form-grid select,
.admin-code-form textarea {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #d8dee8;
    border-radius: 10px;
    padding: 10px 12px;
    background: #fff;
    color: #172033;
    font: inherit;
}
.admin-code-form textarea { resize: vertical; min-height: 76px; }
.admin-check-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 24px;
    padding: 12px 0 16px;
}
.admin-check-grid label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-weight: 600;
}
.admin-check-grid input { width: 18px; height: 18px; }
.admin-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 14px;
}
.admin-alert {
    border-radius: 12px;
    padding: 12px 14px;
    margin: 0 0 16px;
    font-weight: 700;
}
.admin-alert-ok { background: #eaf8ef; border: 1px solid #bfe7cc; color: #176b37; }
.admin-alert-error { background: #fff0f0; border: 1px solid #efc0c0; color: #9a2020; }
.admin-inline-form { display: inline-block; margin: 3px 0; }
.admin-nowrap { white-space: nowrap; }
.admin-code-hint { margin-top: 14px; line-height: 1.5; }

@media (max-width: 1050px) {
    .admin-form-grid { grid-template-columns: repeat(2, minmax(160px, 1fr)); }
}
@media (max-width: 620px) {
    .admin-form-grid { grid-template-columns: 1fr; }
    .admin-check-grid { flex-direction: column; gap: 10px; }
    .admin-nowrap { white-space: normal; }
}


/* ======================================================
   PANEL PARTNERA
   ====================================================== */
.partner-body {
    min-height: 100vh;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    box-sizing: border-box;
    background: #f5f7fb;
}
.partner-login-card {
    width: min(430px, 100%);
    background: #fff;
    border-radius: 18px;
    padding: 28px;
    box-shadow: 0 12px 38px rgba(23,32,51,.10);
}
.partner-login-card h1 { margin-top: 0; }
.partner-login-card .admin-form {
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.partner-login-card label {
    display: flex;
    flex-direction: column;
    gap: 7px;
    font-weight: 700;
}
.partner-login-card input,
.admin-mini-input {
    box-sizing: border-box;
    border: 1px solid #d8dee8;
    border-radius: 9px;
    padding: 9px 10px;
    font: inherit;
}
.admin-mini-input { width: 125px; margin: 3px 4px 3px 0; }
.admin-btn:disabled { opacity: .45; cursor: not-allowed; }


/* ======================================================
   CENNIK / OFERTY
   ====================================================== */
.pricing-shell {
    width: min(1120px, calc(100% - 32px));
    margin: 0 auto;
    padding: 48px 0;
}
.pricing-head { text-align: center; margin-bottom: 30px; }
.pricing-head h1 { margin-bottom: 8px; }
.pricing-head p { opacity: .72; }
.pricing-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 20px;
    align-items: stretch;
}
.pricing-card {
    position: relative;
    background: #fff;
    border: 1px solid #e0e5ed;
    border-radius: 18px;
    padding: 26px;
    box-shadow: 0 8px 28px rgba(23,32,51,.06);
    display: flex;
    flex-direction: column;
}
.pricing-card-featured {
    border-width: 2px;
    transform: translateY(-5px);
}
.pricing-badge {
    position: absolute;
    top: -13px;
    left: 50%;
    transform: translateX(-50%);
    padding: 6px 14px;
    border-radius: 999px;
    background: #172033;
    color: #fff;
    font-size: 13px;
    font-weight: 800;
}
.pricing-card h2 { margin: 4px 0 14px; text-align: center; }
.pricing-price { font-size: 34px; font-weight: 900; text-align: center; }
.pricing-days, .pricing-monthly { text-align: center; opacity: .68; }
.pricing-card p { text-align: center; min-height: 48px; }
.pricing-monthly { margin: auto 0 16px; padding-top: 18px; }
.pricing-button {
    display: block;
    text-align: center;
    text-decoration: none;
    border-radius: 12px;
    padding: 12px 16px;
    font-weight: 800;
    background: #172033;
    color: #fff;
}
.pricing-note, .pricing-empty {
    margin-top: 24px;
    text-align: center;
    opacity: .68;
}
@media (max-width: 820px) {
    .pricing-grid { grid-template-columns: 1fr; }
    .pricing-card-featured { transform: none; }
}


/* ======================================================
   ZAMÓWIENIA / CHECKOUT
   ====================================================== */
.checkout-shell {
    width: min(680px, calc(100% - 32px));
    margin: 0 auto;
    padding: 48px 0;
}
.checkout-card {
    background: #fff;
    border: 1px solid #e0e5ed;
    border-radius: 18px;
    padding: 28px;
    box-shadow: 0 10px 32px rgba(23,32,51,.07);
}
.checkout-card h1 { margin-top: 0; }
.checkout-row, .checkout-total {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    padding: 12px 0;
    border-bottom: 1px solid #edf0f4;
}
.checkout-total {
    margin: 18px 0;
    border-top: 2px solid #172033;
    border-bottom: 0;
    font-size: 22px;
}
.checkout-code-form { margin: 20px 0 10px; }
.checkout-code-form label { display: block; font-weight: 700; }
.checkout-code-line { display: flex; gap: 8px; margin-top: 8px; }
.checkout-code-line input {
    flex: 1; min-width: 0; border: 1px solid #d8dee8; border-radius: 10px;
    padding: 10px 12px; font: inherit;
}
.checkout-discount {
    margin: 12px 0; padding: 11px 13px; border-radius: 10px;
    background: #eaf8ef; border: 1px solid #bfe7cc; color: #176b37;
}
.checkout-main-button { width: 100%; border: 0; cursor: pointer; font: inherit; }
.order-search { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 16px; }
.order-search select {
    border: 1px solid #d8dee8; border-radius: 9px; padding: 9px 10px; font: inherit;
}
@media (max-width: 560px) {
    .checkout-code-line { flex-direction: column; }
    .checkout-row, .checkout-total { gap: 10px; }
}

/* Formalności / dokumenty */
.legal-page{max-width:900px;margin:40px auto;padding:28px;background:#fff;border-radius:18px;box-shadow:0 8px 30px rgba(0,0,0,.07);line-height:1.65}
.legal-page h1{margin-top:0}.legal-page h2{margin-top:28px;font-size:1.15rem}.legal-version{opacity:.65}
.legal-footer{max-width:1100px;margin:28px auto;padding:18px 20px;display:flex;gap:14px 22px;flex-wrap:wrap;justify-content:center;align-items:center;font-size:.9rem;opacity:.85}
.legal-footer a{text-decoration:none}.checkout-final-form{margin-top:18px}.checkout-consent{display:flex;align-items:flex-start;gap:10px;margin:12px 0;line-height:1.4}.checkout-consent input{margin-top:4px;flex:0 0 auto}

/* Wspólna stopka serwisu */
.site-footer{margin-top:38px;border-top:1px solid rgba(0,0,0,.08);background:rgba(255,255,255,.72)}
.site-footer-inner{max-width:1120px;margin:0 auto;padding:24px 20px;display:grid;grid-template-columns:1fr auto 1fr;gap:24px;align-items:center;font-size:.9rem;line-height:1.55}
.site-footer-brand{display:flex;flex-direction:column;gap:2px}.site-footer-brand span{opacity:.65}
.site-footer-links{display:flex;gap:14px 18px;flex-wrap:wrap;justify-content:center}.site-footer-links a{text-decoration:none}
.site-footer-company{text-align:right;opacity:.78}.site-footer-company a{text-decoration:none}
@media(max-width:760px){.site-footer-inner{grid-template-columns:1fr;text-align:center}.site-footer-company{text-align:center}.site-footer-links{justify-content:center}}