:root {
    /* REGLA FIJA DE PROYECTO:
       SOLO UN ESTILO VISUAL PARA TODOS LOS DISPOSITIVOS.
       ANCHO MAXIMO DE LA APP: 400px.
       NO CREAR ESTILOS DIFERENTES PARA MOVIL/ESCRITORIO. */
    --desktop-a: #0a76d3;
    --desktop-b: #00549f;
    --app-max-width: 400px;
    --window-bg: #f5f8fc;
    --window-border: rgba(255, 255, 255, 0.7);
    --title-a: #1a4f8e;
    --title-b: #123e71;
    --title-danger-a: #9f2f3a;
    --title-danger-b: #7a2029;
    --text-main: #11263f;
    --text-muted: #4e6480;
    --taskbar-bg: rgba(12, 24, 44, 0.52);
    --taskbar-border: rgba(255, 255, 255, 0.3);
    --focus: #2364ff;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    padding: 0;
}

body {
    min-height: 100dvh;
    color: var(--text-main);
    font-family: "Segoe UI", Arial, sans-serif;
    background:
        radial-gradient(circle at 20% 16%, rgba(255, 255, 255, 0.22), transparent 34%),
        linear-gradient(155deg, var(--desktop-a), var(--desktop-b));
}

.desktop {
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
    position: relative;
}

.workspace {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem 0.55rem 5rem;
}

.workspace-app {
    align-items: flex-start;
    padding-top: 1.2rem;
}

.window {
    width: min(100%, var(--app-max-width));
    border-radius: 16px;
    border: 1px solid var(--window-border);
    background: var(--window-bg);
    box-shadow: 0 16px 40px rgba(0, 24, 64, 0.33);
    overflow: hidden;
}

.titlebar {
    min-height: 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.8rem;
    padding: 0.7rem 0.95rem;
    background: linear-gradient(180deg, var(--title-a), var(--title-b));
    color: #ffffff;
    font-size: 0.95rem;
    font-weight: 600;
}

.titlebar-actions-only {
    justify-content: flex-end;
}

.titlebar-danger {
    background: linear-gradient(180deg, var(--title-danger-a), var(--title-danger-b));
}

.window-app {
    width: min(100%, var(--app-max-width));
    min-height: auto;
    display: flex;
    flex-direction: column;
}

.titlebar-actions {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
}

.role-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 28px;
    min-width: 78px;
    padding: 0.18rem 0.56rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.32);
    background: rgba(255, 255, 255, 0.16);
    color: #ffffff;
    font-size: 0.8rem;
    font-weight: 700;
}

.role-admin {
    background: rgba(231, 176, 0, 0.24);
}

.role-junta {
    background: rgba(95, 192, 255, 0.24);
}

.role-socio {
    background: rgba(145, 226, 153, 0.2);
}

.role-meet {
    background: rgba(191, 151, 255, 0.22);
}

