:root{--bg-deep: #0a0e12;--bg-panel: #121820;--bg-elevated: #1a222d;--border: #2a3544;--border-focus: #4a7c59;--text: #e8edf2;--text-muted: #8b9aab;--accent: #5cb85c;--accent-dim: #3d7a3d;--accent-glow: rgba(92, 184, 92, .25);--danger: #d9534f;--radius: 10px;--radius-sm: 6px;--font-display: "Rajdhani", sans-serif;--font-body: "Source Sans 3", sans-serif;--touch-min: 44px}*,*:before,*:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}html,body{margin:0;min-height:100vh;min-height:100dvh}body{font-family:var(--font-body);font-size:15px;line-height:1.5;color:var(--text);background:radial-gradient(ellipse at 20% 0%,rgba(92,184,92,.08) 0%,transparent 50%),radial-gradient(ellipse at 80% 100%,rgba(40,80,120,.12) 0%,transparent 50%),var(--bg-deep);padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}#root{min-height:100vh;min-height:100dvh}h1,h2,h3{font-family:var(--font-display);font-weight:700;letter-spacing:.02em}button,input,select,textarea{font-family:var(--font-body);font-size:16px}button{cursor:pointer;touch-action:manipulation}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}.app{max-width:1200px;margin:0 auto;padding:0 1rem 1rem}.app-shell{min-height:100%}.app-bar{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:flex-end;min-height:48px;padding:.65rem 0;margin-bottom:.5rem;border-bottom:1px solid var(--border);background:var(--bg-deep)}.app-bar__actions{display:flex;align-items:center;gap:.5rem;flex-shrink:0}.data-status{font-size:.75rem;color:var(--text-muted)}.data-status--sync{color:var(--accent)}.data-status--error{display:flex;align-items:center;gap:.5rem;color:var(--danger)}.page-loading{text-align:center;padding:3rem 1rem;color:var(--text-muted)}.app-bar__brand{position:absolute;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:.45rem;font-family:var(--font-display);font-weight:700;font-size:.95rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;text-decoration:none;max-width:calc(100% - 7rem)}.app-bar__brand:hover{color:var(--text);text-decoration:none}.app-bar__brand-icon{flex-shrink:0;display:block}.app-shell__main{min-height:0}.login-btn{display:flex;align-items:center;gap:.35rem;min-width:var(--touch-min);min-height:var(--touch-min);padding:.5rem;background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-muted)}.login-btn:hover{color:var(--text);border-color:var(--text-muted)}.login-btn--active{color:var(--accent);border-color:var(--accent);background:#5cb85c1a}.login-btn__icon{width:22px;height:22px}.login-btn__label{font-size:.75rem;font-weight:700;text-transform:uppercase}.server-buttons{display:flex;flex-direction:column;align-items:center;gap:.5rem;margin:1rem 0}.server-buttons__item{display:flex;align-items:center;gap:.5rem}.home{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:70dvh;text-align:center;gap:1rem}.home__brand{display:flex;flex-direction:column;align-items:center;gap:.65rem}.home__brand-icon{filter:drop-shadow(0 0 12px rgba(79,195,247,.35))}.home__title{margin:0;font-size:clamp(1.5rem,5vw,2rem);color:var(--text);text-transform:uppercase}.home__subtitle{margin:0;color:var(--text-muted);font-size:.9rem}.btn--server{min-width:140px;min-height:56px;font-family:var(--font-display);font-size:1.5rem;font-weight:700;margin-top:.5rem}.page-header{margin-bottom:1.25rem}.back-link{display:inline-block;margin-bottom:.5rem;font-size:.9rem;color:var(--text-muted)}.back-link:hover{color:var(--accent)}.page-title{margin:0;font-size:1.5rem;color:var(--accent)}.page-subtitle{margin:.25rem 0 0;color:var(--text-muted);font-size:.9rem}.toolbar{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem;align-items:center}.search-input{flex:1;min-width:180px;min-height:var(--touch-min);padding:.6rem .85rem;background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text)}.search-input:focus{outline:none;border-color:var(--border-focus);box-shadow:0 0 0 2px var(--accent-glow)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.35rem;padding:.55rem 1rem;border:1px solid transparent;border-radius:var(--radius-sm);font-weight:600;font-size:.9rem;text-decoration:none;white-space:nowrap}.btn--primary{background:var(--accent-dim);color:#fff;border-color:var(--accent)}.btn--primary:hover{background:var(--accent)}.btn--secondary{background:var(--bg-elevated);color:var(--text);border-color:var(--border)}.btn--ghost{background:transparent;color:var(--text-muted);border-color:transparent}.btn--sm{padding:.35rem .65rem;font-size:.8rem}.setup-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.5rem}.setup-card{display:flex;align-items:center;gap:.5rem;background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}.setup-card__link{flex:1;padding:1rem;color:inherit;text-decoration:none}.setup-card__link:hover{background:#ffffff08;text-decoration:none}.setup-card__name{display:block;font-family:var(--font-display);font-size:1.1rem;font-weight:700}.setup-card__meta{display:block;font-size:.85rem;color:var(--text-muted);margin-top:.2rem}.search-results{margin-bottom:1rem}.search-results--compact{display:flex;flex-wrap:wrap;gap:.35rem}.search-hit{display:flex;flex-direction:column;align-items:flex-start;width:100%;padding:.75rem;margin-bottom:.35rem;background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);text-align:left}.search-hit--sm{width:auto;margin-bottom:0;padding:.5rem .75rem}.search-hit__meta{font-size:.8rem;color:var(--text-muted);margin-top:.15rem}.edit-panel{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem;padding:.75rem;margin-bottom:1rem;background:#5cb85c14;border:1px solid rgba(92,184,92,.3);border-radius:var(--radius-sm)}.edit-badge{font-size:.75rem;font-weight:700;text-transform:uppercase;color:var(--accent)}.edit-panel__resize{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}.edit-panel__resize label{display:flex;align-items:center;gap:.35rem;font-size:.85rem;color:var(--text-muted)}.edit-panel__resize input{width:64px;padding:.35rem;background:var(--bg-deep);border:1px solid var(--border);border-radius:4px;color:var(--text)}.cryo-grid-wrap{display:grid;gap:4px;overflow:auto;max-height:75dvh;padding-bottom:1rem}.cryo-cell{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:64px;padding:.35rem;border:2px solid rgba(255,255,255,.12);border-radius:var(--radius-sm);color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5);font-size:.65rem;line-height:1.2;transition:transform .1s,border-color .1s,box-shadow .1s}.cryo-cell:hover{transform:scale(1.02);border-color:#fff6}.cryo-cell--filled:not(.cryo-cell--highlight){border-color:#ffffff40}.cryo-cell--highlight{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent),0 0 14px var(--accent-glow);transform:scale(1.04);z-index:2}.cryo-cell__name{font-weight:700;font-family:var(--font-display);font-size:.7rem;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.cryo-cell__pos{opacity:.85;margin-top:.15rem;font-size:.6rem}.cryo-cell__count{opacity:.85;margin-top:.15rem}.cryo-cell__top{font-size:.6rem;opacity:.9;margin-top:.1rem;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.empty-state{text-align:center;padding:2.5rem 1rem;background:var(--bg-panel);border:1px dashed var(--border);border-radius:var(--radius)}.empty-state h2{margin:0 0 .5rem;font-size:1.15rem}.empty-state p{color:var(--text-muted);margin:0 0 1rem}.empty-hint{color:var(--text-muted);margin-bottom:1rem}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000bf;display:flex;align-items:flex-end;justify-content:center;z-index:100}.modal{background:var(--bg-panel);border:1px solid var(--border);border-radius:var(--radius) var(--radius) 0 0;width:100%;max-width:520px;max-height:92dvh;overflow-y:auto}.modal__header{padding:1rem 1.25rem;border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--bg-panel)}.modal__header h2{margin:0;font-size:1.1rem}.modal__body{padding:1.25rem}.modal__footer{display:flex;gap:.5rem;padding:1rem 1.25rem;border-top:1px solid var(--border);position:sticky;bottom:0;background:var(--bg-panel)}.modal__footer .btn{flex:1;min-height:var(--touch-min)}.modal-hint{color:var(--text-muted);font-size:.85rem;margin:0 0 1rem}.detail-meta{color:var(--text-muted);font-size:.85rem;margin:0 0 .75rem}.form-group{margin-bottom:1rem}.form-group label{display:block;margin-bottom:.35rem;font-size:.85rem;color:var(--text-muted)}.form-group input,.form-group select,.form-group textarea{width:100%;padding:.65rem .75rem;background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);min-height:var(--touch-min)}.form-group textarea{min-height:120px;resize:vertical}.form-group--full{grid-column:1 / -1}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.form-error{color:var(--danger);font-size:.85rem}.section-title{margin:1rem 0 .5rem;font-size:.9rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}.top-dino-section{margin-top:.5rem;padding-top:.5rem;border-top:1px solid var(--border)}.tame-list{margin:0;padding-left:1.25rem;max-height:160px;overflow-y:auto}.tame-list__more{color:var(--text-muted);font-style:italic}.stats-grid{display:grid;grid-template-columns:auto 1fr;gap:.25rem 1rem;font-size:.9rem}.stats-grid dt{color:var(--text-muted)}.stats-grid dd{margin:0;font-weight:600}.color-picker{display:flex;flex-wrap:wrap;gap:.35rem;align-items:center}.color-swatch{width:32px;height:32px;border:2px solid transparent;border-radius:6px;cursor:pointer}.color-swatch--active{border-color:#fff;box-shadow:0 0 0 2px var(--accent)}.color-input-native{width:40px;height:32px;padding:0;border:none;background:none;cursor:pointer}@media(min-width:640px){.app{padding:1.25rem}.modal-overlay{align-items:center;padding:1rem}.modal{border-radius:var(--radius);max-height:90vh}.modal__footer .btn{flex:none;min-width:100px}.cryo-cell{min-height:72px;font-size:.7rem}}
