:root{--color-bg-primary: #1a120b;--color-bg-secondary: #1e1510;--color-bg-tertiary: #12200e;--color-bg-surface: rgba(255, 245, 230, .08);--color-bg-surface-hover: rgba(255, 245, 230, .12);--color-bg-elevated: rgba(40, 28, 18, .95);--color-felt: #1a5c38;--color-felt-light: #22704a;--color-felt-dark: #0f3d24;--color-table-wood: #2a1a0e;--color-table-rim: #3d2817;--color-gold: #ffd700;--color-gold-dim: #c9a800;--color-gold-glow: rgba(255, 215, 0, .3);--color-jade: #2e8b57;--color-jade-light: #3da96d;--color-jade-dim: #1e6b3f;--color-rose: #a84860;--color-rose-dim: #883850;--color-amber: #d4a574;--color-amber-dim: #b8885a;--color-sapphire: #5b9bd5;--color-orchid: #c490d1;--color-error: #e74c3c;--color-error-dim: #c0392b;--color-error-bg: rgba(231, 76, 60, .15);--color-success: #27ae60;--color-success-dim: #1e8449;--color-success-bg: rgba(39, 174, 96, .15);--color-warning: #f39c12;--color-warning-dim: #d68910;--color-warning-bg: rgba(243, 156, 18, .15);--color-info: #3498db;--color-info-bg: rgba(52, 152, 219, .15);--color-text-primary: #f5f0e8;--color-text-secondary: rgba(245, 240, 232, .7);--color-text-muted: rgba(245, 240, 232, .45);--color-text-inverse: #1a120b;--color-tile-face-light: #faf6ef;--color-tile-face-dark: #ebe0d0;--color-tile-border: #c4b49a;--color-tile-border-selected: var(--color-gold);--color-tile-shadow: rgba(0, 0, 0, .15);--color-tile-shadow-selected: rgba(255, 215, 0, .4);--color-tile-back-light: #2a6a4a;--color-tile-back-dark: #1a4a32;--color-tile-back-border: #3a8a5a;--color-tile-back-inner: rgba(74, 138, 106, .4);--color-tile-highlight-inset: rgba(255, 255, 255, .5);--space-xs: .25rem;--space-sm: .5rem;--space-md: .75rem;--space-lg: 1rem;--space-xl: 1.5rem;--space-2xl: 2rem;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-full: 9999px;--shadow-sm: 0 2px 4px rgba(0, 0, 0, .2);--shadow-md: 0 4px 12px rgba(0, 0, 0, .3);--shadow-lg: 0 8px 32px rgba(0, 0, 0, .4);--shadow-gold: 0 0 20px rgba(255, 215, 0, .2);--shadow-inset-highlight: inset 0 1px 0 rgba(255, 255, 255, .5);--font-display: "DM Serif Display", Georgia, serif;--font-body: "Nunito", system-ui, -apple-system, sans-serif;--transition-fast: .15s ease;--transition-base: .2s ease;--transition-slow: .3s ease;--z-base: 0;--z-above: 10;--z-overlay: 50;--z-modal: 100;--z-toast: 900;--z-tooltip: 1000}.app{display:flex;flex-direction:column;width:100%;height:100%;min-height:0;box-sizing:border-box}.app--page,.app--page-centered{align-items:center;justify-content:flex-start;overflow-y:auto;overflow-x:hidden;padding-top:calc(env(safe-area-inset-top,0px) + var(--space-md));padding-bottom:calc(env(safe-area-inset-bottom,0px) + var(--space-md))}.app--page-centered .container{margin-top:auto;margin-bottom:auto}.app--transition{align-items:stretch;justify-content:flex-start;overflow:hidden;padding-top:calc(env(safe-area-inset-top,0px) + var(--space-md));padding-right:max(env(safe-area-inset-right,0px),var(--space-md));padding-bottom:calc(env(safe-area-inset-bottom,0px) + var(--space-md));padding-left:max(env(safe-area-inset-left,0px),var(--space-md))}.app--waiting-split{align-items:center;justify-content:center;overflow:hidden;padding-top:calc(env(safe-area-inset-top,0px) + var(--space-sm));padding-right:max(env(safe-area-inset-right,0px),var(--space-md));padding-bottom:calc(env(safe-area-inset-bottom,0px) + var(--space-sm));padding-left:max(env(safe-area-inset-left,0px),var(--space-md))}.app--fullscreen{position:relative;align-items:stretch;justify-content:flex-start;overflow:hidden;padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}.container{max-width:600px;width:100%;padding:0 var(--space-md);box-sizing:border-box}.app--waiting-split .container{display:flex;flex:1 1 auto;min-height:0;padding:0}.waiting-room{overflow-y:auto}.waiting-room--landscape{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(200px,1fr);gap:var(--space-xl);align-items:center;padding:var(--space-lg)}.waiting-room--landscape h2{font-size:1.1rem;margin-bottom:var(--space-xs)}.waiting-room--landscape .room-code{font-size:2rem;letter-spacing:.3rem;margin:var(--space-sm) 0}.waiting-room--landscape .player-list{gap:var(--space-sm);margin:var(--space-sm) 0}.waiting-room--landscape .waiting-room__right{border-left:1px solid rgba(255,245,230,.08);padding-left:var(--space-xl)}.card.waiting-room--mobile.waiting-room--split{display:grid;grid-template-columns:2fr 3fr;grid-template-rows:auto 1fr;gap:0;padding:0;overflow:hidden;width:100%;height:100%;min-height:0;box-sizing:border-box}.waiting-room--mobile.waiting-room--split .waiting-room__title{grid-column:1 / -1;text-align:center;padding:1rem var(--space-lg) var(--space-md)}.waiting-room--mobile.waiting-room--split .waiting-room__title h2{font-size:1.15rem;margin:0}.waiting-room--mobile.waiting-room--split .waiting-room__left{padding:var(--space-md) var(--space-md) var(--space-lg) var(--space-lg);display:flex;flex-direction:column;gap:var(--space-sm);min-height:0;overflow:hidden}.waiting-room--mobile.waiting-room--split .waiting-room__right{border-left:1px solid rgba(255,245,230,.08);padding:var(--space-md) var(--space-lg) var(--space-lg) var(--space-md);min-height:0;overflow-y:auto}.waiting-room--mobile.waiting-room--split .room-code{font-size:2.25rem;letter-spacing:.35rem;margin:0 0 var(--space-xs) 0}.waiting-room--mobile.waiting-room--split .player-list{gap:var(--space-sm);margin:0 0 var(--space-xs) 0}.card.waiting-room--mobile.waiting-room--single-column{max-height:calc(100dvh - 1.5rem)}@media (max-width: 640px){.card.waiting-room--mobile.waiting-room--single-column{padding:var(--space-xl) var(--space-md) var(--space-md)}.waiting-room--single-column .room-code{font-size:clamp(2.2rem,12vw,2.8rem);letter-spacing:clamp(.2rem,2.2vw,.4rem)}}@media (max-height: 500px) and (orientation: landscape){.container{max-width:90vw;padding:var(--space-sm) var(--space-md)}.app--waiting-split .container{padding:0}.card{padding:var(--space-lg)}h1{font-size:1.75rem;margin-bottom:var(--space-sm)}.player-list{gap:var(--space-sm);margin:var(--space-md) 0}.button-group{margin-top:var(--space-md)}}h1{font-family:var(--font-display);font-size:2.5rem;margin-bottom:var(--space-lg);text-align:center;color:var(--color-gold)}h2{font-family:var(--font-display);font-size:1.5rem;margin-bottom:var(--space-lg);color:var(--color-text-primary)}.card{background:var(--color-bg-surface);border-radius:var(--radius-xl);padding:var(--space-2xl);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,245,230,.06);box-shadow:var(--shadow-md)}.form-group{margin-bottom:var(--space-lg)}.form-group label{display:block;margin-bottom:var(--space-sm);font-weight:500;color:var(--color-text-secondary)}.button-group{display:flex;gap:var(--space-lg);margin-top:var(--space-xl)}.room-code{font-family:var(--font-display);font-size:3rem;font-weight:700;letter-spacing:.5rem;text-align:center;color:var(--color-gold);text-shadow:0 0 30px rgba(255,215,0,.3);margin:var(--space-lg) 0}.player-list{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-lg);margin:var(--space-xl) 0}.error{color:var(--color-error);margin-top:var(--space-sm);font-size:.875rem}.loading{opacity:.7;pointer-events:none}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}@keyframes gold-pulse{0%,to{box-shadow:0 0 8px #ffd7004d}50%{box-shadow:0 0 20px #ffd70099}}@keyframes seat-pulse{0%,to{box-shadow:0 0 8px rgba(var(--seat-glow-rgb, 255, 215, 0),.28)}50%{box-shadow:0 0 20px rgba(var(--seat-glow-rgb, 255, 215, 0),.52)}}@keyframes drawn-tile-float{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}.drawn-tile-float{animation:drawn-tile-float 5s ease-in-out infinite}.drawn-tile-label{position:absolute;bottom:calc(100% + 3px);left:50%;transform:translate(-50%);padding:1px 6px;background:#5a3a0a;border:1px solid #d4a04a;border-radius:999px;font-size:8px;font-weight:600;letter-spacing:.04em;color:#f0c97a;box-shadow:0 0 8px #d4a04ab3,0 0 3px #d4a04a66;white-space:nowrap;pointer-events:none;-webkit-user-select:none;user-select:none;z-index:100}@keyframes gold-shimmer{0%{background-position:-200% center}to{background-position:200% center}}.timer-bar{transition:width .1s linear}@property --tenpai-angle{syntax: "<angle>"; initial-value: 0deg; inherits: false;}@keyframes tenpai-border-chase{to{--tenpai-angle: 360deg}}.hand-tenpai{position:relative}.hand-tenpai:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;padding:2px;background:conic-gradient(from var(--tenpai-angle),transparent 0deg,rgba(255,215,0,.4) 20deg,rgba(255,215,0,.9) 30deg,rgba(255,215,0,.4) 40deg,transparent 60deg);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;animation:tenpai-border-chase 3s linear infinite}@keyframes tenpai-shimmer-sweep{0%{transform:translate(-100%)}35%{transform:translate(160%)}to{transform:translate(160%)}}.hand-tenpai-shimmer{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;border-radius:inherit;pointer-events:none;z-index:1}.hand-tenpai-shimmer:after{content:"";position:absolute;top:-50%;left:0;width:55%;height:200%;background:linear-gradient(110deg,transparent 20%,rgba(255,215,0,.04) 35%,rgba(255,215,0,.13) 50%,rgba(255,215,0,.04) 65%,transparent 80%);animation:tenpai-shimmer-sweep 2.5s ease-in-out infinite;will-change:transform}.hand-tenpai-rose{position:relative}.hand-tenpai-rose:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;padding:2px;background:conic-gradient(from var(--tenpai-angle),transparent 0deg,rgba(168,72,96,.4) 20deg,rgba(168,72,96,.9) 30deg,rgba(168,72,96,.4) 40deg,transparent 60deg);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none;animation:tenpai-border-chase 3s linear infinite}.hand-tenpai-shimmer-rose{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;border-radius:inherit;pointer-events:none;z-index:1}.hand-tenpai-shimmer-rose:after{content:"";position:absolute;top:-50%;left:0;width:55%;height:200%;background:linear-gradient(110deg,transparent 20%,rgba(168,72,96,.04) 35%,rgba(168,72,96,.13) 50%,rgba(168,72,96,.04) 65%,transparent 80%);animation:tenpai-shimmer-sweep 2.5s ease-in-out infinite;will-change:transform}@media (orientation: landscape) and (max-height: 600px){.features-grid{grid-template-columns:repeat(2,1fr)!important}}@media (prefers-reduced-motion: reduce){.hand-tenpai:before{animation:none;background:#ffd70040}.hand-tenpai-rose:before{animation:none;background:#a8486040}.hand-tenpai-shimmer:after,.hand-tenpai-shimmer-rose:after{animation:none;opacity:0}.drawn-tile-float{animation:none}}.mahjong-pattern{background-image:linear-gradient(45deg,rgba(255,215,0,.03) 25%,transparent 25%),linear-gradient(-45deg,rgba(255,215,0,.03) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,rgba(46,139,87,.03) 75%),linear-gradient(-45deg,transparent 75%,rgba(46,139,87,.03) 75%);background-size:80px 80px;background-position:0 0,0 40px,40px -40px,-40px 0}.section-divider{height:1px;background:linear-gradient(90deg,transparent,rgba(255,215,0,.2),transparent);position:relative;max-width:1100px;margin:0 auto}.section-divider:after{content:"◆ ◆ ◆";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);color:#ffd70059;font-size:.6rem;letter-spacing:.5rem;background:var(--color-bg-primary);padding:0 1rem}.glass-card{background:#fff5e614;border:1px solid rgba(255,245,230,.12);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);transition:all .3s cubic-bezier(.4,0,.2,1)}.glass-card:hover{border-color:#ffd70040;background:#fff5e61f;transform:translateY(-3px);box-shadow:0 12px 30px -8px #00000080}.toc-link{border-left:2px solid transparent;padding-left:1rem;transition:all .2s ease}.toc-link.active{color:var(--color-gold);border-left-color:var(--color-gold)}@keyframes fadeUp{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}.hide-scrollbar::-webkit-scrollbar{display:none}