:root{--sky-deep: #14449b;--sky: #2568c8;--cream: #fffbdc;--paper: #fffef2;--ink: #43301a;--muted: #8a7350;--border: #d8c391;--border-strong: #b98a3e;--gold: #f4b41b;--gold-dark: #c8880a;--green: #3f9e44;--red: #d9534f;--blue: #2b6cb0}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--cream);color:var(--ink);font-family:PingFang SC,Microsoft YaHei,system-ui,sans-serif;font-size:14px;line-height:1.65}#app{max-width:1000px;margin:0 auto;padding:14px 16px 30px}h1{font-size:20px;margin:6px 0;letter-spacing:1px}h2{font-size:15px;color:var(--gold-dark);margin:18px 0 8px}a{color:var(--blue)}button{background:var(--paper);color:var(--ink);border:2px solid var(--border-strong);border-radius:10px;padding:6px 14px;font-size:13px;font-weight:600;cursor:pointer;box-shadow:0 2px #0002}button:hover{background:#fff3c4}button:active{transform:translateY(1px);box-shadow:none}button.primary{background:linear-gradient(#ffd757,var(--gold));border-color:var(--gold-dark);color:#4a3000}button.danger{color:var(--red);border-color:#c98a86}input,select{background:#fff;color:var(--ink);border:2px solid var(--border);border-radius:8px;padding:5px 8px;font-size:13px}input:focus,select:focus{outline:none;border-color:var(--gold-dark)}input[type=number]{width:110px}input[type=checkbox]{accent-color:var(--green);width:16px;height:16px}.dropzone{border:3px dashed var(--border-strong);border-radius:16px;background:var(--paper);padding:64px 20px;text-align:center;color:var(--muted);margin-top:32px;cursor:pointer}.dropzone.hover{border-color:var(--gold-dark);background:#fff3c4}.dropzone .big{font-size:17px;color:var(--ink);font-weight:700;margin-bottom:8px}.topbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;background:radial-gradient(1px 1px at 12% 30%,#fff9 50%,transparent 51%),radial-gradient(1px 1px at 38% 70%,#fff7 50%,transparent 51%),radial-gradient(1.5px 1.5px at 63% 25%,#fff8 50%,transparent 51%),radial-gradient(1px 1px at 85% 55%,#fff6 50%,transparent 51%),linear-gradient(180deg,var(--sky-deep),var(--sky));border:3px solid #0d2f6e;border-radius:14px;padding:12px 16px;margin-bottom:12px;color:#fff;box-shadow:0 3px #0003}.topbar h1{color:var(--gold);text-shadow:1px 2px 0 #00000055}.topbar .meta{color:#cfe0ff;font-size:12px}.spacer{flex:1}.topbar select{border-color:#0d2f6e}.badge{font-size:12px;font-weight:700;padding:3px 12px;border-radius:12px;border:2px solid transparent;background:#fff2;color:#fff}.badge.ok{background:var(--green);border-color:#2c7031}.badge.fail{background:var(--red);border-color:#a13733}.badge.pending{background:#fff2;color:#cfe0ff}.tabs{display:flex;gap:8px;margin-bottom:12px;flex-wrap:wrap}.tabs button{border-radius:12px;padding:7px 16px}.tabs button.active{background:linear-gradient(#ffd757,var(--gold));border-color:var(--gold-dark);color:#4a3000}.panel{background:var(--paper);border:3px solid var(--border);border-radius:14px;padding:16px 18px;box-shadow:0 3px #0000000f}.grid2{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}.field label{display:block;color:var(--muted);font-size:12px;margin-bottom:3px;font-weight:600}.hint{color:var(--muted);font-size:12px}.warn{background:#fff3c4;border:2px solid var(--gold-dark);border-radius:10px;padding:8px 12px;font-size:12px;color:#7a5b12;margin-bottom:12px}.inv-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:6px}@media(max-width:720px){.inv-grid{grid-template-columns:repeat(6,1fr)}}.slot{position:relative;aspect-ratio:1;background:#fdf6d8;border:2px solid var(--border);border-radius:10px;display:flex;align-items:center;justify-content:center;cursor:pointer;overflow:hidden;box-shadow:inset 0 2px #00000010}.slot:hover{border-color:var(--gold-dark)}.slot.selected{border-color:var(--gold-dark);box-shadow:0 0 0 2px var(--gold)}.slot .fallback{font-size:11px;color:var(--muted);text-align:center;padding:2px;overflow:hidden}.slot .stack{position:absolute;right:3px;bottom:1px;font-size:11px;font-weight:800;color:#fff;text-shadow:0 1px 0 #000,1px 0 0 #000,-1px 0 0 #000,0 -1px 0 #000}.slot .q{position:absolute;left:4px;bottom:4px;width:9px;height:9px;border-radius:50%;border:1px solid #0006}.q1{background:silver}.q2{background:gold}.q4{background:#b455f2}.sprite{image-rendering:pixelated;background-repeat:no-repeat}.slot .plus{color:var(--border-strong);font-size:20px}.slot:hover .plus{color:var(--gold-dark)}.itemedit{margin-top:14px;padding:12px 14px;background:var(--cream);border:2px solid var(--border);border-radius:10px;display:flex;gap:16px;flex-wrap:wrap;align-items:flex-end}.toolsec{display:flex;gap:16px;flex-wrap:wrap;align-items:flex-end}.ench-chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:6px}.ench-chip{display:inline-flex;align-items:center;gap:4px;background:#eaf3ff;border:1.5px solid #9cbef0;color:#1e4e8f;border-radius:10px;padding:2px 6px 2px 10px;font-size:12px;font-weight:600}.ench-del{border:none;background:transparent;box-shadow:none;padding:0 4px;color:#1e4e8f;font-size:14px;cursor:pointer}.ench-del:hover{color:var(--red);background:transparent}.friend-row{display:flex;align-items:center;gap:12px;padding:8px 4px;border-bottom:1px solid #e7dcb8}.portrait{width:40px;height:40px;overflow:hidden;border-radius:8px;flex-shrink:0;border:2px solid var(--border);background:#fff}.portrait img{width:80px;height:auto;display:block;image-rendering:pixelated}.friend-row .nm{width:130px}.hearts{color:#e0524e;letter-spacing:1px;font-size:12px;width:190px}.hearts .off{color:#dccfa8}.status{font-size:12px;color:var(--muted);width:70px}.skill-row{display:flex;gap:14px;align-items:center;padding:8px 0;flex-wrap:wrap}.skill-row .nm{width:60px}.recipe-row{display:flex;align-items:center;gap:10px;padding:4px 8px;border-radius:8px;cursor:pointer;overflow:hidden;white-space:nowrap;border:1.5px solid transparent}.recipe-row:hover{background:#fff3c4;border-color:var(--border)}.recipe-row .sprite,.recipe-row .fallback{flex-shrink:0}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#1a123599;z-index:50;display:flex;align-items:center;justify-content:center}.modal{background:var(--paper);border:3px solid var(--border-strong);border-radius:14px;width:min(560px,92vw);max-height:80vh;display:flex;flex-direction:column;padding:14px;box-shadow:0 8px 24px #0006}.modal .results{overflow-y:auto;margin-top:10px}.pick-row{display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:8px;cursor:pointer}.pick-row:hover{background:#fff3c4}.pick-row .price{margin-left:auto;color:var(--gold-dark);font-size:12px;font-weight:700}.toast{position:fixed;bottom:20px;left:50%;transform:translate(-50%);background:var(--sky-deep);border:2px solid #0d2f6e;color:#fff;border-radius:10px;padding:8px 18px;z-index:99;font-size:13px;box-shadow:0 4px 12px #0005}pre.diff{background:#fff;padding:10px;border-radius:8px;overflow-x:auto;font-size:11px;color:var(--muted);white-space:pre-wrap;word-break:break-all;border:1px solid var(--border)}.footer{color:var(--muted);font-size:11px;margin-top:26px;text-align:center}