*{box-sizing:border-box}body{margin:0;background:#eee9df;color:#333b50;font:16px/1.55 system-ui}main{max-width:1120px;margin:auto;padding:30px 20px}h1,h2{font-family:Georgia,serif;line-height:1.1}h1{font-size:clamp(46px,7vw,80px);margin:14px 0}h2{font-size:26px}.eyebrow{font-size:12px;letter-spacing:.16em;color:#70644e}section{background:#fffdf7;border:1px solid #dbd6c9;border-radius:20px;padding:24px;margin:22px 0}.rules{display:grid;grid-template-columns:1fr 1fr;gap:18px}.rules p{background:#ece9df;padding:15px;border-radius:12px}.controls{display:flex;gap:12px;flex-wrap:wrap;align-items:end}label{display:grid;gap:6px}button,select{font:inherit;padding:12px;border:1px solid #a5a99c;border-radius:9px;background:#fffdf7;color:#333b50;cursor:pointer}button:hover,button:focus-visible{background:#eee6c9;outline:2px solid #8f6d39}button:disabled{opacity:.55;cursor:default}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.stat{padding:16px;background:#dfdfd1;border-radius:12px}.stat strong{display:block;font:700 25px Georgia}.stat small{font-size:11px}#feedback{padding:15px;border-left:4px solid #a9773c;background:#e7e0cc}#graph{overflow-x:auto}svg{width:100%;display:block}.nodes{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.node{display:flex;align-items:center;gap:12px;text-align:left}.node.observed{background:#f1dca9;border:2px solid #a86e27}.art{width:65px;height:65px;flex-shrink:0;background-image:url('lanterns.webp');background-size:200% 200%;border-radius:10px}.node strong{font-size:23px}.node small{display:block}.note,footer{font-size:13px;color:#616455}footer{padding:24px 0}summary{cursor:pointer;padding:14px 0}.connection{padding:12px;margin:10px 0;background:#ece9df;border-radius:8px}.good{color:#286344}.bad{color:#a4432d}#certify{background:#414b60;color:white}#result{background:#e4ebd8}@media(max-width:650px){main{padding:20px 12px}section{padding:17px}.rules{grid-template-columns:1fr;gap:0}.nodes{grid-template-columns:1fr 1fr}.node{display:block}.node .art{margin-bottom:6px}.stats{grid-template-columns:1fr}.stat{display:flex;justify-content:space-between;align-items:center;gap:14px}#graph svg{min-width:570px}.note::after{content:" Swipe the graph sideways to inspect all arrowheads."}}

.art{display:block}