*,*:before,*:after{box-sizing:border-box}html,body{margin:0;padding:0}html,body,#root{height:100%}:root{--radius-lg: 18px;--radius-pill: 9999px;--shadow-soft: 0 10px 25px rgba(15, 23, 42, .08);--font-sans: system-ui, -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", sans-serif;--bg-body: radial-gradient(circle at top left, #ffe6c8 0%, #f8f1e5 30%, #e8f7f0 100%);--bg-chat: #ffffff;--bg-bot: #ecf7f4;--bg-user: #25b66f;--text-main: #111827;--text-muted: #6b7280;--text-inverse: #f9fafb;--accent: #2f9de5;--accent-soft: #dbeafe;--border-soft: #e5e7eb}:root[data-empath-mode=classic]{--bg-body: #f5f6fb;--bg-chat: #ffffff;--bg-bot: #e5f0ff;--bg-user: #4f46e5}:root[data-empath-mode=dark]{--bg-body: radial-gradient(circle at top left, #0f172a 0%, #020617 60%);--bg-chat: #020617;--bg-bot: #111827;--bg-user: #facc15;--text-main: #e5e7eb;--text-muted: #9ca3af;--text-inverse: #020617;--border-soft: #1f2937;--accent: #facc15;--accent-soft: rgba(250, 204, 21, .16);--shadow-soft: 0 20px 40px rgba(0, 0, 0, .6)}body{font-family:var(--font-sans);font-size:16px;line-height:1.5;color:var(--text-main);background:var(--bg-body)}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}button,input,textarea{font-family:inherit;font-size:inherit}button{cursor:pointer}button:disabled{cursor:default}ul,ol{margin:0;padding-left:1.25rem}.visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;width:1px;margin:-1px;padding:0;overflow:hidden;position:absolute}:focus-visible{outline:2px solid #2563eb;outline-offset:2px}:root{--color-bg-calm: #f8f1e5;--color-bg-panel: #ffecc4;--color-bg-chat-bot: #ecf7f4;--color-bg-chat-user: #fff9ec;--color-bg-game-panel: #fdf3da;--color-bg-header: #fad6a5;--color-empath-green: #25b66f;--color-taxi-yellow: #ffc53a;--color-cta: #2f9de5;--color-text-main: #2d3436;--color-text-muted: #7a8288;--color-text-inverse: #ffffff;--color-text-danger: #b42318;--color-overwhelm-low: #2f9de5;--color-overwhelm-mid: #ffc53a;--color-overwhelm-high: #e4584f;--color-border-soft: #e6d7bf;--shadow-soft-lg: 0 18px 40px rgba(0, 0, 0, .08);--shadow-soft-sm: 0 8px 18px rgba(0, 0, 0, .06);--radius-xl: 24px;--radius-lg: 18px;--radius-md: 12px;--radius-pill: 999px;--font-body: system-ui, -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", sans-serif;--font-display: "Baloo 2", system-ui, -apple-system, sans-serif;--layout-max-width: 1120px;--layout-gutter: 16px}[data-ui-mode=empath-dark]{--color-bg-calm: #050816;--color-bg-panel: #0b1120;--color-bg-chat-bot: #111827;--color-bg-chat-user: #020617;--color-bg-game-panel: #020617;--color-empath-green: #37d996;--color-taxi-yellow: #facc15;--color-cta: #38bdf8;--color-text-main: #e5e7eb;--color-text-muted: #9ca3af;--color-text-inverse: #020617;--color-text-danger: #fca5a5;--color-border-soft: rgba(148, 163, 184, .5);--shadow-soft-lg: 0 18px 40px rgba(0, 0, 0, .6);--shadow-soft-sm: 0 8px 18px rgba(0, 0, 0, .5)}[data-ui-mode=empath-dark] .app-shell{background:radial-gradient(circle at top left,#020617 0,#020617 40%,#020617)}[data-ui-mode=empath-dark] .app-header{background:linear-gradient(135deg,#1f2937,#020617)}[data-ui-mode=empath-dark] .chat-panel{background:var(--color-bg-panel)}[data-ui-mode=empath-dark] .game-panel{background:var(--color-bg-game-panel)}[data-ui-mode=empath-dark] .chat-window{background:#020617;border-color:#374151e6}[data-ui-mode=empath-dark] .message-bubble.bot{background:var(--color-bg-chat-bot)}[data-ui-mode=empath-dark] .message-bubble.user{background:var(--color-bg-chat-user);border-color:#94a3b8cc}[data-ui-mode=empath-dark] .input-bar{background:#020617;border-color:#1f2937}[data-ui-mode=empath-dark] .input-bar__input{color:#e5e7eb;caret-color:#facc15}[data-ui-mode=empath-dark] .input-bar__input::placeholder{color:#64748b}[data-ui-mode=empath-dark] .input-bar__button{background:linear-gradient(135deg,#38bdf8,#0ea5e9);color:#020617}[data-ui-mode=dev-minimal]{--color-bg-calm: #000000;--color-bg-panel: #000000;--color-bg-chat-bot: #000000;--color-bg-chat-user: #000000;--color-bg-game-panel: #000000;--color-text-main: #00ff00;--color-text-muted: #00bb00;--color-text-inverse: #000000;--color-cta: #00ff00;--color-empath-green: #00ff00;--color-border-soft: #00aa00;--shadow-soft-lg: none;--shadow-soft-sm: none;--font-body: "SF Mono", ui-monospace, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace}[data-ui-mode=dev-minimal] .app-shell{background:#000;padding:8px}[data-ui-mode=dev-minimal] .empath-app{max-width:900px;border:1px solid #00aa00}[data-ui-mode=dev-minimal] .chat-panel,[data-ui-mode=dev-minimal] .game-panel{background:#000;box-shadow:none;border-radius:0;border:1px solid #00aa00}[data-ui-mode=dev-minimal] .chat-window{max-height:none;border-radius:0;border:1px solid #00aa00;background:#000}[data-ui-mode=dev-minimal] .message-bubble{max-width:100%;box-shadow:none;border-radius:0;padding:2px 0;background:transparent;color:#0f0}[data-ui-mode=dev-minimal] .message-bubble.user,[data-ui-mode=dev-minimal] .message-bubble.bot{color:#0f0}[data-ui-mode=dev-minimal] .input-bar{border-radius:0;border:1px solid #00aa00;background:#000;box-shadow:none;padding:2px 6px}[data-ui-mode=dev-minimal] .input-bar__input{color:#0f0}[data-ui-mode=dev-minimal] .input-bar__button{border-radius:0;background:#030;box-shadow:none;color:#0f0}[data-ui-mode=dev-minimal] .app-header{background:#000;border-radius:0;box-shadow:none;border-bottom:1px solid #00aa00}[data-ui-mode=dev-minimal] .app-header__progress,[data-ui-mode=dev-minimal] .game-panel{display:none!important}[data-ui-mode=dev-minimal] .app-main{flex-direction:column!important}body{font-family:var(--font-body);background:radial-gradient(circle at top left,#fff4db 0,#f8f1e5 38%,#e7f4f1);color:var(--color-text-main)}.app-shell{min-height:100vh;display:flex;align-items:stretch;justify-content:center;padding:16px}.empath-app{width:100%;max-width:var(--layout-max-width);display:flex;flex-direction:column;gap:16px}.app-header{background:linear-gradient(135deg,#ffe4b8,#fff5dd);border-radius:var(--radius-xl);box-shadow:var(--shadow-soft-lg);padding:16px 20px;display:flex;justify-content:space-between;align-items:center;gap:16px}.app-header__brand{display:flex;align-items:center;gap:14px}.app-header__avatar{width:48px;height:48px;border-radius:18px;box-shadow:var(--shadow-soft-sm);position:relative;overflow:hidden}.app-header__avatar:after{content:"";position:absolute;bottom:-4px;right:-6px;width:18px;height:18px;border-radius:999px;background:var(--color-taxi-yellow);box-shadow:0 0 0 2px #fff8e8}.app-header__title{font-family:var(--font-display);font-size:1.25rem;margin:0}.app-header__subtitle{margin:2px 0 0;font-size:.85rem;color:var(--color-text-muted)}.app-header__progress{min-width:220px}.app-header__right{display:flex;align-items:center;gap:12px}.app-header__mode-toggle{display:inline-flex;gap:4px}.mode-toggle__btn{border:1px solid rgba(230,215,191,.8);border-radius:999px;padding:4px 8px;font-size:.75rem;background:#fff9;cursor:pointer;color:var(--color-text-main)}.mode-toggle__btn--active{background:var(--color-cta);color:var(--color-text-inverse);border-color:transparent}.mode-select{border-radius:9999px;border:1px solid var(--color-border-soft);padding:4px 10px;font-size:.8rem;background:#fefce8;outline:none}.app-main{display:flex;flex-direction:column;gap:16px}.chat-panel,.game-panel{border-radius:var(--radius-xl);box-shadow:var(--shadow-soft-lg);padding:16px}.chat-panel{background:var(--color-bg-panel);display:flex;flex-direction:column;gap:8px}.game-panel{background:var(--color-bg-game-panel)}.chat-header{display:flex;align-items:center;gap:8px;font-size:.8rem}.chat-header button{font-size:.8rem}.crisis-banner{background:#fce4e2;border-radius:var(--radius-lg);border:1px solid #f3a29c;padding:10px 12px;font-size:.85rem;color:var(--color-text-danger)}.error-banner{margin-top:4px;padding:8px 10px;border-radius:var(--radius-md);background:#fff3cd;border:1px solid #ffe08a;font-size:.84rem;display:flex;align-items:center;justify-content:space-between;gap:8px}.error-banner__close{border:none;background:transparent;cursor:pointer;font-size:1.1rem;line-height:1}.chat-window{flex:1;min-height:220px;max-height:420px;background:radial-gradient(circle at top left,#fff9ec 0,#ffecc4 30%,#ecf7f4);border-radius:var(--radius-lg);border:1px solid rgba(255,255,255,.7);padding:12px 10px;overflow:hidden;position:relative}.message-list{height:100%;overflow-y:auto;padding-right:6px;scroll-behavior:smooth}.message-row{display:flex;margin-bottom:10px}.message-row.bot{justify-content:flex-start}.message-row.user{justify-content:flex-end}.message-bubble{max-width:80%;padding:9px 13px;border-radius:18px;font-size:.95rem;line-height:1.4;word-wrap:break-word;box-shadow:var(--shadow-soft-sm)}.message-bubble.bot{background:var(--color-bg-chat-bot);color:var(--color-text-main);border-bottom-left-radius:6px}.message-bubble.user{background:var(--color-bg-chat-user);color:var(--color-text-main);border-bottom-right-radius:6px;border:1px solid rgba(255,184,96,.7)}.chat-controls{margin-top:10px;display:flex;flex-direction:column;gap:10px}.input-bar{display:flex;gap:8px;align-items:center;background:#fff9ece6;border-radius:var(--radius-pill);padding:4px 4px 4px 12px;border:1px solid rgba(255,214,152,.7);box-shadow:var(--shadow-soft-sm)}.input-bar__input{flex:1;border:none;background:transparent;font-size:.95rem;padding:8px 4px;outline:none;color:var(--color-text-main)}.input-bar__input::placeholder{color:var(--color-text-muted)}.input-bar__button{border:none;border-radius:var(--radius-pill);padding:8px 14px;font-size:.9rem;background:linear-gradient(135deg,var(--color-cta),#50b6ee);color:var(--color-text-inverse);cursor:pointer;display:inline-flex;align-items:center;gap:4px;box-shadow:var(--shadow-soft-sm);transition:transform .05s ease,box-shadow .1s ease,filter .1s ease}.input-bar__button:hover{filter:brightness(1.05)}.input-bar__button:active{transform:translateY(1px);box-shadow:0 4px 10px #0000001f}.input-bar__button:disabled{cursor:default;opacity:.6;filter:grayscale(.2)}.likert-options{display:flex;flex-wrap:wrap;gap:8px}.likert-button{flex:1 1 calc(50% - 8px);border-radius:var(--radius-pill);border:1px solid rgba(255,223,180,.9);padding:8px 10px;font-size:.85rem;background:#fff9ec;cursor:pointer;text-align:center;transition:background .15s ease,border-color .15s ease,transform .05s ease,box-shadow .1s ease}.likert-button:hover{background:#ffecc4;border-color:var(--color-taxi-yellow);box-shadow:var(--shadow-soft-sm)}.likert-button:active{transform:translateY(1px)}.confusion-menu{background:#ffffffe6;border-radius:var(--radius-lg);border:1px dashed rgba(255,214,152,.7);padding:10px 10px 12px;display:flex;flex-direction:column;gap:8px}.confusion-menu__title{font-size:.88rem;color:var(--color-text-muted)}.confusion-menu__options{display:flex;flex-direction:column;gap:6px}.confusion-menu__option{border-radius:var(--radius-md);border:1px solid rgba(230,215,191,.9);padding:8px 10px;background:#fff9ec;cursor:pointer;text-align:left;font-size:.86rem;transition:background .15s ease,border-color .15s ease,transform .05s ease}.confusion-menu__option:hover{background:#ffecc4;border-color:var(--color-cta)}.progress{width:100%}.progress__bar{width:100%;height:8px;background:#fff9;border-radius:999px;overflow:hidden}.progress__fill{height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--color-overwhelm-low),var(--color-overwhelm-mid),var(--color-overwhelm-high));transition:width .4s cubic-bezier(.22,.61,.36,1)}.progress__label{margin-top:4px;text-align:right;font-size:.8rem;color:var(--color-text-muted)}.bot-typing-indicator{display:inline-flex;gap:4px;padding:6px 10px;border-radius:14px;background:#ecf7f4f2}.bot-typing-square{width:6px;height:6px;border-radius:2px;background:var(--color-empath-green);opacity:.4;transform:translateY(0);animation:empath-square-pulse 1s infinite ease-in-out}.bot-typing-square:nth-child(2){animation-delay:.12s}.bot-typing-square:nth-child(3){animation-delay:.24s}@keyframes empath-square-pulse{0%{opacity:.3;transform:translateY(0) scale(1)}40%{opacity:1;transform:translateY(-3px) scale(1.1)}to{opacity:.3;transform:translateY(0) scale(1)}}.typewriter{display:inline}.typewriter__cursor{display:inline-block;width:1px;margin-left:2px;height:1em;background:#0000004d;animation:empath-cursor-blink .9s steps(1) infinite}@keyframes empath-cursor-blink{0%,50%{opacity:1}50.01%,to{opacity:0}}.game-panel__section{background:#ffffffe6;border-radius:var(--radius-lg);padding:10px 12px;border:1px solid rgba(230,215,191,.8);margin-bottom:10px}.game-panel__title{font-size:.9rem;font-weight:600;margin-bottom:4px}.game-panel__title-row{display:flex;justify-content:space-between;align-items:center;gap:6px}.game-panel__label{font-size:.78rem;color:var(--color-text-muted);margin:6px 0 2px}.game-panel__meta{margin-top:6px;font-size:.78rem;color:var(--color-text-muted)}.game-panel__hint{font-size:.8rem;color:var(--color-text-muted);margin-top:8px}.game-panel__badge-row{display:flex;flex-wrap:wrap;gap:6px}.game-panel__badge{font-size:.78rem;padding:4px 8px;border-radius:999px;background:#25b66f14;border:1px solid rgba(37,182,111,.3);color:#0d5030}.game-panel__meter{height:8px;border-radius:999px;background:#fffc;overflow:hidden;margin-top:4px}.game-panel__meter-fill{height:100%;background:linear-gradient(90deg,var(--color-overwhelm-low),var(--color-overwhelm-mid),var(--color-overwhelm-high))}.game-panel__meter-fill--game{background:linear-gradient(90deg,#25b66f,#2f9de5)}.game-panel__cta{margin-top:8px;width:100%;border:none;border-radius:var(--radius-pill);padding:10px 12px;font-size:.9rem;background:linear-gradient(135deg,var(--color-empath-green),#39cd8a);color:var(--color-text-inverse);cursor:pointer;box-shadow:var(--shadow-soft-sm);display:inline-flex;align-items:center;justify-content:center;gap:6px}.game-panel__cta--secondary{background:#ffffffe6;color:var(--color-text-main);border:1px solid rgba(230,215,191,.9)}.game-panel__error{margin:6px 0;padding:6px 8px;border-radius:var(--radius-md);font-size:.78rem;background:#fbeaea;border:1px solid #f3b3b0;color:var(--color-text-danger);display:flex;justify-content:space-between;gap:8px;align-items:center}.game-panel__error-retry{border:none;background:transparent;font-size:.78rem;font-weight:600;cursor:pointer;color:var(--color-text-danger);text-decoration:underline}.sync-pill{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;font-size:.75rem;background:#ffffffb3}.sync-pill__dot{width:8px;height:8px;border-radius:999px;background:#9aa3af}.sync-pill__label{font-weight:500}.sync-pill__timestamp{font-size:.7rem;color:var(--color-text-muted)}.sync-pill--synced .sync-pill__dot{background:var(--color-empath-green)}.sync-pill--syncing .sync-pill__dot{background:var(--color-cta);animation:empath-pulse 1s infinite}.sync-pill--error .sync-pill__dot{background:var(--color-text-danger)}.sync-pill--idle .sync-pill__dot{background:var(--color-taxi-yellow)}.achievement-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}.achievement-list__item{display:flex;gap:10px;padding:8px;border-radius:var(--radius-md);background:#ffffffe6;border:1px solid rgba(230,215,191,.7)}.achievement-list__icon{width:28px;height:28px;border-radius:999px;background:#25b66f1a;display:flex;align-items:center;justify-content:center;font-size:.9rem}.achievement-list__content{flex:1}.achievement-list__title-row{display:flex;justify-content:space-between;align-items:center}.achievement-list__title{font-size:.85rem;font-weight:600}.achievement-list__progress-label{font-size:.75rem;color:var(--color-text-muted)}.achievement-list__description{margin:2px 0;font-size:.8rem;color:var(--color-text-main)}.achievement-list__meta{margin:0;font-size:.75rem;color:var(--color-text-muted)}.achievement-list__meter{margin-top:4px;height:6px;border-radius:999px;background:#f0f0f0e6;overflow:hidden}.achievement-list__meter-fill{height:100%;width:0;background:linear-gradient(90deg,var(--color-overwhelm-low),var(--color-overwhelm-mid))}.game-panel__empty{font-size:.8rem;color:var(--color-text-muted)}[data-ui-mode=empath-dark] .game-panel__section{background:#111827;border-color:#1f2937}[data-ui-mode=empath-dark] .game-panel__cta--secondary{background:#0b1120;color:#f9fafb;border-color:#38bdf8;box-shadow:none}[data-ui-mode=empath-dark] .game-panel__cta--secondary:hover{background:#111827;border-color:#facc15}[data-ui-mode=empath-dark] .game-panel__title,[data-ui-mode=empath-dark] .game-panel__label,[data-ui-mode=empath-dark] .game-panel__meta,[data-ui-mode=empath-dark] .game-panel__hint,[data-ui-mode=empath-dark] .game-panel__empty{color:#e5e7eb}[data-ui-mode=empath-dark] .game-panel__badge{background:#374151e6;border-color:#94a3b8e6;color:#f9fafb}[data-ui-mode=empath-dark] .game-panel__meter{background:#020617}[data-ui-mode=empath-dark] .achievement-list__item{background:#111827;border-color:#1f2937}[data-ui-mode=empath-dark] .achievement-list__title,[data-ui-mode=empath-dark] .achievement-list__description,[data-ui-mode=empath-dark] .achievement-list__meta,[data-ui-mode=empath-dark] .achievement-list__progress-label{color:#e5e7eb}[data-ui-mode=empath-dark] .game-panel__error{background:#7f1d1dd9;border-color:#fecaca;color:#fee2e2}.game-preview{margin:0}.game-preview__image-wrapper{position:relative;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-soft-sm)}.game-preview__image{width:100%;height:120px;object-fit:cover;display:block}.game-preview__image--placeholder{background:radial-gradient(circle at top left,#ffecc4 0,#ffc53a 40%,#ecf7f4)}.game-preview__overlay{position:absolute;inset:auto 0 0 0;padding:8px 10px;display:flex;flex-direction:column;gap:2px;background:linear-gradient(to top,#00000073,#0000);color:#fff;font-size:.8rem}.game-preview__tag{align-self:flex-start;padding:2px 8px;border-radius:999px;background:#00000059}.game-preview__title{font-weight:600}.game-preview--loading .game-preview__skeleton-rect{width:100%;height:120px;border-radius:var(--radius-lg);background:var(--color-bg-panel);position:relative;overflow:hidden}.game-preview--loading .game-preview__skeleton-line{width:60%;height:10px;border-radius:999px;margin-top:8px;background:var(--color-bg-panel);position:relative;overflow:hidden}.game-preview--loading .game-preview__skeleton-rect:before,.game-preview--loading .game-preview__skeleton-line:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;transform:translate(-100%);background:linear-gradient(120deg,transparent 0%,rgba(255,255,255,.8) 40%,transparent 80%);animation:empath-skeleton-slide 1.2s infinite}.game-panel__skeleton{margin-top:4px;display:flex;flex-direction:column;gap:6px}.game-panel__skeleton-line{width:100%;height:8px;border-radius:999px;background:var(--color-bg-panel);position:relative;overflow:hidden}.game-panel__skeleton-line--short{width:60%}.game-panel__skeleton-meter{width:100%;height:8px;border-radius:999px;background:var(--color-bg-panel);position:relative;overflow:hidden}.game-panel__skeleton-line:before,.game-panel__skeleton-meter:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;transform:translate(-100%);background:linear-gradient(120deg,transparent 0%,rgba(255,255,255,.85) 40%,transparent 80%);animation:empath-skeleton-slide 1.2s infinite}@media(min-width:768px)and (max-width:1023.98px){.app-shell{padding:24px}.empath-app{max-width:960px}.app-main{flex-direction:row;align-items:stretch;gap:20px}.chat-panel{flex:3}.game-panel{flex:2}}@media(min-width:1024px){.app-shell{padding:32px}.empath-app{max-width:var(--layout-max-width)}.app-main{flex-direction:row;align-items:stretch;gap:24px}.chat-panel{flex:2.2}.game-panel{flex:1.8}}.message-list::-webkit-scrollbar{width:6px}.message-list::-webkit-scrollbar-track{background:transparent}.message-list::-webkit-scrollbar-thumb{background:#becdc7e6;border-radius:999px}@keyframes empath-skeleton-slide{0%{transform:translate(-100%)}to{transform:translate(100%)}}@keyframes empath-pulse{0%{transform:scale(1);opacity:.7}50%{transform:scale(1.2);opacity:1}to{transform:scale(1);opacity:.7}}