.menu-bar {
    min-height: 56px;
    display: flex;
    align-items: center;
    padding: 0.5rem 0.9rem;
    background:
        linear-gradient(180deg, #e9f1fc 0%, #d7e5f8 100%);
    border-top: 1px solid #f8fcff;
    border-bottom: 1px solid #b8cde8;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
}

.menu-actions {
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.menu-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: 0.38rem 0.96rem;
    border-radius: 999px;
    border: 1px solid #8cadd3;
    background: linear-gradient(180deg, #ffffff 0%, #e8f0fc 100%);
    color: #1a426e;
    font-size: 0.88rem;
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 2px 6px rgba(19, 56, 97, 0.12);
}

.menu-btn:hover {
    background: linear-gradient(180deg, #ffffff 0%, #dfebfb 100%);
    border-color: #7f9fc7;
}

.menu-btn.is-active {
    background: linear-gradient(180deg, #565e69 0%, #3f464f 100%);
    border-color: #3a424c;
    color: #ffffff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14), 0 2px 8px rgba(26, 30, 36, 0.28);
}

.menu-btn.is-disabled {
    opacity: 0.6;
    cursor: default;
    box-shadow: none;
}

.window-body {
    padding: 1.2rem;
}

.window-app-body {
    flex: 1;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

h1 {
    margin: 0;
    font-size: 1.3rem;
    line-height: 1.2;
}

.muted {
    margin: 0.65rem 0 1.05rem;
    color: var(--text-muted);
    font-size: 0.92rem;
}

.btn-google {
    margin-top: 0.2rem;
    width: 100%;
    min-height: 54px;
    padding: 0.75rem 1rem;
    border-radius: 12px;
    border: 1px solid #ccd6e5;
    background: #ffffff;
    color: #123a69;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 7px 18px rgba(13, 38, 70, 0.14);
}

.btn-google:focus-visible,
.logout-link:focus-visible,
.menu-btn:focus-visible,
.submenu-btn:focus-visible,
.text-input:focus-visible,
.btn-primary:focus-visible,
.btn-show-question:focus-visible,
.btn-delete-account:focus-visible,
.btn-reset-question:focus-visible,
.btn-reset-confirm:focus-visible,
.btn-reset-cancel:focus-visible,
.drive-open-btn:focus-visible {
    outline: 3px solid var(--focus);
    outline-offset: 2px;
}

.btn-google:hover {
    background: #f8fbff;
}

.logout-link {
    color: #ffffff;
    text-decoration: none;
    font-size: 0.87rem;
    background: rgba(255, 255, 255, 0.18);
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 8px;
    padding: 0.35rem 0.65rem;
}

.logout-link-config {
    background: #560083;
    border-color: #47006d;
    color: #ffffff;
}

.logout-link-config:hover {
    background: #4d0075;
}

.logout-link-danger {
    background: linear-gradient(180deg, #c54552 0%, #9f2f3a 100%);
    border-color: rgba(255, 216, 219, 0.45);
}

.logout-link-danger:hover {
    background: linear-gradient(180deg, #b93c49 0%, #8f2933 100%);
}

.hello-box {
    min-height: 180px;
    border-radius: 14px;
    border: 1px solid #cfdaea;
    background: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.45rem;
    font-weight: 700;
    color: #153b66;
}

.hello-logo {
    display: block;
    width: auto;
    max-width: min(100%, 300px);
    max-height: 140px;
    height: auto;
}

.construction-box {
    min-height: 180px;
    border-radius: 14px;
    border: 1px dashed #b8c9df;
    background: #f9fcff;
    padding: 1rem;
}

.assembly-box {
    border-radius: 14px;
    border: 1px solid #cfdaea;
    background: #ffffff;
    padding: 1rem;
}

.assembly-results {
    margin-top: 1rem;
}

.assembly-results h2 {
    margin: 0 0 0.55rem;
    font-size: 1.15rem;
    color: #173d67;
}

.question-frame {
    margin: 0;
    border: 1px solid #c9d8ea;
    border-radius: 12px;
    padding: 0.75rem;
    background: #f9fcff;
    display: grid;
    gap: 0.62rem;
    min-width: 0;
}

.question-frame > * {
    min-width: 0;
}

.question-frame legend {
    padding: 0 0.35rem;
    color: #173d67;
    font-size: 1.12rem;
    font-weight: 700;
}

.question-text {
    margin: 0.15rem 0 0.7rem;
    color: #1d3c61;
    line-height: 1.35;
}

.question-input {
    min-height: 7.6rem;
    resize: vertical;
    width: 100%;
    max-width: 100%;
}

.question-separator {
    width: 100%;
    height: 1px;
    margin: 0.2rem 0 0.05rem;
    background: #d6e1ef;
}

.question-active-input {
    width: 116px;
    max-width: 100%;
}

.question-active-row {
    display: flex;
    align-items: stretch;
    gap: 0.6rem;
    flex-wrap: wrap;
    min-width: 0;
}

.question-active-row .question-active-input {
    flex: 1 1 116px;
    min-width: 96px;
    width: auto;
    max-width: 100%;
}

.btn-show-question {
    min-height: 44px;
    border: 1px solid #aebdd2;
    border-radius: 10px;
    background: linear-gradient(180deg, #eef2f7 0%, #d9e0ea 100%);
    color: #2e4a6d;
    font-size: 0.92rem;
    font-weight: 700;
    padding: 0.56rem 0.9rem;
    cursor: pointer;
    white-space: nowrap;
    flex: 1 1 120px;
    min-width: 0;
}

.btn-show-question:hover {
    background: linear-gradient(180deg, #f4f7fb 0%, #dee6f1 100%);
}

.btn-show-question.is-active {
    border-color: #2d8d4b;
    background: linear-gradient(180deg, #42b462 0%, #29934a 100%);
    color: #ffffff;
}

.btn-show-question.is-active:hover {
    background: linear-gradient(180deg, #39a85a 0%, #238542 100%);
}

.btn-reset-question {
    min-height: 44px;
    border: 1px solid #a72e38;
    border-radius: 10px;
    background: linear-gradient(180deg, #d24b58 0%, #b23b47 100%);
    color: #ffffff;
    font-size: 0.92rem;
    font-weight: 700;
    padding: 0.56rem 0.9rem;
    cursor: pointer;
    white-space: nowrap;
    flex: 1 1 120px;
    min-width: 0;
}

.btn-reset-question:hover {
    background: linear-gradient(180deg, #c44350 0%, #a83642 100%);
}

.active-time {
    margin: 0.2rem 0 0;
    text-align: center;
    color: #294b70;
    font-size: 0.92rem;
    font-weight: 600;
}

.results-visible-hint {
    margin: 0.2rem 0 0;
    text-align: center;
    color: #228443;
    font-size: 0.9rem;
    font-weight: 700;
}

.active-time-value {
    font-weight: 800;
}

.active-time-seconds {
    font-weight: 800;
}

.assembly-countdown {
    margin-top: 0.45rem;
}

.answer-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.55rem;
}

.config-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1rem;
}

.config-grid > .config-card {
    min-width: 0;
}

.config-submenu {
    margin-bottom: 0.95rem;
    display: flex;
    align-items: center;
    gap: 0.55rem;
}

.submenu-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 0.3rem 0.9rem;
    border-radius: 10px;
    border: 1px solid #47006d;
    background: #560083;
    color: #ffffff;
    text-decoration: none;
    font-size: 0.88rem;
    font-weight: 700;
}

.submenu-btn:hover {
    border-color: #3f0060;
    background: #4d0075;
}

.submenu-btn.is-active {
    border-color: #3f0060;
    background: #560083;
    color: #ffffff;
    box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.28);
}

.config-card {
    border: 1px solid #cddcef;
    border-radius: 14px;
    background: #ffffff;
    padding: 1rem;
    min-width: 0;
}

.config-card h1,
.config-card h2 {
    margin: 0 0 0.55rem;
}

.config-card h2 {
    font-size: 1.22rem;
}

.config-form {
    margin-top: 0.75rem;
    display: grid;
    gap: 0.7rem;
    min-width: 0;
}

.config-form > * {
    min-width: 0;
    max-width: 100%;
}

.config-form .btn-primary {
    width: 100%;
}

.assembly-config-form .question-frame + .question-frame {
    margin-top: 100px;
}

.assembly-title-form {
    margin-bottom: 100px;
}

.field-label {
    margin: 0;
    display: block;
    color: #27496c;
    font-size: 0.86rem;
    font-weight: 700;
}

.text-input {
    min-height: 44px;
    width: 100%;
    border: 1px solid #b8cde7;
    border-radius: 10px;
    padding: 0.56rem 0.68rem;
    font-size: 1rem;
    color: var(--text-main);
    background: #fdfefe;
}

.checkbox-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0.8rem;
}

.check-item {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.32rem 0.5rem;
    border-radius: 8px;
    border: 1px solid #c7d8ec;
    background: #f2f7ff;
    color: #173d67;
    font-weight: 600;
}

.btn-primary {
    min-height: 46px;
    border: 1px solid #1c4d86;
    border-radius: 10px;
    background: #1f578f;
    color: #ffffff;
    font-size: 0.97rem;
    font-weight: 700;
    cursor: pointer;
}

.btn-primary:hover {
    background: #174b7f;
}

.btn-success,
.btn-danger {
    min-height: 46px;
    border-radius: 10px;
    font-size: 0.97rem;
    font-weight: 700;
    cursor: pointer;
    width: 100%;
}

.btn-success {
    border: 1px solid #2f8e3b;
    background: #2f9e44;
    color: #ffffff;
}

.btn-success:hover {
    background: #27873a;
}

.btn-danger {
    border: 1px solid #a72e38;
    background: #b23b47;
    color: #ffffff;
}

.btn-danger:hover {
    background: #9e333e;
}

.btn-success:disabled,
.btn-danger:disabled {
    background: linear-gradient(180deg, #9aa5b1 0%, #7f8a95 100%);
    border-color: #77828d;
    color: #ffffff;
    cursor: not-allowed;
    box-shadow: none;
}

.btn-success:disabled:hover,
.btn-danger:disabled:hover {
    background: linear-gradient(180deg, #9aa5b1 0%, #7f8a95 100%);
}

.meet-actions {
    display: grid;
    gap: 0.62rem;
}

.meet-generate-wrap {
    text-align: center;
}

.meet-generate-btn {
    display: inline-flex;
}

.email-account-btn {
    border-color: #9eb9de;
    background: #d8e8ff;
    color: #2f3f52;
}

.email-account-btn:hover {
    background: #c8dcfb;
    color: #263648;
}

.email-account-row {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.email-open-form {
    flex: 1 1 auto;
    margin: 0;
}

.email-open-form .email-account-btn {
    width: 100%;
}

.email-settings-btn {
    width: 40px;
    min-width: 40px;
    height: 40px;
    border-radius: 10px;
    border: 1px solid #cb6d18;
    background: #e88824;
    color: #ffffff;
    font-size: 1.02rem;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
}

.email-settings-btn:hover {
    background: #d57a1f;
}

.email-config-overlay {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.9rem;
    background: rgba(12, 28, 48, 0.46);
    z-index: 1200;
}

.email-config-overlay[hidden] {
    display: none !important;
}

.email-config-dialog {
    width: min(100%, 360px);
    border-radius: 12px;
    border: 1px solid #cddcef;
    background: #ffffff;
    box-shadow: 0 12px 30px rgba(14, 35, 61, 0.28);
    padding: 0.9rem;
}

.email-config-dialog h2 {
    margin: 0 0 0.55rem;
    color: #173d67;
    font-size: 1.04rem;
}

.email-config-content p {
    margin: 0 0 0.45rem;
    color: #2a476b;
    line-height: 1.28;
    font-size: 0.9rem;
    overflow-wrap: anywhere;
}

.email-config-actions {
    margin-top: 0.7rem;
    display: flex;
    justify-content: flex-end;
}

.email-config-actions .btn-primary {
    min-width: 92px;
}

.btn-primary:disabled,
.btn-primary.is-disabled {
    background: linear-gradient(180deg, #9aa5b1 0%, #7f8a95 100%);
    border-color: #77828d;
    color: #ffffff;
    cursor: not-allowed;
    box-shadow: none;
}

.btn-primary:disabled:hover,
.btn-primary.is-disabled:hover {
    background: linear-gradient(180deg, #9aa5b1 0%, #7f8a95 100%);
}

.btn-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    margin-top: 0.6rem;
    padding: 0.56rem 0.95rem;
    white-space: nowrap;
}

.flash {
    border-radius: 10px;
    padding: 0.62rem 0.74rem;
    border: 1px solid #c3d6ec;
    background: #edf5ff;
    color: #173d67;
    font-size: 0.92rem;
    margin-top: 0.7rem;
}

.flash-success {
    border-color: #b9ddc4;
    background: #ecfaef;
    color: #1e5a2e;
}

.flash-error {
    border-color: #e5bfc4;
    background: #fff0f2;
    color: #7a2630;
}

.accounts-table-wrap {
    margin-top: 0.7rem;
    max-height: 320px;
    overflow-y: auto;
    overflow-x: hidden;
    border: 1px solid #d2deed;
    border-radius: 10px;
}

.accounts-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

.accounts-table th,
.accounts-table td {
    text-align: left;
    padding: 0.62rem 0.68rem;
    border-bottom: 1px solid #e0e8f4;
    font-size: 0.92rem;
}

.accounts-table thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #edf4ff;
}

.accounts-table tbody tr:nth-child(odd) {
    background: #fbfdff;
}

.accounts-table .role-pill {
    color: #12385d;
    border-color: #c0d3ea;
    background: #e8f2ff;
}

.accounts-table .role-admin {
    background: #fff2c7;
    border-color: #ecd891;
    color: #6e5300;
}

.accounts-table .role-junta {
    background: #dcf2ff;
    border-color: #9dcced;
    color: #164a74;
}

.accounts-table .role-socio {
    background: #e5f7e8;
    border-color: #b6e2bd;
    color: #1f5b2a;
}

.accounts-table .role-meet {
    background: #efe4ff;
    border-color: #cfb2f7;
    color: #4b2e7c;
}

.accounts-table .col-delete {
    width: 44px;
    min-width: 44px;
}

.accounts-table .col-role {
    width: 94px;
}

.accounts-table .col-account,
.accounts-table .account-cell {
    min-width: 0;
}

.accounts-table .account-email {
    display: block;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.84rem;
}

.accounts-table .delete-cell {
    text-align: center;
}

.inline-form {
    margin: 0;
}

.btn-delete-account {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 999px;
    border: 1px solid #c63a47;
    background: #e34756;
    color: #ffffff;
    font-size: 0.75rem;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
}

.btn-delete-account:hover {
    background: #cc3442;
}

.screen-message {
    margin: 0 0 1rem;
    font-size: 1rem;
    line-height: 1.4;
    color: #253b56;
}

.drive-list {
    margin: 0.75rem 0 0;
    padding: 0.55rem;
    list-style: none;
    border: 1px solid #d2deed;
    border-radius: 10px;
    background: #fbfdff;
    max-height: 320px;
    overflow: auto;
    display: grid;
    gap: 0.55rem;
}

.drive-list-item {
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.42rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #e2eaf5;
}

.drive-list-item:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.drive-open-btn {
    display: block;
    width: 100%;
    min-height: 44px;
    border: 1px solid #1c4d86;
    border-radius: 10px;
    background: #1f578f;
    color: #ffffff;
    text-decoration: none;
    font-size: 0.94rem;
    font-weight: 700;
    line-height: 1.3;
    padding: 0.56rem 0.78rem;
}

.drive-open-btn:hover {
    background: #174b7f;
}

.drive-latest-link {
    display: inline-block;
    color: #1a426e;
    font-size: 0.9rem;
    font-weight: 700;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.drive-latest-entry {
    margin-top: 0.12rem;
    margin-bottom: 0.52rem;
}

.drive-latest-entry:last-of-type {
    margin-bottom: 0.1rem;
}

.drive-latest-meta {
    margin: 0;
    color: #4e6480;
    font-size: 0.86rem;
    line-height: 1.25;
}

.meet-current {
    margin-top: 0.8rem;
    padding: 0.7rem;
    border: 1px solid #cddcef;
    border-radius: 10px;
    background: #f8fbff;
}

.meet-link {
    display: inline-block;
    margin-top: 0.32rem;
    color: #1a426e;
    text-decoration: underline;
    text-underline-offset: 2px;
    overflow-wrap: anywhere;
}

.meet-meta {
    margin-bottom: 0;
    font-size: 0.84rem;
}

.drive-open-btn.drive-color-admin {
    background: #d93522;
    border-color: #bf2b1a;
}

.drive-open-btn.drive-color-admin:hover {
    background: #c02d1d;
}

.drive-open-btn.drive-color-internacional {
    background: #ee8621;
    border-color: #d6761a;
}

.drive-open-btn.drive-color-internacional:hover {
    background: #d8791f;
}

.drive-open-btn.drive-color-recursos {
    background: #cf39e2;
    border-color: #b62fca;
}

.drive-open-btn.drive-color-recursos:hover {
    background: #b933ca;
}

.drive-open-btn.drive-color-secretaria {
    background: #2463d7;
    border-color: #1d51b3;
}

.drive-open-btn.drive-color-secretaria:hover {
    background: #215ac3;
}

.drive-open-btn.drive-color-tesoreria {
    background: #d7d52f;
    border-color: #bcb924;
    color: #24344a;
}

.drive-open-btn.drive-color-tesoreria:hover {
    background: #c6c32c;
}

.drive-open-btn.drive-color-voluntariado {
    background: #49b729;
    border-color: #3c9a21;
}

.drive-open-btn.drive-color-voluntariado:hover {
    background: #42a625;
}

.stats-hint {
    margin-top: 0.25rem;
}

.stats-box {
    display: grid;
    gap: 0.72rem;
}

.stats-summary {
    margin: 0;
}

.stats-grid {
    display: grid;
    gap: 0.7rem;
}

.stats-item {
    border: 1px solid #ccd9eb;
    border-radius: 10px;
    padding: 0.7rem;
    background: #f8fbff;
}

.stats-item h3 {
    margin: 0 0 0.3rem;
    font-size: 1rem;
    color: #173d67;
}

.stats-question {
    margin: 0 0 0.55rem;
    color: #233f63;
    font-size: 0.94rem;
    line-height: 1.35;
}

.stats-line {
    margin: 0.18rem 0;
    color: #27496c;
    font-size: 0.9rem;
}

.stats-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    flex-wrap: wrap;
    margin-top: 0.6rem;
}

.stats-actions .btn-link {
    margin-top: 0;
    padding-left: 0.95rem;
    padding-right: 0.95rem;
}

.confirm-overlay {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    background: rgba(12, 28, 48, 0.46);
    z-index: 1200;
}

.confirm-overlay[hidden] {
    display: none !important;
}

.confirm-dialog {
    width: min(100%, 390px);
    border-radius: 12px;
    border: 1px solid #cddcef;
    background: #ffffff;
    box-shadow: 0 12px 30px rgba(14, 35, 61, 0.28);
    padding: 1rem;
}

.confirm-dialog h3 {
    margin: 0 0 0.55rem;
    color: #173d67;
    font-size: 1.12rem;
}

.confirm-dialog p {
    margin: 0 0 0.95rem;
    color: #2a476b;
    line-height: 1.35;
}

.confirm-actions {
    display: flex;
    gap: 0.55rem;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.btn-reset-confirm,
.btn-reset-cancel {
    min-height: 42px;
    border-radius: 10px;
    font-size: 0.92rem;
    font-weight: 700;
    padding: 0.52rem 0.86rem;
    cursor: pointer;
}

.btn-reset-confirm {
    border: 1px solid #a72e38;
    background: linear-gradient(180deg, #d24b58 0%, #b23b47 100%);
    color: #ffffff;
}

.btn-reset-confirm:hover {
    background: linear-gradient(180deg, #c44350 0%, #a83642 100%);
}

.btn-reset-cancel {
    border: 1px solid #adc3df;
    background: linear-gradient(180deg, #ffffff 0%, #e9f2ff 100%);
    color: #214569;
}

.btn-reset-cancel:hover {
    background: linear-gradient(180deg, #ffffff 0%, #deecff 100%);
}

.taskbar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    min-height: 62px;
    padding: 0.7rem 0.95rem;
    border-top: 1px solid var(--taskbar-border);
    background: var(--taskbar-bg);
    backdrop-filter: blur(10px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem 1rem;
    color: #edf4ff;
}

.taskbar-brand {
    display: inline-flex;
    align-items: center;
    gap: 0.52rem;
    font-weight: 600;
}

.start-dot {
    width: 14px;
    height: 14px;
    border-radius: 4px;
    background: linear-gradient(145deg, #4bb1ff, #1387f7);
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.46);
}

.taskbar-text {
    margin-left: auto;
    max-width: min(72%, 900px);
    text-align: right;
    line-height: 1.22;
    font-size: 0.78rem;
    letter-spacing: 0.02em;
    opacity: 0.92;
}

.panel-stack {
    width: min(100%, var(--app-max-width));
    display: grid;
    justify-items: center;
    gap: 0.9rem;
}

.panel-stack > .window {
    width: 100%;
}

.install-app-link {
    appearance: none;
    -webkit-appearance: none;
    border: 0;
    background: transparent;
    color: #ffffff;
    font-size: 0.74rem;
    font-weight: 400;
    text-decoration: none;
    cursor: pointer;
    padding: 0.2rem 0.4rem;
}

.install-app-link:hover {
    opacity: 0.9;
}

.install-overlay {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0.9rem;
    background: rgba(12, 28, 48, 0.46);
    z-index: 1300;
}

.install-overlay[hidden] {
    display: none !important;
}

.install-dialog {
    width: min(100%, 360px);
    border-radius: 12px;
    border: 1px solid #cddcef;
    background: #ffffff;
    box-shadow: 0 12px 30px rgba(14, 35, 61, 0.28);
    padding: 0.95rem;
}

.install-dialog h2 {
    margin: 0 0 0.55rem;
    color: #173d67;
    font-size: 1.08rem;
}

.install-dialog p {
    margin: 0;
    color: #2a476b;
    line-height: 1.35;
    font-size: 0.93rem;
}

.install-dialog-actions {
    margin-top: 0.85rem;
    display: flex;
    justify-content: flex-end;
}

.install-dialog-actions .btn-primary {
    min-width: 108px;
    padding-left: 0.85rem;
    padding-right: 0.85rem;
}