:root{--color-primary: #0D5C63;--color-primary-light: #187D87;--color-primary-dark: #073B40;--color-primary-surface: #EEF8F8;--color-accent: #E5A93C;--color-accent-light: #F3C367;--color-accent-dark: #C98B22;--color-accent-surface: #FEF8EC;--color-level-0: #8E9BAE;--color-level-1: #38A3A5;--color-level-2: #22577A;--color-level-3: #E76F51;--color-level-4: #E9C46A;--color-level-5: #7209B7;--color-level-6: #F72585;--color-bg: #F7FAFC;--color-bg-secondary: #EDF2F7;--color-surface: #FFFFFF;--color-surface-hover: #FCFEFF;--color-text-main: #13222F;--color-text-muted: #596B7E;--color-text-subtle: #8798A8;--color-border: #E2E8F0;--color-border-focus: #187D87;--color-success: #10B981;--color-danger: #EF4444;--font-family-heading: "Noto Kufi Arabic", system-ui, -apple-system, sans-serif;--font-family-body: "IBM Plex Sans Arabic", system-ui, -apple-system, sans-serif;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-size-4xl: 2.25rem;--font-weight-regular: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-weight-extrabold: 800;--space-2xs: .25rem;--space-xs: .5rem;--space-sm: .75rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem;--space-2xl: 3rem;--space-3xl: 4rem;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 18px;--radius-xl: 24px;--radius-full: 9999px;--shadow-sm: 0 1px 2px 0 rgba(19, 34, 47, .05);--shadow-md: 0 4px 12px -2px rgba(19, 34, 47, .08), 0 2px 6px -1px rgba(19, 34, 47, .04);--shadow-lg: 0 12px 24px -4px rgba(19, 34, 47, .12), 0 4px 8px -2px rgba(19, 34, 47, .04);--shadow-hover: 0 16px 32px -4px rgba(13, 92, 99, .16), 0 4px 10px -2px rgba(13, 92, 99, .08);--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-normal: .25s cubic-bezier(.4, 0, .2, 1);--transition-smooth: .35s cubic-bezier(.16, 1, .3, 1);--container-max-width: 90%}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;scroll-behavior:smooth;direction:rtl;text-align:right;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-family-body);background-color:var(--color-bg);color:var(--color-text-main);line-height:1.6;min-height:100vh;display:flex;flex-direction:column}#root{min-height:100vh;display:flex;flex-direction:column}h1,h2,h3,h4,h5,h6{font-family:var(--font-family-heading);font-weight:var(--font-weight-bold);line-height:1.3;color:var(--color-text-main)}a{color:inherit;text-decoration:none}button,input,select,textarea{font-family:inherit;font-size:inherit}.container{width:90%!important;max-width:90%!important;margin-inline:auto!important;padding-inline:var(--space-xs)}@media(min-width:768px){.container{width:90%!important;max-width:90%!important;padding-inline:var(--space-md)}}.badge{display:inline-flex;align-items:center;gap:var(--space-2xs);padding:.25rem .75rem;border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);font-family:var(--font-family-heading)}.badge-primary{background-color:var(--color-primary-surface);color:var(--color-primary);border:1px solid rgba(13,92,99,.15)}.badge-gold{background-color:var(--color-accent-surface);color:var(--color-accent-dark);border:1px solid rgba(229,169,60,.3)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-xs);padding:.625rem 1.25rem;border-radius:var(--radius-md);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-fast);border:1px solid transparent}.btn-primary{background-color:var(--color-primary);color:#fff}.btn-primary:hover{background-color:var(--color-primary-light);transform:translateY(-1px);box-shadow:var(--shadow-md)}.btn-outline{background-color:transparent;color:var(--color-primary);border-color:var(--color-primary)}.btn-outline:hover{background-color:var(--color-primary-surface)}.form-group{display:flex;flex-direction:column;gap:.4rem}.form-label{font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);color:var(--color-text-main);display:flex;align-items:center;gap:.25rem}.form-label .req{color:var(--color-error, #dc3545);font-weight:700}.form-input,.form-select,.form-textarea{width:100%;padding:.7rem 1rem;border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:var(--font-size-sm);font-family:var(--font-family-body, inherit);background-color:#fff;color:var(--color-text-main);transition:all var(--transition-fast);box-sizing:border-box}.form-input:focus,.form-select:focus,.form-textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #0d5c631f;background-color:#fff}.form-input::placeholder,.form-textarea::placeholder{color:var(--color-text-light, #94A3B8)}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fadeIn var(--transition-smooth) forwards}@keyframes pulseGlow{0%,to{opacity:.9;transform:scale(1)}50%{opacity:1;transform:scale(1.02)}}.animate-pulse{animation:pulseGlow 2.5s infinite ease-in-out}@keyframes mistDrift{0%{transform:translate(0) scale(1);opacity:.5}50%{transform:translate(-15px) scale(1.08);opacity:.75}to{transform:translate(0) scale(1);opacity:.5}}@keyframes spinLoader{to{transform:rotate(360deg)}}.spin-loader{animation:spinLoader 1s linear infinite;color:var(--color-primary)}.city-detail-page{padding-bottom:var(--space-3xl)}.city-nav-bar{background:var(--color-surface);border-bottom:1px solid var(--color-border);padding:var(--space-sm) 0;margin-bottom:var(--space-lg)}.city-nav-inner{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--space-sm)}.city-back-btn{display:inline-flex;align-items:center;gap:var(--space-xs);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-primary);padding:.4rem .8rem;border-radius:var(--radius-md);background:var(--color-primary-surface);transition:all var(--transition-fast)}.city-back-btn:hover{background:#0d5c6326;transform:translate(2px)}.city-nav-breadcrumbs{display:flex;align-items:center;gap:var(--space-xs);font-size:var(--font-size-xs);color:var(--color-text-muted)}.crumb-active{font-weight:var(--font-weight-semibold);color:var(--color-text-main)}.city-detail-loading,.city-detail-error{min-height:50vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:var(--space-3xl) var(--space-md);gap:var(--space-md)}.loading-text{color:var(--color-text-muted);font-size:var(--font-size-lg)}.error-card{max-width:500px;background:var(--color-surface);padding:var(--space-2xl);border-radius:var(--radius-xl);border:1px solid var(--color-border);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;align-items:center;gap:var(--space-md)}.city-hero-banner{margin-bottom:var(--space-2xl)}.city-hero-card{background:linear-gradient(135deg,#FFFFFF 0%,var(--color-primary-surface) 100%);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:var(--space-xl);box-shadow:var(--shadow-md);display:grid;grid-template-columns:1fr;gap:var(--space-xl)}@media(min-width:900px){.city-hero-card{grid-template-columns:1fr 220px;align-items:center}}.city-hero-title-row{display:flex;align-items:center;flex-wrap:wrap;gap:var(--space-md);margin-bottom:var(--space-xs)}.city-section-title{font-size:var(--font-size-3xl);color:var(--color-text-main);letter-spacing:-.5px}.city-level-badge-large{display:inline-flex;align-items:center;gap:var(--space-xs);padding:.35rem .9rem;border-radius:var(--radius-full);font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);border:1px solid currentColor}.city-hero-subtitle{color:var(--color-text-muted);font-size:var(--font-size-base);margin-bottom:var(--space-lg);max-width:650px}.city-progress-module{background:#fff;border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-md) var(--space-lg);box-shadow:var(--shadow-sm)}.progress-labels-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-xs);flex-wrap:wrap;gap:var(--space-xs)}.progress-target-label{font-size:var(--font-size-sm);color:var(--color-text-main)}.progress-remaining-badge{background:var(--color-accent-surface);color:var(--color-accent-dark);border:1px solid rgba(229,169,60,.35);padding:.2rem .65rem;border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold)}.city-progress-track{width:100%;height:12px;background-color:var(--color-bg-secondary);border-radius:var(--radius-full);overflow:hidden;margin-bottom:var(--space-xs)}.city-progress-fill{height:100%;border-radius:var(--radius-full);transition:width var(--transition-smooth)}.progress-milestone-footer{display:flex;align-items:center;justify-content:space-between;font-size:var(--font-size-xs);color:var(--color-text-subtle)}.city-balance-plaque{background:var(--color-primary-dark);color:#fff;border-radius:var(--radius-lg);padding:var(--space-lg);text-align:center;display:flex;flex-direction:column;justify-content:center;align-items:center;box-shadow:var(--shadow-md);position:relative;overflow:hidden}.city-balance-plaque:before{content:"";position:absolute;top:-30px;right:-30px;width:100px;height:100px;background:radial-gradient(circle,rgba(229,169,60,.25) 0%,transparent 70%);border-radius:50%}.balance-plaque-label{font-size:var(--font-size-xs);color:#ffffffbf;margin-bottom:var(--space-2xs)}.balance-plaque-number{font-family:var(--font-family-heading);font-size:var(--font-size-4xl);font-weight:var(--font-weight-extrabold);line-height:1.1;color:var(--color-accent)}.balance-plaque-unit{font-size:var(--font-size-xs);color:#ffffffd9;margin-top:var(--space-2xs)}.landmarks-section{margin-bottom:var(--space-3xl)}.landmarks-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--space-lg)}@media(min-width:1100px){.landmarks-grid{grid-template-columns:repeat(4,1fr)}}.landmark-hybrid-card{background:#fff;border:2px solid var(--color-border);border-radius:var(--radius-xl);overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--shadow-sm);transition:all var(--transition-normal);position:relative}.landmark-hybrid-card.is-unlocked{border-color:var(--card-theme-border);box-shadow:var(--shadow-md)}.landmark-hybrid-card.is-unlocked:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover)}.landmark-hybrid-card.is-fogged{border-color:var(--color-accent);background:linear-gradient(180deg,#fff,#fef8ec);box-shadow:0 8px 24px -4px #e5a93c40}.landmark-hybrid-card.is-future{opacity:.65;background:#fafafa}.landmark-card-header{padding:var(--space-sm) var(--space-md);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--color-border);background:#f7fafccc}.landmark-level-badge{font-size:var(--font-size-xs);font-weight:var(--font-weight-bold);color:var(--card-theme-badge)}.landmark-status-badge{display:inline-flex;align-items:center;gap:4px;font-size:var(--font-size-xs);padding:.15rem .55rem;border-radius:var(--radius-full);font-weight:var(--font-weight-medium)}.status-unlocked{background:#dcfce7;color:#15803d}.status-target{background:#fef3c7;color:#b45309;border:1px solid rgba(245,158,11,.4)}.status-locked{background:#f1f5f9;color:#64748b}.landmark-visual-stage{position:relative;width:100%;height:200px;background:radial-gradient(circle at 50% 30%,#FFFFFF 0%,var(--card-theme-bg) 100%);display:flex;align-items:center;justify-content:center;overflow:hidden}.geometric-podium{position:absolute;bottom:12px;width:80%;height:20px;display:flex;flex-direction:column;align-items:center;z-index:1}.podium-top{width:90%;height:8px;background:var(--card-theme-border);opacity:.85;border-radius:4px 4px 0 0}.podium-base{width:100%;height:12px;background:var(--color-primary-dark);border-radius:0 0 6px 6px}.landmark-hero-wrapper{position:relative;z-index:2;width:160px;height:160px;display:flex;align-items:center;justify-content:center}.landmark-hero-img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 8px 12px rgba(0,0,0,.12));transition:transform var(--transition-smooth)}.landmark-hybrid-card.is-unlocked:hover .landmark-hero-img{transform:scale(1.08) translateY(-4px)}.landmark-hybrid-card.is-fogged .landmark-hero-img{filter:blur(14px) grayscale(40%) contrast(85%);opacity:.35;transform:scale(.95)}.fog-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:10;display:flex;align-items:center;justify-content:center;background:#fef3c759;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);overflow:hidden}.fog-mist{position:absolute;border-radius:50%;pointer-events:none}.fog-mist-1{width:160px;height:100px;top:20%;right:-20px;background:radial-gradient(ellipse,rgba(255,255,255,.85) 0%,transparent 70%);animation:mistDrift 6s infinite ease-in-out}.fog-mist-2{width:180px;height:90px;bottom:10%;left:-20px;background:radial-gradient(ellipse,rgba(253,230,138,.6) 0%,transparent 70%);animation:mistDrift 8s infinite ease-in-out reverse}.fog-mist-3{width:220px;height:120px;top:40%;left:20%;background:radial-gradient(ellipse,rgba(255,255,255,.7) 0%,transparent 70%);animation:mistDrift 7s infinite ease-in-out}.fog-anticipation-badge{position:relative;z-index:12;background:#13222fd9;color:#fff;border:1px solid rgba(229,169,60,.6);border-radius:var(--radius-lg);padding:var(--space-sm) var(--space-md);text-align:center;box-shadow:0 10px 25px #00000040;max-width:85%;transform:translateY(-5px)}.fog-icon-wrap{margin-bottom:4px}.fog-icon-float{color:var(--color-accent)}.fog-badge-title{font-size:var(--font-size-xs);color:#ffffffd9;margin-bottom:2px}.fog-badge-count{font-size:var(--font-size-sm);color:#fff}.fog-badge-count strong{color:var(--color-accent);font-size:var(--font-size-base);margin-inline:2px}.landmark-hybrid-card.is-future .landmark-hero-img{filter:blur(6px) grayscale(90%);opacity:.25}.future-lock-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:#fff6;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:5}.future-lock-pill{display:inline-flex;align-items:center;gap:6px;background:#334155;color:#f8fafc;padding:.35rem .8rem;border-radius:var(--radius-full);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium)}.landmark-info-footer{padding:var(--space-md);display:flex;flex-direction:column;gap:var(--space-2xs);flex-grow:1}.landmark-name{font-size:var(--font-size-base);color:var(--color-text-main);line-height:1.3}.landmark-description{font-size:var(--font-size-xs);color:var(--color-text-muted);line-height:1.5;flex-grow:1}.landmark-threshold-row{display:flex;align-items:center;justify-content:space-between;margin-top:var(--space-xs);padding-top:var(--space-xs);border-top:1px dashed var(--color-border);font-size:var(--font-size-xs)}.threshold-label{color:var(--color-text-subtle)}.threshold-value{font-weight:var(--font-weight-semibold);color:var(--color-text-main)}.city-aux-grid{display:grid;grid-template-columns:1fr;gap:var(--space-xl);margin-top:var(--space-xl)}@media(min-width:960px){.city-aux-grid{grid-template-columns:1fr 1fr}}.leaderboard-card,.activity-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:var(--space-lg);box-shadow:var(--shadow-sm);display:flex;flex-direction:column}.leaderboard-header,.activity-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-md);padding-bottom:var(--space-sm);border-bottom:1px solid var(--color-border)}.leaderboard-title-group,.activity-title-group{display:flex;align-items:center;gap:var(--space-sm)}.leaderboard-icon-box{width:36px;height:36px;border-radius:var(--radius-md);background:var(--color-accent-surface);display:flex;align-items:center;justify-content:center}.activity-icon-box{width:36px;height:36px;border-radius:var(--radius-md);background:var(--color-primary-surface);display:flex;align-items:center;justify-content:center}.leaderboard-title,.activity-title{font-size:var(--font-size-base);color:var(--color-text-main);margin-bottom:2px}.leaderboard-subtitle,.activity-subtitle{font-size:var(--font-size-xs);color:var(--color-text-muted)}.leaderboard-list{display:flex;flex-direction:column;gap:var(--space-xs)}.leaderboard-item{display:flex;align-items:center;padding:var(--space-sm);border-radius:var(--radius-md);background:#f8fafc;border:1px solid transparent;transition:all var(--transition-fast);gap:var(--space-sm)}.leaderboard-item:hover{background:var(--color-primary-surface);border-color:#0d5c6333;transform:translate(-2px)}.leaderboard-item.is-current-section{background:#fef8ec;border:1.5px solid var(--color-accent);box-shadow:0 2px 8px #e5a93c33}.leaderboard-rank-col{width:32px;display:flex;align-items:center;justify-content:center}.rank-badge{font-size:var(--font-size-base)}.rank-normal{font-weight:var(--font-weight-bold);color:var(--color-text-muted);font-size:var(--font-size-sm)}.leaderboard-info-col{flex-grow:1}.leaderboard-name-row{display:flex;align-items:center;gap:var(--space-xs)}.leaderboard-section-name{font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);color:var(--color-text-main)}.current-section-tag{display:inline-flex;align-items:center;gap:3px;background:var(--color-accent);color:#fff;font-size:.68rem;padding:.1rem .45rem;border-radius:var(--radius-full);font-weight:var(--font-weight-bold)}.leaderboard-level-sub{font-size:var(--font-size-xs);color:var(--color-text-subtle)}.leaderboard-points-col{text-align:left}.leaderboard-points-val{font-family:var(--font-family-heading);font-weight:var(--font-weight-bold);font-size:var(--font-size-base);color:var(--color-primary);margin-inline-end:4px}.leaderboard-points-unit{font-size:var(--font-size-xs);color:var(--color-text-muted)}.leaderboard-arrow{color:var(--color-text-subtle);transition:transform var(--transition-fast)}.leaderboard-item:hover .leaderboard-arrow{transform:translate(-3px);color:var(--color-primary)}.activity-list{display:flex;flex-direction:column;gap:var(--space-xs)}.activity-empty{padding:var(--space-xl);text-align:center;color:var(--color-text-muted);font-size:var(--font-size-sm);display:flex;flex-direction:column;align-items:center;gap:var(--space-xs)}.activity-item{display:flex;align-items:center;padding:var(--space-sm);border-radius:var(--radius-md);background:#f8fafc;gap:var(--space-sm)}.activity-pill{display:inline-flex;align-items:center;gap:4px;padding:.3rem .65rem;border-radius:var(--radius-md);font-weight:var(--font-weight-bold);font-size:var(--font-size-xs);font-family:var(--font-family-heading)}.points-plus{background:#dcfce7;color:#15803d}.points-minus{background:#fee2e2;color:#dc2626}.activity-content-col{flex-grow:1}.activity-category-name{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-main)}.activity-note-text{font-size:var(--font-size-xs);color:var(--color-text-muted);margin-top:1px}.activity-time-col{font-size:var(--font-size-xs);color:var(--color-text-subtle);white-space:nowrap}@keyframes card-pulse-ring{0%{box-shadow:0 0 #0d5c6373,var(--shadow-md)}40%{box-shadow:0 0 0 8px #0d5c6300,var(--shadow-md)}to{box-shadow:0 0 #0d5c6300,var(--shadow-md)}}.section-card--pulse{animation:card-pulse-ring 1.2s cubic-bezier(.4,0,.6,1) forwards;border-color:#0d5c6366!important}.cel-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:9000;display:flex;align-items:center;justify-content:center;background:#071e22d1;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}.cel-beat1{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem;opacity:0;pointer-events:none;transition:opacity .4s ease}.cel-beat1--active{opacity:1;pointer-events:auto}.cel-beat1--exit{opacity:0;pointer-events:none}.cel-fog-layer{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none}@keyframes fog-dissolve{0%{opacity:.9;transform:scale(1) translateY(0);filter:blur(0px)}60%{opacity:.4;transform:scale(1.08) translateY(-20px);filter:blur(6px)}to{opacity:0;transform:scale(1.15) translateY(-40px);filter:blur(12px)}}.cel-fog-particle{position:absolute;border-radius:50%;background:#b4dce659;animation:fog-dissolve 2s ease-in forwards}.cel-fog-p1{width:420px;height:420px;top:15%;left:10%;animation-delay:0s}.cel-fog-p2{width:300px;height:300px;top:40%;right:8%;animation-delay:.25s}.cel-fog-p3{width:260px;height:260px;bottom:20%;left:30%;animation-delay:.15s}.cel-fog-p4{width:200px;height:200px;top:60%;right:30%;animation-delay:.4s}@keyframes landmark-rise{0%{opacity:0;transform:translateY(80px) scale(.82)}55%{opacity:1;transform:translateY(-10px) scale(1.04)}75%{transform:translateY(4px) scale(.98)}90%{transform:translateY(-3px) scale(1.01)}to{opacity:1;transform:translateY(0) scale(1)}}.cel-landmark-stage{position:relative;display:flex;align-items:center;justify-content:center;z-index:2}.cel-landmark-img{width:220px;height:220px;object-fit:contain;filter:drop-shadow(0 20px 40px rgba(13,92,99,.5));animation:landmark-rise 1.4s cubic-bezier(.16,1,.3,1) forwards;animation-delay:.3s;opacity:0}.cel-landmark-glow{position:absolute;width:240px;height:240px;border-radius:50%;background:radial-gradient(ellipse,rgba(56,163,165,.3) 0%,transparent 70%);animation:landmark-rise 1.4s cubic-bezier(.16,1,.3,1) forwards;animation-delay:.3s;opacity:0}.cel-beat1-caption{display:flex;align-items:center;gap:.5rem;color:#c8f0f5e6;font-size:1.1rem;font-family:var(--font-family-heading);font-weight:var(--font-weight-semibold);animation:landmark-rise 1s ease forwards;animation-delay:.8s;opacity:0;z-index:2}.cel-caption-icon{color:var(--color-accent-light);animation:spin 3s linear infinite}.cel-beat2{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .45s ease}.cel-beat2--active{opacity:1;pointer-events:auto}.cel-confetti-container{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none}@keyframes confetti-fall{0%{transform:translateY(-40px) rotate(var(--rotate)) scaleX(1);opacity:1}80%{opacity:.85}to{transform:translateY(105vh) rotate(calc(var(--rotate) + 540deg)) scaleX(.6);opacity:0}}.cel-confetti-piece{position:absolute;top:-30px;border-radius:2px;animation:confetti-fall linear infinite;will-change:transform}.cel-confetti-circle{border-radius:50%}@keyframes banner-pop{0%{opacity:0;transform:scale(.72) translateY(30px)}60%{opacity:1;transform:scale(1.04) translateY(-6px)}80%{transform:scale(.98) translateY(2px)}to{opacity:1;transform:scale(1) translateY(0)}}.cel-banner{position:relative;z-index:2;background:linear-gradient(145deg,#fff,#f0fafb);border:2px solid rgba(56,163,165,.3);border-radius:var(--radius-xl);padding:2.5rem 3rem;max-width:420px;width:90vw;text-align:center;box-shadow:0 30px 60px #071e2259,0 0 0 1px #38a3a526,inset 0 1px #fffc;animation:banner-pop .55s cubic-bezier(.16,1,.3,1) forwards;display:flex;flex-direction:column;align-items:center;gap:.75rem}.cel-banner-stars{font-size:1.5rem;color:var(--color-accent);letter-spacing:.5rem;line-height:1}.cel-banner-level-badge{display:inline-flex;align-items:center;gap:.4rem;background:var(--color-primary-surface);color:var(--color-primary);border:1px solid rgba(13,92,99,.2);border-radius:var(--radius-full);padding:.3rem 1rem;font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);font-family:var(--font-family-heading)}.cel-banner-title{font-family:var(--font-family-heading);font-size:clamp(2rem,5vw,2.75rem);font-weight:var(--font-weight-extrabold);color:var(--color-primary-dark);line-height:1.1}.cel-banner-subtitle{font-size:var(--font-size-base);color:var(--color-text-muted)}.cel-banner-landmark{font-family:var(--font-family-heading);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-primary);background:var(--color-primary-surface);border-radius:var(--radius-lg);padding:.5rem 1.25rem;border:1px solid rgba(13,92,99,.15)}.cel-banner-img{width:100px;height:100px;object-fit:contain;filter:drop-shadow(0 6px 16px rgba(13,92,99,.25));margin:.25rem 0}.cel-queue-dots{display:flex;gap:.5rem;align-items:center;justify-content:center;margin-top:.25rem}.cel-queue-dot{width:8px;height:8px;border-radius:50%;background:var(--color-border);transition:all var(--transition-fast)}.cel-queue-dot--active{background:var(--color-primary);width:20px;border-radius:var(--radius-full)}.cel-queue-dot--done{background:var(--color-success)}.cel-skip-btn{position:fixed;bottom:2.5rem;left:50%;transform:translate(-50%);z-index:9100;display:inline-flex;align-items:center;gap:.5rem;background:#ffffff1f;color:#ffffffd9;border:1px solid rgba(255,255,255,.2);border-radius:var(--radius-full);padding:.6rem 1.5rem;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);font-family:var(--font-family-heading);cursor:pointer;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:all var(--transition-normal);white-space:nowrap}.cel-skip-btn:hover{background:#ffffff38;border-color:#fff6;color:#fff;transform:translate(-50%) translateY(-2px)}.cel-skip-btn:active{transform:translate(-50%) translateY(0)}.active-season-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:1.75rem;box-shadow:0 4px 20px #0000000a;margin-bottom:2rem;position:relative;overflow:hidden;transition:all var(--transition-normal)}.active-season-card:before{content:"";position:absolute;top:0;right:0;left:0;height:4px;background:linear-gradient(90deg,var(--color-primary),var(--color-accent))}.active-season-head{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;padding-bottom:1.5rem;border-bottom:1px solid var(--color-border)}.active-season-title-box{display:flex;flex-direction:column;gap:.5rem}.active-status-pulse-pill{display:inline-flex;align-items:center;gap:.5rem;background:#10b9811f;color:#059669;border:1px solid rgba(16,185,129,.25);border-radius:var(--radius-full);padding:.25rem .75rem;font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);width:fit-content}.pulse-dot{width:8px;height:8px;border-radius:50%;background:#10b981;box-shadow:0 0 #10b981b3;animation:pulse-green 2s infinite}@keyframes pulse-green{0%{transform:scale(.95);box-shadow:0 0 #10b981b3}70%{transform:scale(1);box-shadow:0 0 0 8px #10b98100}to{transform:scale(.95);box-shadow:0 0 #10b98100}}.active-season-name{font-size:var(--font-size-2xl);font-weight:var(--font-weight-extrabold);color:var(--color-text-main);margin:0}.btn-gold-shimmer{background:linear-gradient(135deg,#0d5c63,#13747c,#d49b28)!important;color:#fff!important;border:none!important;box-shadow:0 4px 15px #d49b2840!important;transition:all var(--transition-normal)}.btn-gold-shimmer:hover{transform:translateY(-2px);box-shadow:0 6px 20px #d49b2861!important}.active-season-metrics-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.25rem;margin:1.5rem 0}.season-metric-box{display:flex;align-items:center;gap:1rem;padding:1rem 1.25rem;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);transition:transform var(--transition-fast)}.season-metric-box:hover{transform:translateY(-2px)}.season-metric-box .metric-icon{width:44px;height:44px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;flex-shrink:0}.season-metric-box .metric-icon.teal{background:#0d5c631f;color:var(--color-primary)}.season-metric-box .metric-icon.gold{background:#e5a93c26;color:var(--color-accent-dark)}.season-metric-box .metric-icon.coral{background:#e76f511f;color:#e76f51}.season-metric-box .metric-info{display:flex;flex-direction:column;gap:.2rem}.season-metric-box .metric-label{font-size:var(--font-size-xs);color:var(--color-text-muted);font-weight:var(--font-weight-medium)}.season-metric-box .metric-val{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-text-main)}.active-season-notice{display:flex;align-items:flex-start;gap:.85rem;padding:1rem 1.25rem;background:#0d5c630d;border:1px dashed rgba(13,92,99,.25);border-radius:var(--radius-md);color:var(--color-primary-dark);font-size:var(--font-size-sm);line-height:1.6}.active-season-notice .notice-icon{color:var(--color-primary);flex-shrink:0;margin-top:2px}.archived-seasons-section{margin-top:2.5rem}.archived-section-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem}.archived-title{display:flex;align-items:center;gap:.65rem;font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);color:var(--color-text-main);margin:0 0 .35rem}.archived-subtitle{font-size:var(--font-size-sm);color:var(--color-text-muted);margin:0}.badge-count{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;padding:0 6px;border-radius:var(--radius-full);background:var(--color-primary);color:#fff;font-size:var(--font-size-xs);font-weight:var(--font-weight-bold)}.archived-cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:1.5rem}.archived-season-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:1.5rem;box-shadow:0 4px 15px #00000008;display:flex;flex-direction:column;justify-content:space-between;gap:1.25rem;transition:all var(--transition-normal)}.archived-season-card:hover{transform:translateY(-3px);border-color:#0d5c634d;box-shadow:0 8px 25px #00000012}.archived-card-top{display:flex;flex-direction:column;gap:.65rem}.archived-tag-row{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.archived-badge{display:inline-flex;align-items:center;gap:.35rem;background:#f1f5f9;color:#475569;border:1px solid #CBD5E1;border-radius:var(--radius-full);padding:.2rem .6rem;font-size:.72rem;font-weight:var(--font-weight-semibold)}.archived-date-text{font-size:.75rem;color:var(--color-text-subtle)}.archived-season-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-text-main);margin:0}.archived-card-stats{display:flex;flex-direction:column;gap:.65rem;background:var(--color-bg);padding:.85rem 1rem;border-radius:var(--radius-md);border:1px solid var(--color-border)}.archived-stat-item{display:flex;align-items:center;justify-content:space-between;font-size:var(--font-size-sm)}.archived-stat-item .stat-label{color:var(--color-text-muted)}.archived-stat-item .stat-value{font-weight:var(--font-weight-bold);color:var(--color-text-main)}.archived-stat-item .stat-value.gold{color:var(--color-accent-dark)}.archived-stat-item .stat-value.teal{color:var(--color-primary)}.archived-card-actions .btn-full-width{width:100%;display:flex;align-items:center;justify-content:center;gap:.5rem}.archived-empty-state{text-align:center;padding:3rem 1.5rem;background:var(--color-surface);border:2px dashed var(--color-border);border-radius:var(--radius-xl)}.archived-empty-state .empty-icon{color:var(--color-text-subtle);margin-bottom:.75rem}.archived-empty-state h4{font-size:var(--font-size-lg);color:var(--color-text-main);margin:0 0 .5rem}.archived-empty-state p{font-size:var(--font-size-sm);color:var(--color-text-muted);max-width:450px;margin:0 auto}.modal-season-confirm{max-width:580px}.modal-header.warning-header{border-bottom:1px solid #FED7AA;background:#fff7ed}.modal-header-icon-box.warning{background:#ffedd5;color:#ea580c}.modal-warning-callout{background:#fffbeb;border:1px solid #FDE68A;border-radius:var(--radius-md);padding:1rem 1.25rem;margin-bottom:1.5rem}.modal-warning-callout .warning-title{display:flex;align-items:center;gap:.5rem;color:#b45309;font-size:var(--font-size-sm);margin-bottom:.65rem}.warning-points-list{margin:0;padding-right:1.25rem;display:flex;flex-direction:column;gap:.45rem;font-size:var(--font-size-xs);color:#78350f;line-height:1.6}.confirm-checkbox-container{margin-top:1.25rem;padding:.85rem 1rem;background:#f8fafc;border:1px solid #E2E8F0;border-radius:var(--radius-md)}.checkbox-custom-label{display:flex;align-items:flex-start;gap:.65rem;cursor:pointer;-webkit-user-select:none;user-select:none}.checkbox-custom-label input[type=checkbox]{margin-top:3px;width:17px;height:17px;accent-color:#EA580C;cursor:pointer}.checkbox-custom-text{font-size:var(--font-size-xs);color:var(--color-text-main);line-height:1.5;font-weight:var(--font-weight-medium)}.btn-danger-action{background:#dc2626!important;color:#fff!important;border:none!important}.btn-danger-action:hover:not(:disabled){background:#b91c1c!important}.modal-season-inspection{max-width:820px;width:95%}.inspection-header-tag{display:inline-flex;align-items:center;gap:.35rem;background:#f1f5f9;color:#475569;border:1px solid #CBD5E1;border-radius:var(--radius-full);padding:.15rem .55rem;font-size:.72rem;font-weight:var(--font-weight-semibold);margin-bottom:.25rem}.inspection-summary-bar{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:1rem;background:var(--color-bg);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:1rem 1.25rem;margin-bottom:1.5rem}.summary-col{display:flex;flex-direction:column;gap:.25rem}.summary-col .col-label{font-size:var(--font-size-xs);color:var(--color-text-muted)}.summary-col .col-val{font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);color:var(--color-text-main)}.summary-col .col-val.gold{color:var(--color-accent-dark)}.summary-col .col-val.teal{color:var(--color-primary)}.inspection-subtabs{display:flex;gap:.75rem;border-bottom:1px solid var(--color-border);padding-bottom:.5rem;margin-bottom:1.25rem}.inspection-subtab{display:inline-flex;align-items:center;gap:.45rem;padding:.5rem 1rem;background:none;border:none;border-radius:var(--radius-md);font-family:var(--font-family-heading);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-muted);cursor:pointer;transition:all var(--transition-fast)}.inspection-subtab:hover{color:var(--color-primary);background:var(--color-bg)}.inspection-subtab.active{color:var(--color-primary);background:var(--color-primary-surface);font-weight:var(--font-weight-bold)}.inspection-table-wrapper{overflow-x:auto;border:1px solid var(--color-border);border-radius:var(--radius-lg);max-height:380px}.inspection-table{width:100%;border-collapse:collapse;text-align:right;font-size:var(--font-size-sm)}.inspection-table th{background:#f8fafc;padding:.85rem 1rem;font-weight:var(--font-weight-semibold);color:var(--color-text-muted);border-bottom:1px solid var(--color-border);position:sticky;top:0;z-index:2}.inspection-table td{padding:.85rem 1rem;border-bottom:1px solid var(--color-border);color:var(--color-text-main)}.inspection-table tr:hover td{background:#f8fafc}.inspection-empty-logs{text-align:center;padding:2.5rem 1rem;color:var(--color-text-muted)}.past-seasons-celebration-section{padding:5rem 0;background:linear-gradient(180deg,#f8fafc,#fff);border-top:1px solid var(--color-border)}.past-seasons-header{text-align:center;max-width:760px;margin:0 auto 3rem}.past-seasons-badge{display:inline-flex;align-items:center;gap:.5rem;background:#e5a93c26;color:var(--color-accent-dark);border:1px solid rgba(229,169,60,.3);border-radius:var(--radius-full);padding:.4rem 1.1rem;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);margin-bottom:1rem}.past-seasons-title{font-size:var(--font-size-3xl);font-weight:var(--font-weight-extrabold);color:var(--color-text-main);margin:0 0 1rem}.past-seasons-desc{font-size:var(--font-size-base);color:var(--color-text-muted);line-height:1.7;margin:0}.past-seasons-upcoming-card{max-width:600px;margin:0 auto;text-align:center;padding:3.5rem 2rem;background:var(--color-surface);border:2px dashed rgba(229,169,60,.35);border-radius:var(--radius-2xl)}.past-seasons-upcoming-card .upcoming-sparkle{color:var(--color-accent);margin-bottom:1rem}.past-seasons-upcoming-card h3{font-size:var(--font-size-xl);color:var(--color-text-main);margin:0 0 .5rem}.past-seasons-upcoming-card p{font-size:var(--font-size-sm);color:var(--color-text-muted);line-height:1.6;margin:0}.past-seasons-grid{display:flex;flex-direction:column;gap:3rem}.past-season-celebration-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-2xl);padding:2.25rem;box-shadow:0 10px 30px #0000000a;position:relative;overflow:hidden;transition:transform var(--transition-normal)}.past-season-celebration-card:hover{transform:translateY(-4px);box-shadow:0 16px 40px #00000014}.celebration-card-banner{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem;margin-bottom:1.5rem}.season-crown-badge{display:inline-flex;align-items:center;gap:.5rem;background:linear-gradient(135deg,#0d5c63,#187d87);color:#fff;border-radius:var(--radius-full);padding:.45rem 1.25rem;font-size:var(--font-size-base);font-weight:var(--font-weight-bold);box-shadow:0 4px 12px #0d5c6333}.season-dates-chip{font-size:var(--font-size-sm);color:var(--color-text-muted);background:var(--color-bg);padding:.35rem .85rem;border-radius:var(--radius-full);border:1px solid var(--color-border)}.celebration-collective-bar{display:flex;align-items:center;gap:.75rem;background:linear-gradient(90deg,#fef8ec,#fffdf8);border:1px solid #FDE68A;border-radius:var(--radius-lg);padding:.9rem 1.25rem;font-size:var(--font-size-sm);color:#78350f;margin-bottom:2rem}.celebration-collective-bar .star-icon{color:var(--color-accent);flex-shrink:0}.winners-podium{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.5rem;margin-bottom:1.75rem}.podium-card{border-radius:var(--radius-xl);padding:1.75rem 1.25rem;text-align:center;display:flex;flex-direction:column;align-items:center;position:relative;transition:all var(--transition-normal)}.podium-card.medal-gold{background:linear-gradient(180deg,#fffdf0,#fff8dc);border:2px solid #F3C367;box-shadow:0 8px 24px #e5a93c2e;order:1}.podium-card.medal-silver{background:linear-gradient(180deg,#f8fafc,#eef2f6);border:1.5px solid #CBD5E1;order:2}.podium-card.medal-bronze{background:linear-gradient(180deg,#fff7ed,#ffedd5);border:1.5px solid #FDBA74;order:3}.podium-card:hover{transform:translateY(-5px)}.medal-crown{font-size:2.25rem;margin-bottom:.5rem;line-height:1}.winner-landmark-visual{width:90px;height:90px;display:flex;align-items:center;justify-content:center;margin:.5rem 0 1rem;border-radius:50%;background:#fffc;box-shadow:0 4px 15px #0000000f}.winner-landmark-img{max-width:65px;max-height:65px;object-fit:contain}.winner-honor-title{display:inline-block;font-size:.75rem;font-weight:var(--font-weight-bold);padding:.2rem .65rem;border-radius:var(--radius-full);margin-bottom:.5rem}.podium-card.medal-gold .winner-honor-title{background:#e5a93c33;color:#92400e}.podium-card.medal-silver .winner-honor-title{background:#94a3b833;color:#334155}.podium-card.medal-bronze .winner-honor-title{background:#f9731633;color:#9a3412}.winner-section-name{font-size:var(--font-size-xl);font-weight:var(--font-weight-extrabold);color:var(--color-text-main);margin:0 0 .25rem}.winner-landmark-title{font-size:var(--font-size-xs);color:var(--color-text-muted);margin-bottom:.85rem}.winner-points-tag{display:inline-block;font-size:var(--font-size-sm);font-weight:var(--font-weight-extrabold);color:var(--color-primary-dark);background:#0d5c631a;padding:.3rem .85rem;border-radius:var(--radius-full)}.celebration-card-footer{display:flex;align-items:center;justify-content:center;gap:.65rem;padding-top:1.25rem;border-top:1px dashed var(--color-border);color:var(--color-text-muted);font-size:var(--font-size-sm);text-align:center}.celebration-card-footer svg{color:var(--color-accent);flex-shrink:0}html,body{overflow-x:hidden!important;width:100%;max-width:100vw}.main-content{width:100%;display:flex;flex-direction:column;align-items:stretch;flex:1}.landing-page,.city-detail-page,.teacher-dashboard-page,.points-entry-page,.supervisor-sections-page,.supervisor-users-page,.supervisor-settings-page,.supervisor-audit-log-page,.icon-studio-page{width:100%;max-width:100%;display:flex;flex-direction:column;align-items:stretch}.hero-section,.sections-container-section,.past-seasons-celebration-section,.landing-footer,.site-header{width:100%!important;max-width:100%!important;align-self:stretch!important}.container,.hero-container,.footer-container,.header-container,.dashboard-container,.city-container{width:90%!important;max-width:90%!important;margin-inline:auto!important}.table-responsive-wrapper{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin}.modal-card{width:min(92vw,680px)!important;max-width:92vw!important;max-height:92vh!important;border-radius:var(--radius-xl)!important}@media(max-width:640px){h1,.page-title,.brand-title{font-size:1.35rem!important}.container{width:94%!important;max-width:94%!important;padding-inline:var(--space-2xs)!important}.btn{padding:.5rem .75rem!important;font-size:var(--font-size-xs)!important}.form-input,.form-select,.form-textarea{font-size:var(--font-size-sm)!important}}
