:root{--tile-w:50px;--tile-h:66px;--tile-sm-w:30px;--tile-sm-h:40px;--tile-symbol:1.4em;--tile-sm-symbol:1em;--gap-hand:2px;--gap-actions:12px;--btn-padding:10px 24px;--btn-primary-padding:14px 32px;--banner-font:2.5rem}.app{color:#e8e8e8;background:radial-gradient(at 20%,#1e5a3266 0%,#0000 60%),radial-gradient(at 80%,#1446284d 0%,#0000 60%),repeating-linear-gradient(0deg,#0000,#0000 2px,#00000008 2px 4px),repeating-linear-gradient(90deg,#0000,#0000 2px,#00000005 2px 4px),linear-gradient(135deg,#1a5c2e 0%,#14472a 40%,#0f3a22 100%);flex-direction:column;max-width:800px;min-height:100vh;margin:0 auto;padding:8px;font-family:"M PLUS Rounded 1c",Segoe UI,sans-serif;display:flex;overflow-x:hidden}.app__header{text-align:center;border-bottom:1px solid #2a6a3a;padding:8px 0}.app__header h1{color:#90ee90;margin:0;font-size:1.4rem}.logo{vertical-align:middle;align-items:center;gap:6px;display:inline-flex}.logo--large{gap:10px}.logo__icon{filter:drop-shadow(0 2px 4px #0000004d);flex-shrink:0}.logo__text{color:#e8dcc8;text-shadow:0 1px 2px #00000080,0 0 20px #4caf504d;letter-spacing:.08em;font-weight:700}.logo--large .logo__text{background:linear-gradient(#f5e6c8 0%,#d4a853 100%);-webkit-text-fill-color:transparent;filter:drop-shadow(0 2px 4px #00000080);-webkit-background-clip:text;background-clip:text}.header__content{justify-content:space-between;align-items:center;display:flex}.header__logo{text-decoration:none}.header__nav{align-items:center;gap:12px;font-size:.85rem;display:flex}.header__user{color:gold}.header__link{color:#90ee90;text-decoration:none}.header__link:hover{text-decoration:underline}.header__btn{color:#aaa;cursor:pointer;background:0 0;border:1px solid #555;border-radius:4px;padding:4px 10px;font-size:.85rem}.header__btn:hover{background:#333}.lobby{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:20px;display:flex}.lobby__hero{margin-bottom:12px;animation:.6s ease-out fade-in}@keyframes fade-in{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.lobby p{color:#aaa;font-size:1.1rem}.lobby__spinner{border:3px solid #333;border-top-color:#90ee90;border-radius:50%;width:40px;height:40px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.login-form{background:#0d2818;border-radius:12px;flex-direction:column;align-items:center;gap:12px;width:100%;max-width:320px;padding:20px;display:flex}.login-form h3{color:#90ee90;margin:0}.login-form__input{color:#e0e0e0;box-sizing:border-box;background:#1a472a;border:1px solid #333;border-radius:8px;width:100%;padding:10px 12px;font-size:1rem}.login-form__input:focus{border-color:#4caf50;outline:none}.login-form__error{color:#ff6b6b;margin:0;font-size:.9rem}.login-form__link{color:#90ee90;font-size:.9rem}.top-page__links{align-items:center;gap:16px;display:flex}.top-page__links a{color:#90ee90}.mypage-stats{background:#0d2818;border-radius:12px;flex-direction:column;gap:12px;width:100%;max-width:320px;padding:20px;display:flex}.mypage-stats__item{justify-content:space-between;display:flex}.mypage-stats__label{color:#888}.mypage-stats__value{color:gold;font-weight:700}.game-board{flex-direction:column;flex:1;justify-content:space-between;gap:8px;padding:8px 4px;display:flex}.game-board__opponent{flex-direction:column;gap:4px;display:flex}.game-board__me{flex-direction:column;gap:4px;margin-top:auto;display:flex}.score-tag{background:linear-gradient(#0a1e14d9 0%,#05140cf2 100%);border:1px solid #ffd70033;border-radius:8px;align-items:center;gap:8px;padding:6px 14px;display:inline-flex;box-shadow:0 2px 8px #0000004d}.score-tag__label{color:#b0b8a0;text-shadow:0 1px 2px #00000080;font-size:.75rem}.score-tag__value{color:gold;text-shadow:0 0 8px #ffd7004d;font-size:1.1rem;font-weight:700}.score-tag__riichi-badge{color:#fff;background:#f44;border-radius:3px;margin-left:4px;padding:1px 5px;font-size:.7rem}.game-board__opponent .score-tag,.game-board__me .score-tag{align-self:flex-start}.score-display{background:#0d2818;border-radius:8px;justify-content:space-between;align-items:center;padding:8px 12px;display:flex}.score-display__opponent,.score-display__me{flex-direction:column;gap:2px;display:flex}.score-display__label{color:#888;font-size:.75rem}.score-display__value{color:gold;font-size:1.2rem;font-weight:700}.score-display__separator{background:#333;width:1px;height:30px}.score-display__riichi-badge{color:#fff;background:#f44;border-radius:4px;margin-left:4px;padding:2px 8px;font-size:.8rem;font-weight:700;animation:1.5s infinite riichi-pulse}@keyframes riichi-pulse{0%,to{opacity:1}50%{opacity:.6}}.tile{flex-direction:column;flex:0 1 var(--tile-w);min-width:0;max-width:var(--tile-w);height:var(--tile-h);touch-action:manipulation;cursor:pointer;background:linear-gradient(#fffef5 0%,#f0ead8 60%,#e0d8c0 100%);border-top:1px solid #b8a88a;border-bottom:3px solid #8a7a60;border-left:1px solid #b8a88a;border-right:2px solid #a09070;border-radius:5px;justify-content:center;align-items:center;padding:2px;font-family:inherit;transition:transform .15s,box-shadow .15s;display:inline-flex;position:relative;box-shadow:0 2px 4px #0000004d,inset 0 1px #ffffff1a,inset 0 -1px 2px #0000001a}.tile:hover:not(:disabled){transform:translateY(-8px);box-shadow:0 8px 16px #0006,inset 0 1px #ffffff1a}.tile--selected{border-color:#4caf50;transform:translateY(-10px);box-shadow:0 8px 20px #4caf5066,0 0 8px #4caf504d}.tile--drawn{margin-left:12px}.tile--disabled{cursor:default;opacity:.85}.tile--disabled:hover{transform:none;box-shadow:0 2px 4px #0000004d,inset 0 1px #ffffff1a}.tile--small{flex:0 1 var(--tile-sm-w);max-width:var(--tile-sm-w);height:var(--tile-sm-h);border-bottom-width:2px;border-right-width:1px;font-size:.8em;box-shadow:0 1px 3px #0000004d}.tile--facedown{cursor:default;background:linear-gradient(#e8d88c 0%,#d8c870 60%,#c4b060 100%);border-color:#b8a050 #b8a050 #a09040;box-shadow:0 2px 4px #0000004d,inset 0 1px #fff3}.tile__svg{margin:auto;display:block}.tile__img{object-fit:contain;pointer-events:none;width:100%;height:100%;display:block}.tile__symbol{font-size:var(--tile-symbol);line-height:1}.tile--small .tile__symbol{font-size:var(--tile-sm-symbol)}.tile__number{color:#333;font-size:.7rem;font-weight:700}.hand{gap:var(--gap-hand);flex-wrap:nowrap;justify-content:flex-start;max-width:100%;padding:8px 4px;display:flex}.hand--opponent{gap:var(--gap-hand)}.hand--riichi-locked{border:2px solid #f44;border-radius:8px;padding:4px}.game-board__center{flex-direction:column;flex:1;justify-content:center;gap:2px;padding:0 8px;display:flex}.discards{padding:2px 0}.discards__label{color:#666;margin-bottom:2px;font-size:.65rem;display:block}.discards__tiles{min-height:28px;padding-left:calc(50% - var(--tile-sm-w) * 3);flex-wrap:wrap;gap:2px;display:flex}.discards--reverse .discards__tiles{padding-left:0;padding-right:calc(50% - var(--tile-sm-w) * 3);flex-direction:row-reverse}.discards__empty{color:#555;font-size:.9rem}.ankans{gap:8px;padding:4px 8px;display:flex}.ankan-group{gap:1px;display:flex}.game-info{text-shadow:0 1px 2px #00000080;background:linear-gradient(#0a1e14b3 0%,#05140cd9 100%);border:1px solid #64a06426;border-radius:8px;justify-content:space-between;align-items:center;padding:6px 12px;font-size:.9rem;display:flex}.game-info__wall,.game-info__turn{color:#888}.game-info__turn--active{color:#90ee90;font-weight:700}.game-board__hand-area{position:relative}.game-board__hand-area .action-buttons{z-index:10;position:absolute;top:-4px;right:4px;transform:translateY(-100%)}.action-buttons{flex-direction:column;align-items:flex-end;gap:4px;padding:4px;display:flex}.action-buttons__row{gap:6px;display:flex}.ron-banner{color:#ff80ab;background:#e91e6333;border:1px solid #e91e63;border-radius:6px;padding:4px 12px;font-size:.85rem;font-weight:700;animation:1.5s ease-in-out infinite pulse-glow}.action-btn{padding:var(--btn-padding);cursor:pointer;color:#fff;text-shadow:0 1px 2px #0000004d;background:linear-gradient(#555 0%,#3a3a3a 100%);border:none;border-radius:8px;min-width:44px;min-height:44px;font-size:1rem;font-weight:700;transition:background .2s,transform .1s,box-shadow .2s;box-shadow:0 2px 4px #0000004d}.action-btn:hover{filter:brightness(1.15);transform:translateY(-1px);box-shadow:0 4px 8px #0006}.action-btn--primary{padding:var(--btn-primary-padding);background:linear-gradient(#5cbf60 0%,#43a047 100%);font-size:1.2rem;box-shadow:0 3px 6px #43a0474d}.action-btn--share{background:#1da1f2}.action-btn--invite{background:#ff9800}.invite-code{text-align:center;margin:16px 0}.invite-code__label{color:#aaa;margin-bottom:4px;font-size:.9rem}.invite-code__value{letter-spacing:.3em;color:#90ee90;font-family:monospace;font-size:2.5rem;font-weight:700}.invite-panel{flex-direction:column;align-items:center;gap:6px;display:flex}.invite-panel__row{align-items:center;gap:6px;display:flex}.invite-panel__input{text-align:center;letter-spacing:.2em;color:#e0e0e0;text-transform:uppercase;background:#2a4a2a;border:2px solid #4caf50;border-radius:8px;width:5em;padding:6px 8px;font-family:monospace;font-size:1.1rem}.invite-panel__join{min-height:38px;padding:6px 16px!important;font-size:.9rem!important}.invite-panel__close{min-width:38px;min-height:38px;padding:6px 10px!important;font-size:1rem!important}.invite-panel__error{color:#ff6b6b;margin:0;font-size:.85rem}.action-btn--tsumo,.action-btn--ron{background:linear-gradient(#e91e63 0%,#c2185b 100%);min-height:36px;padding:6px 14px;font-size:.85rem}.action-btn--riichi{background:linear-gradient(#2196f3 0%,#1976d2 100%);min-height:36px;padding:6px 14px;font-size:.85rem}.action-btn--ankan{background:linear-gradient(#ff9800 0%,#f57c00 100%);min-height:36px;padding:6px 14px;font-size:.85rem}.action-btn--draw{background:linear-gradient(#2196f3,#1565c0);width:100%;min-height:36px;padding:6px 14px;font-size:.85rem}.action-btn:disabled{opacity:.4;cursor:default;color:#888;box-shadow:none;text-shadow:none;background:linear-gradient(#444 0%,#333 100%);transform:none}.action-btn:disabled:hover{filter:none;box-shadow:none;transform:none}.action-btn--ready{animation:1.5s ease-in-out infinite pulse-glow;box-shadow:0 0 12px #e91e6380}.round-result{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:20px;padding:20px;display:flex}.round-result__banner{font-size:var(--banner-font);border-radius:12px;padding:12px 40px;font-weight:700}.round-result__banner--win{color:gold;background:#ffd7001a;border:2px solid gold}.round-result__banner--lose{color:#ff6b6b;background:#ff6b6b1a;border:2px solid #ff6b6b}.round-result__banner--draw{color:#aaa;background:#8080801a;border:2px solid #555}.round-result__yaku{text-align:center}.round-result__yaku h3{color:#ff80ab;margin:0 0 8px}.round-result__yaku ul{margin:0;padding:0;list-style:none}.round-result__yaku li{padding:4px 0}.round-result__score{margin-top:8px;font-size:1.3rem;font-weight:700}.round-result__score--win{color:gold}.round-result__score--lose{color:#ff6b6b}.round-result__scores{gap:24px;font-size:1.1rem;display:flex}.round-result__chombo{text-align:center}.round-result__chombo-label{color:#ff6b6b;margin-bottom:4px;font-size:1.1rem;font-weight:700}.round-result__board{background:#0a1e1499;border:1px solid #64a06433;border-radius:8px;flex-direction:column;gap:4px;width:100%;max-width:600px;padding:12px;display:flex}.round-result__hand-row{flex-direction:column;gap:2px;display:flex}.round-result__section-label{color:#888;font-size:.7rem}.round-result__hand{flex-wrap:nowrap;gap:1px;display:flex}.round-result__waiting{color:#aaa;padding:12px;font-style:italic}.game-result{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:20px;padding:20px;display:flex}.game-result__banner{font-size:var(--banner-font);border-radius:12px;padding:12px 40px;font-weight:700}.game-result__banner--win{color:gold;background:#ffd7001a;border:2px solid gold}.game-result__banner--lose{color:#888;background:#8080801a;border:2px solid #555}.game-result__reason{color:#aaa;font-style:italic}.game-result__yaku{text-align:center}.game-result__yaku h3{color:#ff80ab;margin:0 0 8px}.game-result__yaku ul{margin:0;padding:0;list-style:none}.game-result__yaku li{padding:4px 0}.game-result__score{color:gold;margin-top:8px;font-size:1.3rem;font-weight:700}.game-result__final-scores{gap:24px;font-size:1.1rem;display:flex}.game-result__rating{color:#e0e0e0;font-size:1rem}.game-result__rating--up{color:#4caf50;font-weight:700}.game-result__rating--down{color:#ff6b6b;font-weight:700}.game-result__actions{gap:12px;display:flex}.connection-status{text-align:center;padding:8px;font-size:.85rem;font-weight:700}.ranking-table{border-collapse:collapse;width:100%;max-width:500px;font-size:.9rem}.ranking-table th,.ranking-table td{text-align:center;border-bottom:1px solid #333;padding:8px 12px}.ranking-table th{color:#90ee90;font-size:.8rem}.ranking-table td:first-child{color:gold;font-weight:700}.ranking-table td:nth-child(2){text-align:left}.ranking-pagination{align-items:center;gap:16px;margin-top:12px;display:flex}.connection-status--reconnecting{color:#000;background:#ff9800}.connection-status--disconnected{color:#fff;background:#f44336}@media (width<=480px){:root{--tile-w:32px;--tile-h:43px;--tile-sm-w:22px;--tile-sm-h:30px;--tile-symbol:1.2em;--tile-sm-symbol:.8em;--gap-hand:1px;--gap-actions:8px;--btn-padding:10px 16px;--btn-primary-padding:12px 24px;--banner-font:1.8rem}.game-board{gap:4px;padding:4px}.game-info{padding:4px 8px;font-size:.8rem}.discards__tiles{min-height:30px}.round-result__scores,.game-result__final-scores{flex-direction:column;gap:8px}.score-display{padding:4px 8px;font-size:.8rem}}@media (width<=480px) and (orientation:portrait){:root{--tile-w:26px;--tile-h:35px;--tile-sm-w:20px;--tile-sm-h:27px;--gap-hand:1px;--gap-actions:4px;--btn-padding:6px 10px;--btn-primary-padding:8px 16px;--banner-font:1.4rem}.app{min-height:100dvh;max-height:100dvh;padding:2px;overflow:hidden}.app__header{padding:1px 0}.app__header h1{font-size:.9rem}.game-board{justify-content:flex-start;gap:4px;max-height:calc(100dvh - 36px);padding:2px;overflow-y:auto}.game-board__opponent{gap:1px}.game-board__center{flex:none;min-height:0;padding:2px 4px}.game-board__center-info{font-size:.7rem}.game-board__me{gap:2px;margin-top:0}.game-info{padding:2px 6px;font-size:.7rem}.hand{padding:2px 1px}.discards__label{font-size:.6rem}.discards__tiles{gap:1px;min-height:20px}.action-buttons{gap:3px;margin-top:2px}.action-btn{padding:6px 10px;font-size:.75rem}.score-tag{padding:2px 6px;font-size:.65rem}.score-tag__value{font-size:.8rem}}@media (height<=500px) and (orientation:landscape){:root{--gap-hand:1px;--gap-actions:4px;--btn-padding:4px 10px;--btn-primary-padding:6px 16px;--banner-font:1.2rem}.app{padding:2px}.app__header{padding:1px 0}.app__header h1{font-size:.9rem}.game-board{gap:1px;padding:1px 2px}.game-board__opponent,.game-board__me{gap:1px}.game-info{padding:1px 6px;font-size:.7rem}.hand{padding:2px 1px}.discards__label{font-size:.6rem}.discards__tiles{gap:1px;min-height:20px}.action-buttons{gap:4px;margin-top:0}.tile__number{font-size:.6rem}.score-tag{padding:2px 8px;font-size:.7rem}.score-tag__value{font-size:.9rem}}@media (width>=481px) and (width<=768px){:root{--tile-w:38px;--tile-h:50px;--tile-sm-w:26px;--tile-sm-h:35px;--tile-symbol:1.3em;--tile-sm-symbol:.9em;--banner-font:2rem}}@keyframes tile-deal{0%{opacity:0;transform:translateY(20px)scale(.9)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes tile-discard{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes slide-up{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse-glow{0%,to{box-shadow:0 0 8px #ffd70033}50%{box-shadow:0 0 16px #ffd70080}}.hand--dealing .tile{animation:.3s ease-out backwards tile-deal}.hand--dealing .tile:first-child{animation-delay:0s}.hand--dealing .tile:nth-child(2){animation-delay:20ms}.hand--dealing .tile:nth-child(3){animation-delay:40ms}.hand--dealing .tile:nth-child(4){animation-delay:60ms}.hand--dealing .tile:nth-child(5){animation-delay:80ms}.hand--dealing .tile:nth-child(6){animation-delay:.1s}.hand--dealing .tile:nth-child(7){animation-delay:.12s}.hand--dealing .tile:nth-child(8){animation-delay:.14s}.hand--dealing .tile:nth-child(9){animation-delay:.16s}.hand--dealing .tile:nth-child(10){animation-delay:.18s}.hand--dealing .tile:nth-child(11){animation-delay:.2s}.hand--dealing .tile:nth-child(12){animation-delay:.22s}.hand--dealing .tile:nth-child(13){animation-delay:.24s}.hand--dealing .tile:nth-child(14){animation-delay:.26s}.hand--kan-mode{position:relative}.hand__kan-hint{text-align:center;color:gold;text-shadow:0 1px 2px #00000080;font-size:.8rem;animation:1.5s infinite pulse-glow;position:absolute;top:-28px;left:0;right:0}.discards__tiles .tile{animation:.2s ease-out tile-discard}.game-result,.round-result{animation:.4s ease-out slide-up}.tile:active:not(:disabled){transition:transform 50ms;transform:scale(.95)}.ad-banner{max-width:480px;min-height:50px;margin:8px auto}.ad-banner--placeholder{background:#ffffff0d;border:1px dashed #ffffff26;border-radius:6px;justify-content:center;align-items:center;min-height:60px;display:flex}.ad-banner__text{color:#ffffff40;letter-spacing:2px;font-size:.75rem}.mypage-premium-badge{color:#1a1a2e;text-align:center;background:linear-gradient(135deg,gold 0%,#fa0 100%);border-radius:20px;margin-bottom:8px;padding:8px 16px;font-size:.9rem;font-weight:700}.mypage-checkout-msg{text-align:center;border-radius:8px;margin-bottom:12px;padding:8px 16px;font-size:.9rem}.mypage-checkout-msg--success{color:#81c784;background:#4caf5033;border:1px solid #4caf504d}.mypage-checkout-msg--cancel{color:#ffb74d;background:#ff980033;border:1px solid #ff98004d}*{box-sizing:border-box;margin:0;padding:0}body{color:#e0e0e0;-webkit-font-smoothing:antialiased;touch-action:manipulation;background:#111}
