*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,sans-serif;background:#f4efe3;color:#23201a}button{cursor:pointer;border:1px solid #23201a;background:#fff;border-radius:6px;padding:6px 12px;font-size:14px}button:disabled{opacity:.4;cursor:not-allowed}button.primary{background:#2e7d32;color:#fff}button.active{background:#1565c0;color:#fff}.page{max-width:480px;margin:40px auto;padding:0 16px}.page-home h1{text-align:center}.field{display:flex;flex-direction:column;gap:4px;margin-bottom:12px}.field input,.field select{padding:8px;font-size:16px;border:1px solid #23201a;border-radius:6px}.card{background:#fff;border:1px solid #ddd4bf;border-radius:10px;padding:16px;margin-bottom:16px}.error{color:#c62828;font-weight:600}.room-code{font-family:monospace;background:#23201a;color:#fff;padding:2px 8px;border-radius:6px}.seat-list{list-style:none;padding:0}.seat-list li{padding:8px;border-bottom:1px solid #ddd4bf}.seat-filled{font-weight:600}.seat-empty{color:#999;font-style:italic}.hint{color:#666;font-size:14px}.page-game{max-width:none;margin:0;padding:0}.game-page{display:flex;height:100vh;position:relative}.game-main{flex:1;position:relative;background:#bcd2e8}.hex-board{width:100%;height:100%}.tile.selectable,.edge.selectable,.vertex.selectable,.building.selectable{cursor:pointer}.tile.selectable:hover{filter:brightness(1.15)}.vertex.selectable:hover{opacity:1}.building.selectable:hover path{filter:brightness(1.2)}.dice-readout{position:absolute;top:12px;left:12px;background:#ffffffe6;padding:8px 12px;border-radius:8px;font-weight:700}.game-sidebar{width:360px;background:#fff;border-left:1px solid #ddd4bf;padding:12px;overflow-y:auto;display:flex;flex-direction:column;gap:12px}.game-sidebar-header{display:flex;align-items:center;justify-content:space-between}.game-sidebar-header h2{margin:0;font-size:18px}.quit-button{border-radius:50%;width:30px;height:30px;padding:0;display:flex;align-items:center;justify-content:center;line-height:1;color:#c62828;border-color:#c62828}.quit-button:hover{background:#c62828;color:#fff}.player-panel{display:flex;flex-direction:column;gap:8px}.player-card{border:2px solid #ccc;border-radius:8px;padding:8px}.player-card.active{background:#fff8e1;border-color:#f9a825;box-shadow:0 0 0 2px #f9a825}.player-card-header{display:flex;align-items:center;gap:6px}.turn-badge{margin-left:auto;font-size:16px;line-height:1}.swatch{width:14px;height:14px;border-radius:50%;display:inline-block;border:1px solid #23201a}.player-card-stats{display:flex;gap:10px;font-size:13px;flex-wrap:wrap}.player-card-badges{font-size:12px;margin-top:4px}.badge{margin-right:6px}.my-hand ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px}.my-hand li{background:#f4efe3;border-radius:6px;padding:4px 8px;font-size:13px;text-transform:capitalize}.action-bar{display:flex;flex-direction:column;gap:14px}.action-bar-inactive{color:#666;font-style:italic}.action-section{display:flex;flex-direction:column;gap:6px;padding-top:10px;border-top:1px solid #eee}.action-section:first-child{padding-top:0;border-top:none}.action-section h4{margin:0;font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:#8a8578}.build-buttons{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.build-button{display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 6px;border-radius:10px}.build-button.active{background:#1565c0;border-color:#1565c0;color:#fff}.build-icon{font-size:22px;line-height:1}.build-label{font-size:12px;font-weight:600}.build-cost{display:flex;gap:4px;flex-wrap:wrap;justify-content:center}.build-button .resource-chip{font-size:11px;gap:1px}.build-button.active .resource-chip{color:#fff!important}.play-card-buttons{display:flex;flex-direction:column;gap:6px;align-items:flex-start}.play-card-button{display:inline-flex;align-items:center;gap:6px;background:#fff3cd;border-color:#b8860b}.play-card-button:hover{background:#ffe9a8}.play-card-icon{font-size:16px}.action-footer{display:flex;flex-direction:row;gap:8px;border-top:1px solid #eee;padding-top:10px}.action-footer button{flex:1}.action-group{display:flex;gap:6px;flex-wrap:wrap;align-items:center}.inline-picker{display:flex;gap:4px;align-items:center}.game-log{margin-top:auto;font-size:12px;max-height:160px;overflow-y:auto}.game-log ul{list-style:none;padding:0;margin:0}.game-log li{padding:2px 0;border-bottom:1px solid #eee}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:20}.modal{background:#fff;border-radius:10px;padding:20px;max-width:480px;width:90%;max-height:85vh;overflow-y:auto}.modal-wide{max-width:640px}.modal-header{display:flex;justify-content:space-between;align-items:center}.resource-picker,.trade-columns{display:flex;flex-direction:column;gap:6px}.trade-columns{flex-direction:row;gap:24px}.resource-row{display:flex;align-items:center;gap:8px}.hand-count{color:#999;font-size:12px}.stepper{display:flex;align-items:center;gap:6px}.maritime-trade{display:flex;align-items:center;gap:8px}.resource-chip{display:inline-flex;align-items:center;gap:3px;font-weight:600}.resource-chip-label{text-transform:capitalize}.resource-picker-row{display:flex;gap:4px}.resource-picker-btn{padding:4px 6px}.resource-picker-btn.selected{background:#1565c0;border-color:#1565c0}.resource-picker-btn.selected .resource-chip{color:#fff!important}.trade-offers{display:flex;flex-direction:column;gap:8px}.trade-offer-card{display:flex;flex-direction:column;gap:6px;padding:8px;border:1px solid #ddd4bf;border-radius:8px;font-size:13px}.trade-summary{display:inline-flex;align-items:center;gap:6px}.trade-arrow{color:#999}.trade-partners,.trade-actions{display:flex;gap:6px;flex-wrap:wrap}.dice-stats-button{position:absolute;top:12px;right:12px;background:#ffffffe6}.dice-stats-chart{display:flex;align-items:flex-end;gap:8px;height:200px;margin-top:16px}.dice-stats-bar{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:4px}.dice-stats-count{font-size:12px;font-weight:600}.dice-stats-fill{width:100%;background:#1565c0;border-radius:4px 4px 0 0;min-height:2px}.dice-stats-label{font-size:12px;color:#666}.seat-list li{display:flex;align-items:center;justify-content:space-between;gap:8px}.ready-badge{font-size:12px;color:#999;white-space:nowrap}.ready-badge.ready{color:#2e7d32;font-weight:600}.lobby-actions{display:flex;flex-direction:column;gap:10px;margin-top:16px}.dev-card-stack{position:absolute;top:60px;right:12px;width:52px;height:72px}.dev-card-back{position:absolute;width:52px;height:72px;border-radius:8px;background:linear-gradient(135deg,#4a2f7a,#2e1a52);border:2px solid #f5ecd7;box-shadow:0 2px 4px #0000004d}.dev-card-back-3{transform:translate(4px,4px)}.dev-card-back-2{transform:translate(2px,2px)}.dev-card-back-1{display:flex;align-items:center;justify-content:center}.dev-card-count{color:#f5ecd7;font-size:22px;font-weight:700}.my-dev-cards{position:absolute;bottom:12px;right:12px;display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;max-width:60%}.dev-card-face{display:flex;flex-direction:column;align-items:center;gap:2px;background:#fff;border:1px solid #23201a;border-radius:8px;padding:6px 8px;min-width:64px;box-shadow:0 2px 4px #0003;position:relative}.dev-card-face-icon{font-size:20px}.dev-card-face-label{font-size:10px;text-align:center;line-height:1.1}.dev-card-face-count{position:absolute;top:-6px;right:-6px;background:#1565c0;color:#fff;border-radius:50%;width:18px;height:18px;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center}