:root{color:#0f172a;image-rendering:pixelated;background:#a89078;font-family:PingFang SC,Noto Sans SC,Microsoft YaHei,system-ui,sans-serif;line-height:1.4}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}#office-canvas{width:100%;height:100%;image-rendering:pixelated;display:block}#hud{pointer-events:none;z-index:5;position:fixed;inset:0}.hud-panel{pointer-events:auto;color:#f8fafc;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#0f172ad1;border:1px solid #94a3b859;border-radius:14px;padding:14px 16px;position:absolute;box-shadow:0 8px 24px #00000040}.hud-panel h2{letter-spacing:.04em;text-transform:uppercase;color:#cbd5e1;margin:0 0 8px;font-size:14px;font-weight:700}.hud-left{width:220px;top:16px;left:16px}.hud-right{width:220px;top:16px;right:16px}.hud-bottom{flex-wrap:wrap;align-items:center;gap:8px;padding:10px 12px;display:flex;bottom:16px;left:16px;right:16px}.usage{margin:0;font-size:18px;font-weight:700}.hint{color:#94a3b8;margin:8px 0 0;font-size:12px}.legend{gap:6px;margin:0;padding:0;list-style:none;display:grid}.legend li{align-items:center;gap:8px;font-size:13px;display:flex}.dot{border-radius:50%;width:10px;height:10px;display:inline-block}#btn-simulate{cursor:pointer;color:#0f172a;background:linear-gradient(135deg,#38bdf8,#818cf8);border:none;border-radius:10px;width:100%;margin-top:12px;padding:10px 12px;font-size:14px;font-weight:700}#btn-simulate:hover{filter:brightness(1.05)}.chip{background:#1e293be6;border:1px solid #94a3b840;border-radius:999px;align-items:center;gap:6px;padding:4px 10px;font-size:12px;display:inline-flex}.chip i{border-radius:50%;width:8px;height:8px;display:inline-block}#password-gate{z-index:20;background:radial-gradient(circle at 20% 20%,#6366f159,#0000 40%),radial-gradient(circle at 80% 10%,#0ea5e94d,#0000 35%),#0f172a;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.pw-card{color:#f8fafc;background:#0f172aeb;border:1px solid #94a3b859;border-radius:18px;width:min(380px,92vw);padding:28px 24px;box-shadow:0 20px 50px #00000073}.pw-card h1{margin:0 0 8px;font-size:22px}.pw-sub{color:#94a3b8;margin:0 0 18px;font-size:13px}#pw-form{gap:8px;display:flex}#pw-input{color:#f8fafc;background:#1e293b;border:1px solid #334155;border-radius:10px;flex:1;padding:10px 12px;font-size:14px}#pw-form button{cursor:pointer;color:#0f172a;background:#818cf8;border:none;border-radius:10px;padding:10px 16px;font-weight:700}.pw-error{color:#fca5a5;margin:10px 0 0;font-size:13px}