:root{--font-size-base: 16px;--font-size-small: 15px;--font-size-heading-main: 28px;--font-size-heading-sub: 20px;--font-size-prayer-name: 18px;--font-size-time-main: 24px;--font-size-timer: 14px;--font-size-button: 16px;--font-size-modal-title: 22px;--button-height: 52px;--button-border-radius: 999px;--button-padding-x: 20px;--table-row-min-height: 64px;--table-cell-padding-y: 6px;--table-cell-padding-x: 8px;--layout-max-width: 1100px;--header-padding-y: 16px;--bp-desktop: 1200px;--bp-laptop: 992px;--bp-tablet: 768px;--bp-mobile: 480px;--color-bg-main: #f5f5f7;--color-bg-card: #ffffff;--color-bg-header: #fafafa;--color-bg-button-primary: #f0f0f3;--color-bg-button-secondary: #f0f0f3;--color-text-main: #111111;--color-text-muted: #666666;--color-text-invert: #111111;--color-border-soft: #e0e0e5;--color-table-header-bg: #faf7f7;--color-timer: #c62828;--color-time-main: #111111;--color-modal-overlay: rgba(0, 0, 0, .55);--color-modal-bg: #ffffff;--color-tag-bg: #f1f1f7;--color-toast-bg: #faf7f7d7;--shadow-soft: 0 10px 30px rgba(0, 0, 0, .06)}*,*:before,*:after{box-sizing:border-box}html,body,#root{margin:0;padding:0;height:100%}body{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-size:var(--font-size-base);background:radial-gradient(circle at top,#fff,#eceff4);color:var(--color-text-main)}.app-root{min-height:100vh;display:flex;justify-content:center;padding:16px}.app-shell{background:var(--color-bg-main);max-width:var(--layout-max-width);width:100%;border-radius:24px;box-shadow:var(--shadow-soft);display:flex;flex-direction:column;overflow:hidden}.app-header{background:var(--color-bg-header);padding:var(--header-padding-y) 20px;border-bottom:1px solid var(--color-border-soft);display:grid;grid-template-columns:auto 1fr auto;align-items:center;column-gap:12px}.app-header-left,.app-header-right{display:flex;align-items:center}.app-header-right{justify-content:flex-end}.app-header-center{text-align:center}.app-title{display:flex;flex-direction:column;align-items:center;line-height:1.1}.app-title-city{font-size:var(--font-size-heading-main);font-weight:700;letter-spacing:.03em}.app-title-sub{font-size:var(--font-size-heading-sub);font-weight:600}.btn{display:inline-flex;align-items:center;justify-content:center;height:var(--button-height);padding:0 var(--button-padding-x);border-radius:var(--button-border-radius);border:1px solid transparent;font-size:var(--font-size-button);font-weight:600;cursor:pointer;white-space:nowrap;transition:background .18s ease,transform .12s ease,box-shadow .18s ease}.btn:active{transform:scale(.97)}.btn-primary{background:var(--color-bg-button-primary);color:var(--color-text-invert)}.btn-primary:hover{box-shadow:0 8px 20px #00000038}.btn-secondary{background:var(--color-bg-button-secondary);border-color:var(--color-border-soft);color:var(--color-text-main)}.btn-secondary:hover{background:#e5e5ee}.btn-ghost{background:transparent;border:none;color:var(--color-text-muted)}.app-content{padding:16px 16px 20px;display:flex;flex-direction:column;gap:16px}.card{background:var(--color-bg-card);border-radius:18px;padding:14px 12px;box-shadow:0 4px 16px #00000008}.city-selector{display:flex;flex-wrap:wrap;gap:10px;align-items:center}.city-selector-label{font-size:var(--font-size-small);color:var(--color-text-muted)}.city-selector-selects{display:flex;flex-wrap:wrap;gap:8px}.city-select,.region-select{min-width:160px;padding:6px 10px;border-radius:999px;border:1px solid var(--color-border-soft);background:#fff;font-size:var(--font-size-base)}.time-info-card{display:flex;justify-content:space-between;align-items:center}.time-info-date,.time-info-time{font-size:var(--font-size-small);color:red;font-weight:600}.app-footer{padding:6px 16px 12px;color:var(--color-text-muted);text-align:right}.prayer-table-wrapper{display:flex;flex-direction:column;gap:10px}.prayer-table-header{display:grid;grid-template-columns:1.4fr repeat(2,1fr);align-items:center;padding:6px 10px;border-radius:14px;background:var(--color-table-header-bg);font-size:var(--font-size-small);font-weight:600;color:var(--color-text-muted)}.prayer-table-header>div:first-child{text-align:left;padding-left:var(--table-cell-padding-x)}.prayer-table-header>div:not(:first-child){text-align:center}.prayer-table-body{display:flex;flex-direction:column;gap:4px}.prayer-row{display:grid;grid-template-columns:1.4fr repeat(2,1fr);align-items:stretch;min-height:var(--table-row-min-height);border-radius:12px;border:1px solid var(--color-border-soft);overflow:hidden;background:#fff}.prayer-row--active{background:#00ff0d;border-color:#00ff0d}.prayer-row--active .time-cell{background:transparent}.prayer-row-name{display:flex;align-items:center;padding:var(--table-cell-padding-y) var(--table-cell-padding-x);font-size:var(--font-size-prayer-name);font-weight:600}.time-cell{border-left:1px solid var(--color-border-soft);padding:var(--table-cell-padding-y) var(--table-cell-padding-x);display:flex;flex-direction:column;justify-content:space-between;text-align:center}.time-cell--centered{justify-content:center}.time-cell-time{font-size:var(--font-size-time-main);font-weight:600;color:var(--color-time-main)}.time-cell-label{font-size:var(--font-size-small);color:var(--color-text-muted)}.time-cell-countdown{margin-top:4px;font-size:var(--font-size-timer);font-weight:500;color:var(--color-timer)}@keyframes modeToastAnim{0%{transform:scale(0);opacity:0}30%{transform:scale(1);opacity:1}70%{transform:scale(1);opacity:1}to{transform:scale(0);opacity:0}}.modal-overlay{position:fixed;inset:0;background:var(--color-modal-overlay);display:flex;align-items:center;justify-content:center;z-index:50}.modal{background:var(--color-modal-bg);border-radius:18px;max-width:720px;width:min(720px,100vw - 24px);height:min(80vh,640px);display:flex;flex-direction:column;overflow:hidden;box-shadow:var(--shadow-soft)}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--color-border-soft)}.modal-title{font-size:var(--font-size-modal-title);font-weight:700}.modal-close-button{width:32px;height:32px;font-size:30px;border-radius:999px;border:none;background:#fbeaea;color:#b71c1c;cursor:pointer;font-weight:700;display:flex;align-items:center;justify-content:center}.modal-body{padding:12px 16px 16px;overflow-y:auto;flex:1 1 auto}.modal-tabs{display:flex;gap:8px;margin-bottom:12px}.modal-tab{padding:6px 12px;border-radius:999px;border:1px solid transparent;background:transparent;cursor:pointer;font-size:var(--font-size-small)}.modal-tab--active{background:var(--color-tag-bg);border-color:var(--color-border-soft);font-weight:600}.modal-tabs{display:flex;gap:8px;margin-bottom:10px}.modal-tab{padding:6px 4px;border-radius:999px;border:1px solid transparent;background:transparent;cursor:pointer;font-size:30px;font-weight:400}.modal-tab--active{background:var(--color-tag-bg);border-color:var(--color-border-soft);font-weight:700}.modal-footer{padding:10px 16px 14px;border-top:1px solid var(--color-border-soft);display:flex;gap:8px;justify-content:flex-end;flex-shrink:0}.qr-section{display:flex;justify-content:space-between;align-items:flex-end;padding:12px 24px 8px;gap:24px}.qr-section-left{display:flex;flex-direction:column;align-items:center;gap:8px}.qr-image{width:120px;height:120px;object-fit:contain}.qr-link{font-size:24px;font-weight:600;text-decoration:none;color:#222}.qr-section-right{display:flex;flex-direction:column;align-items:center;gap:8px}.qr-minaret-image{width:120px;height:auto;object-fit:contain}.qr-source{font-size:14px;color:var(--color-text-muted)}.modal-confirm-overlay{position:absolute;inset:0;background:#fffffff0;display:flex;align-items:center;justify-content:center}.modal-confirm-box{background:#fff;border-radius:16px;padding:16px 18px;box-shadow:var(--shadow-soft);max-width:340px;width:100%}.modal-confirm-title{font-weight:700;margin-bottom:20px;font-size:20px}.modal-confirm-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:10px}.dalil-list{font-size:var(--font-size-small);display:flex;flex-direction:column;gap:6px}.dalil-item-link{color:#1976d2;text-decoration:underline;cursor:pointer}.modal{font-size:18px;line-height:1.4}.modal-title{font-size:20px;font-weight:700}.modal-body p,.modal-body li,.modal-body label,.modal-body input,.modal-body select{font-size:30px}.modal-footer .btn{font-size:20px;height:24px}@media(min-width:0px)and (max-width:599px)and (min-height:375px)and (max-height:950px){.modal-body p,.modal-body li,.modal-body label,.modal-body input,.modal-body select{font-size:17px}.time-info-card{align-items:flex-start;gap:4px}.prayer-row,.prayer-table-header{grid-template-columns:1.2fr repeat(2,minmax(0,1fr))}.time-cell-time,.app-title-city{font-size:20px}.app-title-sub{font-size:16px}.qr-section{flex-direction:column;align-items:center;padding-inline:0}.qr-link{font-size:20px}.modal-tabs{display:flex;gap:8px;margin-bottom:12px}.modal-tab{padding:6px 12px;border-radius:999px;border:1px solid transparent;background:transparent;cursor:pointer;font-size:var(--font-size-small)}.modal-tab--active{background:var(--color-tag-bg);border-color:var(--color-border-soft);font-weight:600}.modal-tabs{display:flex;gap:8px;margin-bottom:10px}.modal-tab{padding:6px 4px;border-radius:999px;border:1px solid transparent;background:transparent;cursor:pointer;font-size:15px;font-weight:400}.modal-tab--active{background:var(--color-tag-bg);border-color:var(--color-border-soft);font-weight:700}.mode-toast-overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:40}.mode-toast{background:var(--color-toast-bg);border-radius:999px;padding:18px 24px;max-width:80vw;text-align:center;font-size:30px;font-weight:700;transform-origin:center;animation:modeToastAnim 1s ease-in-out forwards}}@media(min-width:600px)and (max-width:1079px)and (min-height:600px)and (max-height:1100px){.app-header{align-items:flex-start}.modal-body p,.modal-body li,.modal-body label,.modal-body input,.modal-body select{font-size:20px}.prayer-row,.prayer-table-header{grid-template-columns:1.2fr repeat(2,minmax(0,1fr))}}@media(max-width:720px){.app-shell{border-radius:0}.app-header{padding-inline:8px;grid-template-columns:auto 1fr auto;column-gap:8px}.app-header-left,.app-header-right{justify-content:center}.app-header-center{text-align:center}.app-content{padding-inline:8px}.prayer-row,.prayer-table-header{grid-template-columns:1.4fr repeat(2,minmax(0,1fr))}.btn{padding-inline:10px;font-size:14px;height:calc(var(--button-height) - 10px)}.mode-toast-overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:40}.mode-toast{background:var(--color-toast-bg);border-radius:999px;padding:18px 24px;max-width:80vw;text-align:center;font-size:130px;font-weight:700;transform-origin:center;animation:modeToastAnim 1s ease-in-out forwards}}@media(min-width:1080px)and (max-width:1100px)and (min-height:1920px){:root{--font-size-base: 18px;--font-size-heading-main: 80px;--font-size-heading-sub: 40px;--font-size-small: 40px;--font-size-prayer-name: 50px;--font-size-time-main: 50px;--font-size-timer: 40px;--button-height: 60px;--table-row-min-height: 74px;--layout-max-width: 1000px;--font-size-button: 25px}.modal-body p,.modal-body li,.modal-body label,.modal-body input,.modal-body select{font-size:30px}.app-root{padding:24px}.qr-section{display:flex;justify-content:space-between;align-items:center;padding:12px 24px 8px;gap:24px}.qr-section-left,.qr-section-right{display:flex;flex-direction:column;align-items:center;gap:8px}.qr-image{width:400px;height:400px;object-fit:contain}.qr-minaret-image{width:400px;height:auto;object-fit:contain}.qr-link{font-size:60px;font-weight:600;text-decoration:none;color:#222}.qr-source{font-size:30px;color:var(--color-text-muted)}.modal-close-button{width:70px;height:70px;font-size:60px}.modal{font-size:18px;line-height:2.2;width:1200px;height:40%}.modal-overlay{width:100%;height:100%}.mode-toast-overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:40}.mode-toast{background:var(--color-toast-bg);border-radius:999px;padding:18px 24px;max-width:80vw;text-align:center;font-size:280px;font-weight:700;transform-origin:center;animation:modeToastAnim 1s ease-in-out forwards}}