@import "https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@400;500;600;700&display=swap";:root{color:#eeeef5;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--muted:#a5a9bd;--line:#45485c;--green:#a6d4b1;background:#282b3b;font-family:Noto Sans Thai,system-ui,sans-serif;font-size:12px}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit;color:inherit;border:1px solid var(--line);background:#323648;border-radius:5px;min-width:0}button{cursor:pointer;padding:5px 8px}button:hover{background:#41465e}button:disabled,input:disabled,select:disabled{opacity:.5;cursor:default}input,select{padding:5px}input[type=checkbox]{accent-color:#b5a3eb;flex-shrink:0;width:13px;height:13px;margin:0}button:focus-visible,input:focus-visible,select:focus-visible{outline-offset:1px;outline:2px solid #baa8f2}h2,p{margin:0}.icon{vertical-align:middle;fill:currentColor;width:16px;height:16px}.stat-app{width:100%;min-width:0}.app-header{border-bottom:1px solid var(--line);align-items:center;gap:8px;height:44px;padding:8px 12px;display:flex}.app-header>img{width:23px;image-rendering:pixelated}.app-header>strong{font-size:13px}.app-header>span{color:var(--muted);margin-left:auto;font-size:10px}.app-header>button{background:0 0;border:0;padding:4px}.table-tools{gap:7px;padding:10px 10px 6px;display:flex}.table-tools>input{flex:1;width:100px}.table-tools>button{white-space:nowrap;font-size:11px}.active{background:#514969;border-color:#ad9ad7}.stats-table{padding:0 10px}.stats-row{border-bottom:1px solid #3d4153;grid-template-columns:minmax(82px,1fr) 34px 48px 5px 48px 46px 42px;align-items:center;gap:4px;min-height:46px;display:grid}.table-head{color:#b9bdce;z-index:1;background:#282b3b;min-height:32px;font-size:10px;position:sticky;top:0}.table-head>span:first-child{align-items:center;gap:6px;display:flex}.table-body{scrollbar-width:thin;scrollbar-color:#666b83 transparent;max-height:min(440px,100dvh - 240px);overflow:auto}.token-cell{gap:5px;min-width:0;display:flex}.token-name{text-align:left;background:0 0;border:0;flex:1;align-items:center;gap:5px;min-width:0;padding:0;display:flex}.token-name>span:last-child{text-overflow:ellipsis;white-space:nowrap;font-size:10px;overflow:hidden}.token-picture{color:#ccd2e5;background:#454b61;border-radius:50%;flex-shrink:0;place-items:center;width:24px;height:24px;display:grid;overflow:hidden}.token-picture img{object-fit:cover;width:100%;height:100%}.stats-row.selected{background:#45405b}.visibility{width:100%;height:30px;padding:4px 2px;font-size:10px}.stats-row>.visibility{color:#0000;text-shadow:0 0 #ded9f0;appearance:none;text-align:center;width:34px;overflow:hidden}.stats-row>.visibility option{color:#eee}.stat-input{min-width:0;display:block}.stat-input>span{color:#b9bdce;align-items:center;gap:3px;margin-bottom:4px;font-size:9px;display:flex}.stat-input input{text-align:center;width:100%;min-width:0;height:31px;padding:4px 1px;font:13px ui-monospace,monospace}.stats-row .stat-input>span{display:none}.stat-input.hp input{background:#523642;border-color:#74505e}.stat-input.maxHp input{background:#433440}.stat-input.tempHp input{background:#344b42;border-color:#4a6759}.stat-input.ac input{background:#354860;border-color:#4f6682}.stat-input.tempHp>span,.temp-label{color:#9cdbb0}.stat-input.ac>span,.ac-label{color:#b1c7ef}.stat-input small{color:#ffb3b3;overflow-wrap:anywhere;font-size:9px;display:block}.slash{color:#a5a9bd;text-align:center}.hidden-stats{color:#adbda9;grid-column:3/-1;font-size:10px}.batch-bar{border-top:1px solid var(--line);padding:9px 10px 7px}.batch-label{color:var(--muted);margin-bottom:5px;font-size:10px}.batch-controls{gap:5px;display:flex}.batch-controls>input{text-align:center;width:45px}.batch-controls>button{white-space:nowrap;flex:1;padding:6px 2px;font-size:11px}.damage{background:#523642}.heal,.temp{background:#344b42}.hint{color:#a5a9bd;margin-top:7px;font-size:9px}.status-line{color:#9ca3ba;border-top:1px solid var(--line);justify-content:space-between;padding:6px 10px;font-size:9px;display:flex}.compact-editor{padding:8px 8px 0}.name-line{align-items:center;gap:7px;display:flex}.name-line input{flex:1;width:0;height:29px}.compact-editor>.pixelbar{object-fit:contain;width:100%;height:62px;image-rendering:pixelated;margin:4px 0;display:block}.compact-fields{grid-template-columns:1fr 6px 1fr 1fr 1fr;align-items:end;gap:4px;display:grid}.compact-fields .slash{padding-bottom:7px}.compact-fields .stat-input>span .icon{width:11px;height:11px}.access-line{align-items:center;gap:8px;margin:9px 0;font-size:10px;display:flex}.access-line>.visibility{flex:1;width:0}.context-app .batch-bar{padding:7px 8px}.context-app .batch-controls{gap:4px}.context-app .batch-controls>input{width:32px;padding:4px 1px}.context-app .batch-controls>button{padding:5px 1px;font-size:9px}.context-app .status-line{padding:4px 8px;font-size:8px}.context-app .batch-label{font-size:9px}.context-app .empty{padding:16px 8px}html.context{scrollbar-width:none}html.context::-webkit-scrollbar{display:none}html.context body{overflow-x:hidden}.empty{text-align:center;color:var(--muted);padding:24px 10px}.error{overflow-wrap:anywhere;background:#613943;gap:5px;padding:7px;font-size:10px;display:flex}.error>button{margin-left:auto}.settings{padding:12px}.settings h2{font-size:14px}.muted{color:var(--muted);font-size:10px}.segmented{gap:5px;margin:10px 0;display:flex}.setting{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:7px;padding:9px 0;font-size:11px;display:flex}.setting input[type=number]{width:65px}.setting input[type=range]{width:100px}.setting select{max-width:145px}.setting>span{margin-left:auto}.wide{width:100%;margin-top:12px}.note{color:var(--muted);margin-top:12px;font-size:10px}.demo-preview{border-top:1px solid var(--line);padding:12px}.demo-controls{justify-content:space-between;margin-bottom:12px;display:flex}.demo-preview>div:not(.demo-controls){margin:12px 0}.demo-preview small{color:var(--muted)}.pixelbar{width:100%;image-rendering:pixelated;display:block}.table-app{max-width:520px;margin:auto}@media (width<=370px){.stats-row{grid-template-columns:minmax(55px,1fr) 26px 36px 4px 36px 36px 34px;gap:3px}.token-name>span:last-child{display:none}.stats-row>.visibility{width:26px}.stats-table{padding:0 6px}.stat-input input{font-size:11px}}