html,body{height:100%;margin:0;padding:0}:root{--bg:#0b0b0c;--panel:#141417;--accent:#38ff6f;--text:#e8f3ea;--muted:#9bb49f;--danger:#ff4d4d;--btn:#1b1b20}*,:before,:after{box-sizing:border-box}html,body{background:radial-gradient(1200px 600px at 30% 20%, #0f1113 0%, var(--bg) 55%, #050506 100%) fixed;height:100%;color:var(--text);margin:0;padding:0;font:14px/1.3 system-ui,Segoe UI,Roboto,Helvetica,Arial}#root{height:100%}.app{grid-template-rows:auto 1fr;grid-template-columns:280px 1fr;gap:10px;height:100vh;padding:10px 10px 52px;display:grid}.logo{grid-column:1/3;align-items:center;gap:10px;display:flex}.logo .dot{background:var(--accent);flex-shrink:0;width:10px;height:10px}.panel{background:linear-gradient(180deg, var(--panel), #0f1013);border:1px solid #1f2227;border-radius:14px;padding:8px;box-shadow:0 10px 30px #00000059,inset 0 1px #ffffff08}.toolbar{overflow-y:hidden}.toolbar label{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;margin:5px 0 3px;font-size:11px;display:block}.row{flex-wrap:wrap;gap:8px;display:flex}.flex{align-items:center;gap:8px;display:flex}.right{margin-left:auto}.btn{background:var(--btn);color:var(--text);cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap;border:1px solid #272a32;border-radius:6px;padding:5px 8px;font-size:12px;transition:border-color .15s}.btn:hover{border-color:#3a3f4a}.btn.primary{border-color:var(--accent);box-shadow:inset 0 0 12px #38ff6f40}.btn.danger{border-color:var(--danger);color:#ffdcdc}.tools{grid-template-columns:repeat(6,1fr);gap:6px;display:grid}.tools .btn{text-align:center;padding:6px 4px;font-size:11px}.canvasWrap{background:repeating-linear-gradient(45deg,#121418,#121418 12px,#151820 12px 24px);border:1px solid #1f2227;border-radius:14px;padding:0;position:relative;overflow:hidden}.canvasWrap.scrollable{scrollbar-width:thin;scrollbar-color:var(--accent) #1a1a1f;overflow:auto hidden}.canvasWrap.scrollable::-webkit-scrollbar{height:8px}.canvasWrap.scrollable::-webkit-scrollbar-track{background:#1a1a1f}.canvasWrap.scrollable::-webkit-scrollbar-thumb{background:var(--accent);border-radius:4px}canvas{width:100%;height:100%;image-rendering:crisp-edges;cursor:crosshair;display:block}.canvasWrap.scrollable canvas{width:auto;height:100%;min-height:100%}.trainRow{grid-template-columns:repeat(3,1fr);gap:4px;margin-bottom:4px;display:grid}.trainBtn{text-align:center;letter-spacing:.04em;color:#d4b8ff;border-color:#8b5cf6;width:100%;font-size:13px}.trainBtn:hover{border-color:#a78bfa}.trainBtn.primary{color:#e9d5ff;border-color:#a78bfa;box-shadow:inset 0 0 14px #a78bfa4d}.status{color:var(--muted);margin-top:4px;font-size:11px}.small{color:var(--muted);font-size:11px}.sep{background:#1e2229;height:1px;margin:5px 0}.palette{background:#0e1013;border:1px solid #262a31;border-radius:6px;padding:4px}.paletteGrid{grid-template-columns:repeat(5,1fr);gap:3px;display:grid}.swatch{cursor:pointer;border:1px solid #20232a;border-radius:0;width:100%;height:17px;padding:0;position:relative}.swatch .tag{color:#e8eef1;text-align:center;opacity:0;pointer-events:none;white-space:nowrap;text-overflow:ellipsis;background:#000000a6;padding:1px 3px;font-size:9px;line-height:1.1;transition:opacity .12s;position:absolute;bottom:0;left:0;right:0;overflow:hidden}.swatch:hover .tag,.swatch.selected .tag{opacity:1}.swatch.selected{outline:2px solid var(--accent);outline-offset:-2px}.capGrid{grid-template-columns:repeat(5,1fr);gap:5px;display:grid}.capBtn{flex-direction:column;justify-content:space-between;align-items:center;gap:2px;min-height:50px;padding:4px 2px 3px;display:flex}.capIcon{object-fit:contain;object-position:center;opacity:.6;width:100%;height:28px;image-rendering:crisp-edges;flex-shrink:0;transition:opacity .15s,transform .15s;display:block}.capBtn.primary .capIcon{opacity:1;transform:scale(1.06)}.capBtn.primary{border-color:var(--accent);box-shadow:inset 0 0 10px #38ff6f33}.capLabel{letter-spacing:.04em;color:var(--muted);text-transform:uppercase;text-align:center;white-space:nowrap;font-size:9px;line-height:1}.capBtn.primary .capLabel{color:var(--accent)}.chiselWrapper{position:relative}.chiselAngleMenu{z-index:200;background:#18181d;border:1px solid #2a2a35;border-radius:8px;flex-direction:column;gap:3px;min-width:54px;padding:6px;display:flex;position:absolute;bottom:calc(100% + 2px);left:50%;transform:translate(-50%);box-shadow:0 6px 24px #0009}.chiselAngleTitle{color:var(--muted);text-align:center;letter-spacing:.08em;text-transform:uppercase;margin-bottom:2px;font-size:9px}.chiselAngleBtn{text-align:center;width:100%;padding:4px 6px;font-size:11px}.chiselAngleStepper{align-items:center;gap:4px;margin-bottom:4px;display:flex}.chiselStepBtn{flex:none;padding:2px 8px;font-size:14px;line-height:1}.chiselAngleCurrent{text-align:center;color:var(--accent);flex:1;font-size:12px;font-weight:600}.pressureRow{grid-template-columns:1fr 1fr;gap:6px;display:grid}.pressureBtn{justify-content:center;align-items:center;gap:4px;padding:5px 6px;font-size:11px;display:flex}.pressureIcon{font-size:10px;line-height:1}.pressureBtnHigh{color:#ffd5d5;border-color:#ff4d4d;box-shadow:inset 0 0 10px #ff4d4d38}.slider{width:100%;accent-color:var(--accent)}.titleInput{color:#e8f3ea;background:#0e1013;border:1px solid #262a31;border-radius:8px;width:100%;margin-bottom:4px;padding:5px 8px;font-size:12px}.titleInput:focus{outline:1px solid var(--accent)}.gallery{z-index:20;background:#000000a6;justify-content:center;align-items:center;padding:20px;display:none;position:fixed;inset:0}.gallery .card{background:var(--panel);border:1px solid #242830;border-radius:16px;width:min(1100px,92vw);max-height:90vh;padding:14px;overflow:auto}.grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin-top:10px;display:grid}.thumb{background:#0f1216;border:1px solid #242830;border-radius:12px;padding:8px}.thumb img{border-radius:8px;width:100%;height:auto;display:block}.thumb .meta{color:var(--muted);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:6px;margin-top:6px;font-size:12px;display:flex}.posseLogo{z-index:5;display:inline-block;position:fixed;bottom:56px;right:12px}.posseLogo img{width:72px;height:auto;image-rendering:crisp-edges;filter:drop-shadow(0 2px 4px #00000080);transition:transform .12s;display:block}.posseLogo:hover img{transform:translateY(-1px)}.onlineBar{z-index:6;background:linear-gradient(#0f1013,#0b0b0c);border-top:1px solid #1f2227;padding:8px 12px;position:fixed;bottom:0;left:0;right:0}.onlineInner{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.onlineTitle{letter-spacing:.06em;color:var(--muted);font-weight:700}.onlineNames{flex-wrap:wrap;gap:8px;display:flex}.badge{background:#111317;border:1px solid #262a31;border-radius:999px;padding:2px 8px;font-size:12px}.splash{z-index:30;background:#00000080;justify-content:center;align-items:center;padding:16px;display:none;position:fixed;inset:0}.splashCard{background:var(--panel);border:1px solid #262a31;border-radius:16px;flex-direction:column;gap:10px;width:min(420px,92vw);max-height:85vh;padding:16px;display:flex;overflow:auto;box-shadow:0 18px 48px #00000073}.splashCard h2{margin:0;font-size:18px}.splashCard p{color:var(--muted);margin:0}.input{color:#e8f3ea;background:#0e1013;border:1px solid #262a31;border-radius:10px;width:100%;padding:10px 12px;font-size:13px}.input:focus{outline:1px solid var(--accent)}.splashRow{gap:8px;margin-top:6px;display:flex}.splashRow .btn{flex:1}.err{color:#ff9e9e;min-height:16px;font-size:12px}.shareToolbarBtn{color:#a0d4ff;border-color:#2a9fff}.shareToolbarBtn:hover{border-color:#5bb8ff}.shareGalleryBtn{color:#a0d4ff;border-color:#2a9fff}.shareGalleryBtn:hover{border-color:#5bb8ff}.shareOverlay{z-index:40;background:#0009;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.shareCard{background:var(--panel);border:1px solid #262a31;border-radius:18px;flex-direction:column;gap:14px;width:min(480px,94vw);max-height:90vh;padding:18px;display:flex;overflow-y:auto;box-shadow:0 24px 60px #0000008c}.shareHeader{justify-content:space-between;align-items:center;font-size:15px;display:flex}.sharePreviewWrap{background:repeating-linear-gradient(45deg,#121418,#121418 10px,#151820 10px 20px);border-radius:10px;justify-content:center;align-items:center;min-height:80px;display:flex;overflow:hidden}.sharePreview{border-radius:8px;max-width:100%;max-height:280px;display:block}.sharePreviewPlaceholder{color:var(--muted);padding:24px;font-size:13px}.shareBtnGrid{grid-template-columns:1fr 1fr;gap:8px;display:grid}.shareBtn{justify-content:center;align-items:center;gap:7px;padding:10px 12px;font-size:13px;display:flex}.shareBtnIcon{flex-shrink:0;font-size:15px;line-height:1}.shareBtnIconX{font-family:serif;font-size:14px;font-weight:900}.shareBtnX{color:#ddd;border-color:#555}.shareBtnX:hover{border-color:#888}.shareBtnFb{color:#8ab4f8;border-color:#1877f2}.shareBtnFb:hover{border-color:#4090f5}.shareBtnIg{background:linear-gradient(var(--btn), var(--btn)) padding-box, linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888) border-box;color:#f5c0d8;border:1px solid #0000}.shareBtnIg:hover{background:linear-gradient(#222228,#222228) padding-box padding-box,linear-gradient(45deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888) border-box}.igSvg{flex-shrink:0;width:18px;height:18px}.igHint{color:#f9d0e4;background:linear-gradient(90deg,#bc188826,#f094331f);border:1px solid #dc274359;border-radius:10px;align-items:center;gap:8px;padding:10px 12px;font-size:13px;line-height:1.4;display:flex}.igHintIcon{flex-shrink:0;font-size:16px}.igHintClose{color:#f9d0e4;cursor:pointer;opacity:.7;background:0 0;border:none;flex-shrink:0;margin-left:auto;padding:0 2px;font-size:14px}.igHintClose:hover{opacity:1}.shareLinkRow{align-items:center;gap:8px;display:flex}.shareLinkInput{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;cursor:text;background:#0d1015;border:1px solid #262a31;border-radius:8px;flex:1;padding:7px 10px;font-size:12px;overflow:hidden}.shareLinkInput:focus{outline:1px solid var(--accent)}@media (width<=640px){.app{grid-template-rows:auto auto 1fr;grid-template-columns:1fr;padding-bottom:60px}.logo{grid-column:1/2}.canvasWrap{min-height:300px}.posseLogo img{width:56px}}