:root{--ink:#1d2730;--ink-soft:#5b6874;--bg:#c7d1d8;color:var(--ink);background:var(--bg);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}html,body{height:100%;margin:0;overflow:hidden}#view{width:100%;height:100%;display:block;position:fixed;inset:0}#labels{pointer-events:none;position:fixed;inset:0}.vlabel{text-align:center;width:78px;color:var(--ink-soft);font-size:11px;line-height:1.25;transition:opacity .3s;position:absolute;top:0;left:0}.vlabel .vname{display:block}.vlabel .vg{color:var(--ink);font-variant-numeric:tabular-nums;font-size:13px;font-weight:650;display:block}.vlabel[data-state=zero] .vg,.vlabel[data-state=na] .vg{color:var(--ink-soft);font-weight:450}.vlabel[data-state=empty]{opacity:.55}.sample{pointer-events:none;position:fixed;top:22px;left:28px}.sample .food{margin:0;font-size:26px;font-weight:650}.sample .meta{color:var(--ink-soft);margin:4px 0 0;font-size:13px}.sample .status{color:#2c6f9e;min-height:1.2em;margin:6px 0 0;font-size:13px}body.hovering{cursor:pointer}:root{--a:#1d2730;--b:#2f6fd0}.blocktag{color:var(--ink);white-space:nowrap;background:#ffffffe6;border-radius:999px;padding:3px 10px 3px 8px;font-size:13px;font-weight:650;position:absolute;top:0;left:0;box-shadow:0 2px 8px #14283c14}.blocktag:before{content:"";vertical-align:0;background:var(--a);border-radius:50%;width:9px;height:9px;margin-right:6px;display:inline-block}.blocktag.b{color:var(--b)}.blocktag.b:before{background:var(--b)}.blocktag[hidden],body.narrow .blocktag{display:none}.vlabel.b .vg,.vlabel.b .vname{color:var(--b)}.vlabel[hidden],.vlabel .vg.b:empty{display:none}.vlabel .vg[data-state=zero],.vlabel .vg[data-state=na]{color:var(--ink-soft);font-weight:450}.vlabel .vg.b[data-state=zero],.vlabel .vg.b[data-state=na]{color:#7d9bc8}.sample .dot{vertical-align:middle;background:var(--a);border-radius:50%;width:10px;height:10px;margin:0 6px 3px 0;display:inline-block}.sample .dot.b{background:var(--b)}.sample .vs{color:var(--ink-soft);font-size:18px;font-weight:400}.controls{align-items:flex-start;gap:8px;display:flex;position:fixed;top:20px;right:24px}.controls button,.controls input{font:inherit;height:34px;color:var(--ink);background:#ffffffd9;border:1px solid #b7c3cc;border-radius:8px;padding:0 12px;font-size:13px}.controls button{cursor:pointer}.controls button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:#fff}.controls button:focus-visible,.controls input:focus-visible{outline:2px solid var(--b);outline-offset:2px}.searchbox{position:relative}.controls input{width:210px}#results{background:#fff;border:1px solid #b7c3cc;border-radius:8px;max-height:340px;margin:0;padding:4px 0;list-style:none;position:absolute;top:38px;left:0;right:0;overflow:auto;box-shadow:0 8px 24px #14283c26}#results li{cursor:pointer;padding:6px 10px}#results li:hover{background:#eef3f7}#results .rname{font-size:13px;font-weight:600;display:block}#results .rdesc{color:var(--ink-soft);white-space:nowrap;text-overflow:ellipsis;font-size:11px;display:block;overflow:hidden}body:not(.result) .scalelabel{opacity:0}.scalelabel{pointer-events:none;text-align:center;color:var(--ink);white-space:nowrap;background:#ffffffd1;border-radius:6px;padding:4px 8px;font-size:12px;line-height:1.35;transition:opacity .4s;position:fixed;top:0;left:0}.scalelabel.b{color:var(--b)}.sample .brand{letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin:0 0 2px;font-size:12px;font-weight:650}.credit{color:var(--ink-soft);pointer-events:none;font-size:11px;position:fixed;bottom:12px;left:24px}#skip,#shelf{pointer-events:auto;font:inherit;height:28px;color:var(--ink);cursor:pointer;background:#ffffffd9;border:1px solid #b7c3cc;border-radius:7px;margin-top:6px;padding:0 10px;font-size:12px}#skip[hidden],#shelf[hidden],#legend,body.narrow #labels{display:none}body.narrow #legend{pointer-events:none;background:#ffffffdb;border-radius:10px;grid-template-columns:1fr 1fr 1fr;gap:6px 10px;padding:10px 12px;font-size:11px;line-height:1.25;display:grid;position:fixed;bottom:34px;left:12px;right:12px;box-shadow:0 4px 18px #14283c1a}.lrow{color:var(--ink-soft);grid-template-columns:10px 1fr;align-items:center;column-gap:5px;display:grid}.lrow[data-state=empty]{opacity:.55}.lrow .sw{border-radius:3px;grid-row:span 3;align-self:start;width:10px;height:10px;margin-top:1px;box-shadow:inset 0 0 0 1px #0000001f}.lrow .lname{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.lrow .vg{color:var(--ink);font-variant-numeric:tabular-nums;grid-column:2;font-size:13px;font-weight:650}.lrow .vg.b{color:var(--b)}.lrow .vg:empty{display:none}.lrow .vg[data-state=zero],.lrow .vg[data-state=na]{color:var(--ink-soft);font-weight:450}body.narrow .controls{gap:6px;top:12px;left:12px;right:12px}body.narrow .searchbox{flex:1;min-width:0}body.narrow .controls input{box-sizing:border-box;width:100%}body.narrow .controls button{white-space:nowrap;padding:0 9px}body.narrow .sample{top:58px;left:14px;right:14px}body.narrow .sample .food{font-size:22px}body.narrow .sample .meta{font-size:12px}#inspect{z-index:20;pointer-events:auto;background:#fff;border:1px solid #c3ccd3;border-radius:10px;align-items:center;gap:2px;padding:4px;display:flex;position:fixed;top:0;left:0;box-shadow:0 6px 22px #1d27302e}#inspect[hidden]{display:none}#inspect .analyze{height:34px;font:inherit;white-space:nowrap;background:var(--ink);color:#fff;cursor:pointer;border:0;border-radius:7px;padding:0 16px;font-size:13px;font-weight:600}#inspect .analyze:hover{background:#33424f}#inspect .close{width:30px;height:30px;color:var(--ink-soft);cursor:pointer;background:0 0;border:0;font-size:18px;line-height:1}body.narrow #inspect{top:auto;bottom:20px;left:50%;transform:translate(-50%)!important}body.narrow #inspect .analyze{height:44px;padding:0 28px;font-size:15px}.langswitch{background:#ffffffd9;border:1px solid #b7c3cc;border-radius:8px;height:34px;display:flex;overflow:hidden}.controls .langswitch button{background:0 0;border:0;border-radius:0;height:100%;padding:0 10px}.controls .langswitch button+button{border-left:1px solid #b7c3cc}.controls .langswitch button[aria-pressed=true]{background:var(--ink);color:#fff;cursor:default;font-weight:600}.tools{z-index:15;gap:6px;display:flex;position:fixed;bottom:8px;right:16px}.tools button{font:inherit;height:28px;color:var(--ink);cursor:pointer;background:#ffffffd9;border:1px solid #b7c3cc;border-radius:7px;padding:0 10px;font-size:12px}#toast{background:var(--ink);color:#fff;z-index:30;border-radius:8px;margin:0;padding:8px 14px;font-size:13px;position:fixed;bottom:56px;left:50%;transform:translate(-50%)}#toast[hidden]{display:none}#aboutbox{max-width:min(560px,100vw - 32px);max-height:calc(100vh - 48px);color:var(--ink);background:#fff;border:1px solid #c3ccd3;border-radius:12px;padding:20px 24px 16px;font-size:14px;line-height:1.55;overflow:auto;box-shadow:0 12px 40px #1d273040}#aboutbox::backdrop{background:#1d273059}#aboutbox h2{margin:0 0 8px;font-size:19px}#aboutbox h3{margin:14px 0 4px;font-size:14px}#aboutbox p{margin:0 0 8px}#aboutbox .fine{color:var(--ink-soft);font-size:12px}#aboutbox form{text-align:right;margin-top:8px}#aboutbox form button{font:inherit;background:var(--ink);color:#fff;cursor:pointer;border:0;border-radius:7px;height:32px;padding:0 14px;font-size:13px}html[lang=zh-CN] #aboutbox .lang-en,html:not([lang=zh-CN]) #aboutbox .lang-zh{display:none}body.narrow .credit{text-align:center;font-size:10px;bottom:42px;left:12px;right:12px}body.narrow #legend{bottom:76px}body.narrow .tools{justify-content:center;left:12px;right:12px}body.short .controls button,body.short .controls input,body.short .langswitch{height:28px;font-size:12px}body.short .controls input{width:150px}body.short .sample .food{font-size:20px}body.short .tools button{height:24px;font-size:11px}body.short #labels .vlabel{width:54px;font-size:10px}body.short #labels .vlabel .vname{white-space:normal;line-height:1.1}
