:root{--color-primary: #1a365d;--color-primary-light: #2c5282;--color-primary-lighter: #3182ce;--color-secondary: #234e52;--color-secondary-light: #285e61;--color-success: #276749;--color-success-bg: #c6f6d5;--color-success-border: #9ae6b4;--color-warning: #744210;--color-warning-bg: #fefcbf;--color-warning-border: #f6e05e;--color-info: #2b6cb0;--color-info-bg: #bee3f8;--color-info-border: #90cdf4;--color-neutral: #4a5568;--color-neutral-bg: #e2e8f0;--color-neutral-border: #cbd5e0;--color-text: #1a202c;--color-text-muted: #4a5568;--color-text-light: #718096;--color-text-inverse: #ffffff;--color-bg: #f7fafc;--color-bg-card: #ffffff;--color-bg-elevated: #edf2f7;--space-xs: .25rem;--space-sm: .5rem;--space-md: 1rem;--space-lg: 1.5rem;--space-xl: 2rem;--space-2xl: 3rem;--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--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;--line-height-tight: 1.25;--line-height-normal: 1.5;--line-height-relaxed: 1.75;--border-radius-sm: .25rem;--border-radius: .5rem;--border-radius-lg: .75rem;--border-width: 1px;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .05);--shadow: 0 1px 3px rgba(0, 0, 0, .1), 0 1px 2px rgba(0, 0, 0, .06);--shadow-md: 0 4px 6px rgba(0, 0, 0, .1), 0 2px 4px rgba(0, 0, 0, .06);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .1), 0 4px 6px rgba(0, 0, 0, .05);--transition-fast: .15s ease;--transition-normal: .25s ease;--max-width: 48rem}[data-theme=dark]{--color-primary: #90cdf4;--color-primary-light: #63b3ed;--color-primary-lighter: #4299e1;--color-secondary: #81e6d9;--color-secondary-light: #4fd1c5;--color-success: #68d391;--color-success-bg: #1c4532;--color-success-border: #276749;--color-warning: #f6e05e;--color-warning-bg: #744210;--color-warning-border: #975a16;--color-info: #63b3ed;--color-info-bg: #2a4365;--color-info-border: #2b6cb0;--color-neutral: #a0aec0;--color-neutral-bg: #2d3748;--color-neutral-border: #4a5568;--color-text: #f7fafc;--color-text-muted: #a0aec0;--color-text-light: #718096;--color-text-inverse: #1a202c;--color-bg: #1a202c;--color-bg-card: #2d3748;--color-bg-elevated: #4a5568;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);--shadow: 0 1px 3px rgba(0, 0, 0, .4), 0 1px 2px rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px rgba(0, 0, 0, .4), 0 2px 4px rgba(0, 0, 0, .3);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .4), 0 4px 6px rgba(0, 0, 0, .3)}[data-theme=dark] .app-header,[data-theme=dark] .scenario-header{background:linear-gradient(135deg,#2d3748,#4a5568);color:#f7fafc}[data-theme=dark] .aha-section{background:linear-gradient(135deg,#44337a,#553c9a);border-color:#805ad5}[data-theme=dark] .aha-text{color:#e9d8fd}[data-theme=dark] .error-message{background:#742a2a;border-color:#c53030;color:#feb2b2}[data-theme=dark] .modal-backdrop{background:#000000b3}@media (prefers-color-scheme: dark){:root:not([data-theme=light]){--color-primary: #90cdf4;--color-primary-light: #63b3ed;--color-primary-lighter: #4299e1;--color-secondary: #81e6d9;--color-secondary-light: #4fd1c5;--color-success: #68d391;--color-success-bg: #1c4532;--color-success-border: #276749;--color-warning: #f6e05e;--color-warning-bg: #744210;--color-warning-border: #975a16;--color-info: #63b3ed;--color-info-bg: #2a4365;--color-info-border: #2b6cb0;--color-neutral: #a0aec0;--color-neutral-bg: #2d3748;--color-neutral-border: #4a5568;--color-text: #f7fafc;--color-text-muted: #a0aec0;--color-text-light: #718096;--color-text-inverse: #1a202c;--color-bg: #1a202c;--color-bg-card: #2d3748;--color-bg-elevated: #4a5568;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .3);--shadow: 0 1px 3px rgba(0, 0, 0, .4), 0 1px 2px rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px rgba(0, 0, 0, .4), 0 2px 4px rgba(0, 0, 0, .3);--shadow-lg: 0 10px 15px rgba(0, 0, 0, .4), 0 4px 6px rgba(0, 0, 0, .3)}:root:not([data-theme=light]) .app-header{background:linear-gradient(135deg,#2d3748,#4a5568);color:#f7fafc}:root:not([data-theme=light]) .scenario-header{background:linear-gradient(135deg,#2d3748,#4a5568);color:#f7fafc}:root:not([data-theme=light]) .aha-section{background:linear-gradient(135deg,#44337a,#553c9a);border-color:#805ad5}:root:not([data-theme=light]) .aha-text{color:#e9d8fd}:root:not([data-theme=light]) .error-message{background:#742a2a;border-color:#c53030;color:#feb2b2}:root:not([data-theme=light]) .modal-backdrop{background:#000000b3}}*,*:before,*:after{box-sizing:border-box}html{font-size:16px;scroll-behavior:smooth}body{margin:0;font-family:var(--font-family);font-size:var(--font-size-base);line-height:var(--line-height-normal);color:var(--color-text);background-color:var(--color-bg);min-height:100vh;display:flex;flex-direction:column}.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}.skip-link{position:absolute;top:-100%;left:var(--space-md);background:var(--color-primary);color:var(--color-text-inverse);padding:var(--space-sm) var(--space-md);border-radius:var(--border-radius);z-index:1000;text-decoration:none}.skip-link:focus{top:var(--space-md)}:focus-visible{outline:3px solid var(--color-primary-lighter);outline-offset:2px}.hidden{display:none!important}.app-header{background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary-light) 100%);color:var(--color-text-inverse);padding:var(--space-lg) var(--space-md)}.header-content{max-width:var(--max-width);margin:0 auto;display:flex;justify-content:space-between;align-items:center;gap:var(--space-md)}.title-block{flex:1}.app-title{margin:0;font-size:var(--font-size-3xl);font-weight:700;letter-spacing:-.02em}.app-subtitle{margin:var(--space-xs) 0 0;font-size:var(--font-size-base);opacity:.9}.language-toggle{background:#ffffff26;border:2px solid rgba(255,255,255,.3);color:var(--color-text-inverse);padding:var(--space-sm) var(--space-md);border-radius:var(--border-radius);font-size:var(--font-size-base);font-weight:600;cursor:pointer;transition:background var(--transition-fast),border-color var(--transition-fast);min-width:4rem}.language-toggle:hover{background:#ffffff40;border-color:#ffffff80}.theme-toggle{background:#ffffff26;border:2px solid rgba(255,255,255,.3);color:var(--color-text-inverse);padding:var(--space-sm);border-radius:var(--border-radius);font-size:var(--font-size-lg);cursor:pointer;transition:background var(--transition-fast),border-color var(--transition-fast);line-height:1;display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem}.theme-toggle:hover{background:#ffffff40;border-color:#ffffff80}.theme-toggle .icon-sun,.theme-toggle .icon-moon{display:none}[data-theme=light] .theme-toggle .icon-moon,:root:not([data-theme]) .theme-toggle .icon-moon{display:block}[data-theme=dark] .theme-toggle .icon-sun{display:block}@media (prefers-color-scheme: dark){:root:not([data-theme=light]) .theme-toggle .icon-sun{display:block}:root:not([data-theme=light]) .theme-toggle .icon-moon{display:none}}.header-controls{display:flex;align-items:center;gap:var(--space-sm)}.parent-logo-link{flex-shrink:0;display:flex;align-items:center}.parent-logo-link.hidden{display:none}.parent-logo{height:150px;width:auto;max-width:300px;object-fit:contain;transition:opacity var(--transition-fast)}.parent-logo:hover{opacity:.85}.main-content{flex:1;max-width:var(--max-width);margin:0 auto;padding:var(--space-lg) var(--space-md);width:100%}.scenario-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-lg);flex-wrap:wrap;gap:var(--space-sm)}.nav-btn{background:var(--color-bg-card);border:var(--border-width) solid var(--color-neutral-border);padding:var(--space-sm) var(--space-md);border-radius:var(--border-radius);font-size:var(--font-size-sm);color:var(--color-text);cursor:pointer;transition:background var(--transition-fast),border-color var(--transition-fast)}.nav-btn:hover:not(:disabled){background:var(--color-bg-elevated);border-color:var(--color-primary-lighter)}.nav-btn:disabled{opacity:.5;cursor:not-allowed}.scenario-counter{font-size:var(--font-size-sm);color:var(--color-text-muted);font-weight:500}.scenario-card{background:var(--color-bg-card);border-radius:var(--border-radius-lg);box-shadow:var(--shadow-md);overflow:hidden;margin-bottom:var(--space-xl)}.scenario-header{background:linear-gradient(135deg,var(--color-secondary) 0%,var(--color-secondary-light) 100%);color:var(--color-text-inverse);padding:var(--space-lg)}.scenario-title{margin:0;font-size:var(--font-size-2xl);font-weight:600}.scenario-situation{padding:var(--space-lg);background:var(--color-info-bg);border-bottom:var(--border-width) solid var(--color-info-border)}.situation-text{margin:0;font-size:var(--font-size-lg);line-height:var(--line-height-relaxed);color:var(--color-text)}.scenario-details{padding:var(--space-lg)}.detail-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--space-md);margin-bottom:var(--space-lg)}.detail-item{display:flex;flex-direction:column;gap:var(--space-xs)}.detail-label{font-size:var(--font-size-sm);font-weight:600;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em}.detail-value{font-size:var(--font-size-base);color:var(--color-text)}.symptoms-section{background:var(--color-warning-bg);padding:var(--space-md);border-radius:var(--border-radius);border-left:4px solid var(--color-warning-border)}.symptoms-list{margin:var(--space-sm) 0 0;padding-left:var(--space-lg)}.symptoms-list li{margin-bottom:var(--space-xs);color:var(--color-warning)}.selection-section{background:var(--color-bg-card);border-radius:var(--border-radius-lg);box-shadow:var(--shadow-md);padding:var(--space-lg);margin-bottom:var(--space-xl)}.question-title{margin:0 0 var(--space-xs);font-size:var(--font-size-xl);color:var(--color-primary)}.question-hint{margin:0 0 var(--space-lg);color:var(--color-text-muted)}.error-message{background:#fed7d7;border:var(--border-width) solid #fc8181;color:#c53030;padding:var(--space-sm) var(--space-md);border-radius:var(--border-radius);margin-bottom:var(--space-md);display:none}.error-message.visible{display:block}.causes-container{display:flex;flex-direction:column;gap:var(--space-lg)}.cause-category{border:var(--border-width) solid var(--color-neutral-border);border-radius:var(--border-radius);overflow:hidden}.cause-category-label{margin:0;padding:var(--space-sm) var(--space-md);background:var(--color-bg-elevated);font-size:var(--font-size-sm);font-weight:600;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.05em;border-bottom:var(--border-width) solid var(--color-neutral-border)}.cause-option{display:flex;align-items:flex-start;padding:var(--space-md);cursor:pointer;transition:background var(--transition-fast);border-bottom:var(--border-width) solid var(--color-neutral-border)}.cause-option:last-child{border-bottom:none}.cause-option:hover{background:var(--color-bg-elevated)}.cause-option input[type=checkbox]{position:absolute;opacity:0;width:0;height:0}.cause-checkbox{flex-shrink:0;width:1.25rem;height:1.25rem;border:2px solid var(--color-neutral-border);border-radius:var(--border-radius-sm);margin-right:var(--space-md);margin-top:2px;transition:background var(--transition-fast),border-color var(--transition-fast);display:flex;align-items:center;justify-content:center}.cause-option input:checked+.cause-checkbox{background:var(--color-primary);border-color:var(--color-primary)}.cause-option input:checked+.cause-checkbox:after{content:"✓";color:#fff;font-size:.875rem;font-weight:700}.cause-option input:focus-visible+.cause-checkbox{outline:3px solid var(--color-primary-lighter);outline-offset:2px}.cause-content{flex:1}.cause-name{display:block;font-weight:600;color:var(--color-text);margin-bottom:var(--space-xs)}.cause-description{display:block;font-size:var(--font-size-sm);color:var(--color-text-muted);line-height:var(--line-height-normal)}.action-buttons{display:flex;gap:var(--space-md);margin-top:var(--space-xl);flex-wrap:wrap}.btn{padding:var(--space-sm) var(--space-lg);border-radius:var(--border-radius);font-size:var(--font-size-base);font-weight:600;cursor:pointer;transition:background var(--transition-fast),transform var(--transition-fast);border:none}.btn:active{transform:scale(.98)}.btn-primary{background:var(--color-primary);color:var(--color-text-inverse)}.btn-primary:hover{background:var(--color-primary-light)}.btn-secondary{background:var(--color-bg-elevated);color:var(--color-text);border:var(--border-width) solid var(--color-neutral-border)}.btn-secondary:hover{background:var(--color-neutral-bg)}.feedback-container{background:var(--color-bg-card);border-radius:var(--border-radius-lg);box-shadow:var(--shadow-lg);padding:var(--space-lg);margin-bottom:var(--space-xl);display:none;border-top:4px solid var(--color-neutral-border)}.feedback-container.visible{display:block;animation:slideIn .3s ease}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.feedback-container.feedback-perfect{border-top-color:var(--color-success)}.feedback-container.feedback-partial{border-top-color:var(--color-info)}.feedback-container.feedback-rethink{border-top-color:var(--color-warning)}.feedback-title{margin:0 0 var(--space-lg);font-size:var(--font-size-xl);color:var(--color-primary)}.feedback-section{margin-bottom:var(--space-lg)}.feedback-section.hidden{display:none}.feedback-section h4{margin:0 0 var(--space-md);font-size:var(--font-size-base);color:var(--color-text-muted)}.plausible-section h4{color:var(--color-success)}.unlikely-section h4{color:var(--color-warning)}.missed-section h4{color:var(--color-info)}.feedback-list{display:flex;flex-direction:column;gap:var(--space-md)}.feedback-item{padding:var(--space-md);border-radius:var(--border-radius);border-left:4px solid}.feedback-plausible{background:var(--color-success-bg);border-left-color:var(--color-success)}.feedback-unlikely{background:var(--color-warning-bg);border-left-color:var(--color-warning)}.feedback-missed{background:var(--color-info-bg);border-left-color:var(--color-info)}.feedback-item-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-sm);flex-wrap:wrap;gap:var(--space-sm)}.feedback-item-name{font-weight:600;color:var(--color-text)}.feedback-item-plausibility{font-size:var(--font-size-sm);padding:var(--space-xs) var(--space-sm);background:#0000001a;border-radius:var(--border-radius-sm);color:var(--color-text-muted)}.feedback-item-explanation{margin:0 0 var(--space-sm);line-height:var(--line-height-relaxed);white-space:pre-line}.feedback-item-learnmore{margin:0;font-size:var(--font-size-sm);color:var(--color-text-muted);font-style:italic}.aha-section{background:linear-gradient(135deg,#faf5ff,#f0e7fe);border:2px solid #d6bcfa;border-radius:var(--border-radius-lg);padding:var(--space-lg);margin-top:var(--space-lg);display:flex;gap:var(--space-md);align-items:flex-start}.aha-section.hidden{display:none}.aha-icon{font-size:var(--font-size-2xl);flex-shrink:0}.aha-text{margin:0;line-height:var(--line-height-relaxed);color:#553c9a}.app-footer{background:var(--color-bg-elevated);border-top:var(--border-width) solid var(--color-neutral-border);padding:var(--space-lg) var(--space-md);text-align:center}.app-footer p{margin:0;font-size:var(--font-size-sm);color:var(--color-text-muted)}.footer-links{margin-top:var(--space-sm)!important}.footer-link{color:var(--color-text-muted);text-decoration:none;transition:color var(--transition-fast)}.footer-link:hover{color:var(--color-primary);text-decoration:underline}.parent-site-info{margin-bottom:var(--space-sm)!important;font-weight:500}.parent-site-info.hidden{display:none}.parent-site-info a{color:var(--color-primary-lighter);text-decoration:none;font-weight:600}.parent-site-info a:hover{text-decoration:underline}.modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;display:none;align-items:center;justify-content:center;padding:var(--space-md)}.modal.visible{display:flex}.modal-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:#00000080;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.modal-content{position:relative;background:var(--color-bg-card);border-radius:var(--border-radius-lg);box-shadow:var(--shadow-lg);max-width:600px;width:100%;max-height:85vh;overflow-y:auto;padding:var(--space-xl);animation:modalIn .2s ease}@keyframes modalIn{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.modal-close{position:absolute;top:var(--space-md);right:var(--space-md);background:none;border:none;font-size:var(--font-size-2xl);color:var(--color-text-muted);cursor:pointer;padding:var(--space-xs);line-height:1;transition:color var(--transition-fast)}.modal-close:hover{color:var(--color-text)}.modal-title{margin:0 0 var(--space-lg);font-size:var(--font-size-2xl);color:var(--color-primary);padding-right:var(--space-xl)}.modal-body{color:var(--color-text);line-height:var(--line-height-relaxed)}.modal-body h3{margin:0 0 var(--space-md);font-size:var(--font-size-base);color:var(--color-text-muted);font-weight:400}.modal-body h4{margin:var(--space-lg) 0 var(--space-sm);font-size:var(--font-size-base);color:var(--color-text)}.modal-body p{margin:0 0 var(--space-md)}.modal-body address{font-style:normal;line-height:var(--line-height-relaxed);margin-bottom:var(--space-md)}.modal-body a{color:var(--color-primary-lighter);text-decoration:none}.modal-body a:hover{text-decoration:underline}.modal-close-btn{margin-top:var(--space-lg);width:100%}@media (min-width: 640px){.app-header,.main-content{padding:var(--space-xl) var(--space-lg)}.scenario-header,.scenario-situation,.scenario-details,.selection-section,.feedback-container{padding:var(--space-xl)}}@media (max-width: 480px){.app-title{font-size:var(--font-size-2xl)}.app-subtitle{font-size:var(--font-size-sm)}.parent-logo{height:80px;max-width:160px}.header-content{flex-wrap:wrap}.scenario-nav{justify-content:center}.nav-btn{font-size:var(--font-size-sm);padding:var(--space-xs) var(--space-sm)}.scenario-title{font-size:var(--font-size-xl)}.detail-grid{grid-template-columns:1fr}.action-buttons{flex-direction:column}.btn{width:100%}}@media print{.app-header{background:none;color:var(--color-text)}.language-toggle,.scenario-nav,.action-buttons{display:none}.scenario-card,.selection-section,.feedback-container{box-shadow:none;border:var(--border-width) solid var(--color-neutral-border)}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}html{scroll-behavior:auto}}
