#root{min-height:100vh}.app-shell{min-height:100vh;display:flex;flex-direction:column}.app-footer{width:min(var(--layout-max-width),100%);margin:0 auto;padding:.9rem 1.5rem 1.2rem;border-top:1px solid var(--color-border);color:var(--color-text-muted);font-size:.78rem;line-height:1.4;text-align:center}.app-footer p{margin:0}.page{flex:1;padding:clamp(2.5rem,5vw,4rem) 1.5rem 3rem;width:min(var(--layout-max-width),100%);margin:0 auto;display:grid;gap:clamp(2rem,5vw,3rem);justify-items:center}.landing-section{width:min(60rem,100%)}.page>.section-card,.page>.panel,.page>.stack,.page>form,.page>section{width:min(60rem,100%)}.page>nav{width:100%}.auth-page{align-content:center;min-height:calc(100vh - clamp(5rem,10vh,7rem));gap:2rem}.page-header{display:grid;gap:.75rem;max-width:54ch;text-align:center;justify-items:center}.page-header h1,.page-header h2,.page-header h3{margin:0;font-size:clamp(2rem,5vw,2.5rem);font-weight:700;color:var(--color-text)}.page-header p{margin:0;color:var(--color-text-muted);font-size:1rem}.section-card{background:var(--color-surface);border-radius:var(--radius-md);border:1px solid var(--color-border);box-shadow:var(--shadow-sm);padding:clamp(1.25rem,3vw,2rem);display:grid;gap:1.25rem}.auth-card{width:min(420px,100%);margin:0 auto}.panel{border:1px solid var(--color-border);border-radius:var(--radius-sm);padding:1rem 1.15rem;background:var(--color-surface);box-shadow:var(--shadow-sm);display:grid;gap:.5rem}.panel--muted{background:var(--color-surface-muted)}.section-heading{font-size:1.35rem;margin:0;font-weight:700}.inline-actions{display:flex;flex-wrap:wrap;gap:.75rem}.button,a.button{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;border-radius:var(--radius-sm);padding:.65rem 1.3rem;font-weight:700;text-decoration:none;background:var(--color-primary);color:var(--color-primary-on);box-shadow:var(--shadow-sm);border:1px solid transparent;transition:background .16s ease,transform .16s ease,box-shadow .16s ease,color .16s ease}.button:hover,a.button:hover{text-decoration:none;background:var(--color-primary-soft);transform:translateY(-1px);box-shadow:var(--shadow-md)}.button:focus-visible,a.button:focus-visible{outline:3px solid var(--color-secondary);outline-offset:3px}.button--ghost{background:transparent;color:var(--color-primary);border-color:#1b6f6759;box-shadow:none}.button--ghost:hover{background:#1b6f6714;box-shadow:none}.button--secondary{background:var(--color-secondary);color:#fff}button.game-card{background:transparent;color:inherit;border-radius:0;box-shadow:none;transition:none}button.game-card:hover{background:transparent;transform:none;box-shadow:none}button.game-card:active{background:transparent;transform:none}.badge{display:inline-flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:600;padding:.25rem .6rem;border-radius:999px;background:#1e6f671a;color:var(--color-primary)}.muted{color:var(--color-text-muted)}.table-wrapper{overflow-x:auto}.table{width:100%;border-collapse:collapse;min-width:640px}.table th,.table td{text-align:left;padding:.75rem 1rem;border-bottom:1px solid var(--color-border);font-size:.95rem}.table thead th{font-size:.85rem;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-muted)}.helper-text{font-size:.85rem;color:var(--color-text-muted);margin:0}.message{padding:.75rem 1rem;border-radius:var(--radius-sm);border:1px solid transparent;font-size:.9rem}.message--error{background:#bb31281f;border-color:#bb312859;color:#7a1c15}.message--success{background:#1b6f671f;border-color:#1b6f6759;color:var(--color-primary)}.form-grid{display:grid;gap:1rem}.form-row{display:grid;gap:.5rem}.field-narrow{max-width:20rem}.list{list-style:none;margin:0;padding:0;display:grid;gap:1rem}.list--plain{gap:.6rem}.list--plain li{padding:0}.meta{font-size:.8rem;color:var(--color-text-muted)}.stack{display:grid;gap:1rem}.stack-sm{display:grid;gap:.75rem}.cluster{display:flex;flex-wrap:wrap;gap:1rem;align-items:center}.cluster--spread{justify-content:space-between}.session-entry{display:grid;gap:.25rem}.session-entry>span:first-of-type{font-weight:600;color:var(--color-text)}.session-entry>span{font-size:.85rem;color:var(--color-text-muted)}.subheading{margin:0;font-size:1.05rem;font-weight:600;color:var(--color-text)}.stat-pill{display:inline-flex;align-items:center;gap:.35rem;padding:.35rem .8rem;border-radius:999px;background:#8e7cc32e;color:var(--color-secondary);font-weight:600;font-size:.9rem}.message--note{background:#24303614;border-color:#24303629;color:var(--color-text)}.game-page{align-content:start}.game-hero{width:min(68rem,100%);display:grid;gap:.85rem;justify-items:center;text-align:center;padding:clamp(1.2rem,2.5vw,1.7rem);border-radius:var(--radius-md);border:1px solid rgba(27,111,103,.25);background:radial-gradient(circle at 12% 12%,rgba(27,111,103,.18),transparent 46%),radial-gradient(circle at 88% 18%,rgba(142,124,195,.22),transparent 40%),var(--color-surface);box-shadow:var(--shadow-sm)}.game-hero h2{margin:0;font-size:clamp(1.8rem,4vw,2.5rem)}.game-hero p{margin:0;max-width:68ch;color:var(--color-text-muted)}.game-console{width:min(62rem,100%);display:grid;gap:1rem;grid-template-columns:1fr}.game-console__controls,.game-console__status{padding:clamp(1rem,2.2vw,1.5rem)}.game-console--secondary{margin-top:.25rem}.game-console__controls--full{width:100%}.game-form-grid{display:grid;gap:.9rem;grid-template-columns:repeat(3,minmax(0,1fr))}.game-player-chip{display:grid;align-content:center;gap:.15rem;padding:.65rem .9rem;border-radius:var(--radius-sm);border:1px solid rgba(27,111,103,.24);background:#1b6f6714}.game-player-chip span{font-size:.74rem;letter-spacing:.05em;text-transform:uppercase;color:var(--color-text-muted)}.game-player-chip strong{font-size:1rem;color:var(--color-text)}.game-start-btn{min-width:11.5rem}.game-kpi-grid{display:grid;gap:.7rem}.game-kpi{display:grid;gap:.2rem;padding:.75rem .85rem;border-radius:var(--radius-sm);border:1px solid rgba(27,111,103,.2);background:linear-gradient(180deg,#1b6f671a,#8e7cc314)}.game-kpi__label{font-size:.76rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--color-text-muted)}.game-kpi__value{font-size:clamp(1.12rem,2vw,1.35rem);line-height:1.15;color:var(--color-text)}.game-board-panel{width:min(74rem,100%);padding:clamp(1rem,2.2vw,1.6rem);background:radial-gradient(circle at 90% 10%,rgba(142,124,195,.18),transparent 36%),radial-gradient(circle at 10% 90%,rgba(27,111,103,.12),transparent 40%),var(--color-surface)}.game-board-header{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:.8rem}.game-board-toolbar{display:grid;gap:.7rem;justify-items:end}.game-board-kpis{display:flex;flex-wrap:wrap;gap:.55rem;justify-content:flex-end}.game-board-empty{min-height:10rem;display:grid;place-items:center;border:1px dashed rgba(36,48,54,.22);border-radius:var(--radius-md);background:#ffffff3d}.game-grid{--grid-columns: 4;display:grid;gap:.85rem;width:100%;max-width:min(100%,calc(var(--grid-columns) * 174px));margin:0 auto;justify-items:center}.game-card{background:transparent;border:none;padding:0;display:block;width:100%;max-width:164px;min-width:110px;aspect-ratio:3 / 4;height:auto;cursor:pointer}.game-card:disabled{cursor:default}.game-card:focus-visible{outline:3px solid var(--color-secondary);outline-offset:4px}.game-card__surface{width:100%;height:100%;border-radius:var(--radius-md);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;padding:.85rem;text-align:center;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;border:1px solid rgba(36,48,54,.08);position:relative;overflow:hidden}.game-card__surface--back{background:linear-gradient(140deg,#ffffff24,#fff0),linear-gradient(135deg,var(--color-secondary),var(--color-primary));color:var(--color-primary-on);letter-spacing:.06em;font-weight:700}.game-card__surface--back:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at 24% 24%,rgba(246,243,238,.28) 0 3px,transparent 4px),radial-gradient(circle at 76% 24%,rgba(246,243,238,.28) 0 3px,transparent 4px),radial-gradient(circle at 24% 76%,rgba(246,243,238,.28) 0 3px,transparent 4px),radial-gradient(circle at 76% 76%,rgba(246,243,238,.28) 0 3px,transparent 4px),linear-gradient(#f6f3ee33,#f6f3ee33) 24% 24% / 52% 1.5px no-repeat,linear-gradient(#f6f3ee33,#f6f3ee33) 24% 24% / 1.5px 52% no-repeat,linear-gradient(#f6f3ee33,#f6f3ee33) 76% 24% / 1.5px 52% no-repeat,linear-gradient(#f6f3ee33,#f6f3ee33) 24% 76% / 52% 1.5px no-repeat;opacity:.7;pointer-events:none}.game-card__surface--front{background:var(--color-surface);color:var(--color-text)}.game-card:hover .game-card__surface--back,.game-card:hover .game-card__surface--front{transform:translateY(-2px);box-shadow:0 12px 24px #24303629}.game-card--matched .game-card__surface--front{border:2px solid rgba(27,111,103,.45);box-shadow:0 8px 18px #1b6f672e}.game-card__back-text{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;min-width:4.5rem;padding:.28rem .72rem;border-radius:999px;border:1px solid rgba(246,243,238,.42);background:#f6f3ee33;box-shadow:inset 0 0 0 1px #ffffff1f;font-size:.78rem;text-transform:uppercase;letter-spacing:.08em}.game-card__content{display:grid;gap:.5rem;width:100%}.game-card__image,.game-card__video{width:100%;max-height:130px;object-fit:cover;border-radius:var(--radius-sm)}.game-card__audio{width:100%}.game-card__icon{font-size:2.25rem}.game-card__caption{font-size:.85rem;color:var(--color-text-muted)}.game-card__text{width:100%;padding:.75rem;border-radius:var(--radius-sm);background:#8e7cc324;font-size:.9rem;line-height:1.4}.brand-mark{display:inline-flex;align-items:center;gap:.6rem;font-weight:700;color:var(--color-text);text-decoration:none}.brand-mark__image{display:block;width:auto}.brand-mark__text{font-size:1.1rem;letter-spacing:.01em}.brand-mark--hero{justify-content:center}.guardian-nav{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}.guardian-nav__brand{display:flex;align-items:center;border-radius:var(--radius-sm);padding:.35rem .75rem;transition:background .16s ease,transform .16s ease}.guardian-nav__brand:hover,.guardian-nav__brand:focus-visible{background:#1b6f671f;transform:translateY(-1px)}.guardian-nav__links{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center;flex:1 1 auto;margin-left:.75rem}.guardian-nav__link{display:inline-flex;align-items:center;justify-content:center;background:#1b6f671f;color:var(--color-primary);border-radius:var(--radius-sm);padding:.55rem 1rem;font-weight:600;line-height:1.2;text-decoration:none;border:1px solid transparent;transition:background .16s ease,border-color .16s ease,color .16s ease,transform .16s ease}button.guardian-nav__link{-moz-appearance:none;appearance:none;-webkit-appearance:none;font:inherit;box-shadow:none;cursor:pointer}.guardian-nav__link:hover,.guardian-nav__link:focus-visible{background:#1b6f672e;border-color:#1b6f6766;transform:translateY(-1px)}.guardian-nav__link--active{background:var(--color-primary);color:var(--color-primary-on);border-color:transparent;box-shadow:var(--shadow-sm)}.guardian-nav__logout{margin-left:auto}.landing-logo{margin-bottom:1rem}.tag-list{display:flex;flex-wrap:wrap;gap:.5rem;padding:0;list-style:none;margin:0}.feature-list{list-style:none;margin:0;padding:0;display:grid;gap:1.15rem}.feature-list li{display:grid;gap:.35rem;padding-left:1.25rem;border-left:3px solid rgba(142,124,195,.5)}.feature-list strong{font-size:1rem;color:var(--color-text)}.feature-list span{color:var(--color-text-muted);font-size:.95rem}@media (max-width: 600px){.page{padding-inline:1rem}.table{min-width:520px}.guardian-nav{gap:.5rem}.guardian-nav__links{flex-basis:100%;margin-left:0}.guardian-nav__logout{margin-left:0}.game-console,.game-form-grid{grid-template-columns:1fr}.game-board-header{align-items:flex-start}.game-board-toolbar{width:100%;justify-items:start}.game-board-kpis{justify-content:flex-start}}.text-center{text-align:center}:root{color-scheme:light;--color-background: #ece1d3;--color-surface: #f6f3ee;--color-surface-muted: #f3ede4;--color-primary: #1b6f67;--color-primary-soft: #4b9088;--color-primary-on: #F6F3EE;--color-secondary: #8e7cc3;--color-accent: #e8a658;--color-text: #243036;--color-text-muted: #4c5a60;--color-border: rgba(36, 48, 54, .16);--shadow-sm: 0 1px 2px rgba(36, 48, 54, .08);--shadow-md: 0 8px 24px rgba(36, 48, 54, .14);--radius-sm: 8px;--radius-md: 16px;--layout-max-width: 1200px;--font-sans: "Inter", "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, "Helvetica Neue", sans-serif;font-family:var(--font-sans);font-size:16px;line-height:1.5;font-weight:400;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*,*:before,*:after{box-sizing:border-box}body{margin:0;min-height:100vh;background:var(--color-background);color:var(--color-text)}img,video{max-width:100%;display:block}a{color:var(--color-primary);text-decoration:none;font-weight:600}a:hover{text-decoration:underline}a:focus-visible{outline:3px solid var(--color-secondary);outline-offset:3px}button,input,select,textarea{font:inherit;color:inherit}button{border:none;border-radius:var(--radius-sm);padding:.625rem 1.2rem;background:var(--color-primary);color:var(--color-primary-on);font-weight:600;cursor:pointer;transition:background .16s ease,transform .16s ease,box-shadow .16s ease;box-shadow:var(--shadow-sm)}button:hover:not(:disabled){background:var(--color-primary-soft);transform:translateY(-1px);box-shadow:var(--shadow-md)}button:active:not(:disabled){transform:translateY(0);box-shadow:var(--shadow-sm)}button:disabled{opacity:.6;cursor:not-allowed;box-shadow:none}button:focus-visible{outline:3px solid var(--color-secondary);outline-offset:3px}input,select,textarea{width:100%;padding:.6rem .75rem;border-radius:var(--radius-sm);border:1px solid var(--color-border);background:var(--color-surface);transition:border-color .16s ease,box-shadow .16s ease}input:focus,select:focus,textarea:focus{border-color:var(--color-secondary);box-shadow:0 0 0 4px #8e7cc340;outline:none}label{font-weight:600;color:var(--color-text)}form{margin:0}main{width:100%}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}
