.materials-tabs{display:flex;gap:7px;overflow-x:auto;padding:4px 0 12px}.material-tab{flex:0 0 auto;display:grid;gap:4px;background:#13283a;color:#b9cddd;border:1px solid #294358;border-radius:12px;padding:10px 13px;min-height:54px}.material-tab b{font-size:15px}.material-tab small{font-size:10px;color:#8da9bb}.material-tab.active{border-color:#48d1ce;background:#143a43;color:#72e5dd}.material-title,.material-comment-head{display:flex;justify-content:space-between;align-items:center;gap:8px}.material-controls{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:12px 0}.material-controls label{font-size:13px;color:#a1b6c7}.material-controls select{display:inline-block;width:auto;margin-left:7px;padding:8px;background:#13283a;color:#dce8f5;border:1px solid #375164;border-radius:8px}.material-image{display:block;width:100%;padding:0;border:0;background:#102131;margin:12px 0;border-radius:12px;overflow:hidden}.material-image img{display:block;width:100%;height:auto}.material-text,.material-comment p{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.65;font-size:16px}.material-comment{padding:14px 0;border-top:1px solid #263b4d}.material-comment-head b{font-size:16px}.material-comment-head span{color:#e8bb65;font-size:13px}.material-comment time{display:block;color:#93a9bd;font-size:11px;margin:5px 0}.material-comment details{padding:8px 0}.material-reply{margin-left:14px;border-left:2px solid #335065;padding-left:10px}.material-zoom{display:block;width:100%;height:auto;max-width:100%}.materials-reader .toolbar{gap:5px;margin:0}.materials-reader .active{color:#6ae1d7}#nav{overflow-x:auto}#nav button{flex:0 0 auto;min-width:58px}#nav button[data-tab=materials]{order:0}
#nav{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:0;overflow:visible;min-height:62px;padding:4px 2px calc(4px + env(safe-area-inset-bottom));border-radius:16px}#nav button{min-width:0;width:100%;min-height:52px;padding:25px 0 4px;font-size:clamp(10px,2.9vw,12px);letter-spacing:0;line-height:1.2;border-radius:10px;text-overflow:clip}#nav button::before{top:3px;width:20px;height:20px;font-size:14px}#nav button[data-tab=overview]::before{content:"⌂"}#nav button[data-tab=materials]::before{content:"▧"}#nav button[data-tab=rankings]::before{content:"↗"}#nav button[data-tab=bigdata]::before{content:"◫"}#nav button[data-tab=kill]::before{content:"×"}#nav button[data-tab=information]::before{content:"≡"}#nav button[data-tab=heroes]::before{content:"♜"}#nav button[data-tab=probability]::before{content:"◎"}
