*{box-sizing:border-box}html,body,#app{margin:0;width:100%;height:100%;overflow:hidden;background:#d4e4e3}body{font-family:Arial,Helvetica,sans-serif;color:#344b42}canvas{width:100%;height:100%;display:block;outline:none;touch-action:none;user-select:none;-webkit-user-select:none}.brand{position:absolute;left:32px;top:28px;display:flex;align-items:center;gap:12px;font-size:11px;font-weight:700;letter-spacing:2.5px;line-height:1.5;pointer-events:none}.brand small{font-size:7px;letter-spacing:1.5px;opacity:.65}.mark{font:italic 42px Georgia,serif;letter-spacing:-4px;margin-right:6px}.tools{position:absolute;bottom:25px;left:50%;transform:translate(-50%);display:flex;gap:5px;padding:5px;border:1px solid #ffffff66;border-radius:30px;background:#f5f1e5cc;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 3px 22px #233b3010}button{background:transparent;border:0;border-radius:24px;color:#344b42;padding:10px 17px;font-size:12px;cursor:pointer;white-space:nowrap}button:hover{background:#fff9}button:focus-visible{outline:2px solid #476950;outline-offset:2px}#result{position:absolute;left:50%;top:22px;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;pointer-events:none;font-weight:800;opacity:0;transition:opacity .25s;padding:15px 30px 13px;border-radius:14px;background:#f7f2e4e8;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 8px 30px #1b231a33;max-width:calc(100% - 40px)}#result .tally{display:flex;gap:clamp(26px,5vw,58px);font-size:clamp(30px,4.2vw,52px)}#result.visible{opacity:1}#error{position:absolute;inset:30%;padding:30px;background:#fff7e8;border-radius:12px;line-height:1.5}body.record .brand,body.record .tools{display:none}@media(max-width:600px){.brand{left:18px;top:18px}.tools{bottom:20px}#result{top:14px;padding:11px 18px}}#app{display:flex;align-items:center;justify-content:center;background:#262b27}canvas{flex:none}.brand{display:none}.tools{bottom:18px}body.record #result{display:none}.study-link{padding:10px 14px;font-size:12px;text-decoration:none;color:inherit;white-space:nowrap;border-radius:24px}.study-link:hover{background:#fff9}@media(max-width:600px){button,.study-link{padding:10px}.tools{gap:0}}@media(max-width:600px){.tools{max-width:calc(100% - 20px);flex-wrap:wrap;justify-content:center;border-radius:18px;width:max-content}.tools button,.study-link{font-size:11px;padding:8px 10px}}.inspector{position:absolute;right:0;top:0;bottom:0;width:300px;padding:28px 24px;background:#f4f0e8;color:#3d4439;overflow:auto;border-left:1px solid #aca88e44}.inspector h1{font:29px Georgia,serif;margin:22px 0 8px}.inspector p{font-size:12px;line-height:1.5;color:#74796c}.inspector a{font-size:11px;text-decoration:none;color:#59694e}.field{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:12px;margin:18px 0}.field select{font:12px Arial;padding:7px 8px;border:1px solid #cfcfbd;border-radius:5px;background:#fffdf5;color:inherit;max-width:156px}.field input[type=color]{width:44px;height:28px;border:0;padding:0;background:transparent}.slider-field{display:block;margin:14px 0}.slider-field span{display:flex;justify-content:space-between;margin-bottom:6px}.slider-field output{color:#878b7e;font-variant-numeric:tabular-nums}input[type=range]{width:100%;accent-color:#747f58}.inspector-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:22px}.inspector-actions button,.import-look{border:1px solid #c8cbb9;border-radius:5px;padding:10px 8px;text-align:center;font-size:11px;cursor:pointer}.inspector-actions button:first-child{background:#596e49;color:#fff}.studio:not(.record) #app{padding-right:300px}.studio .tools{left:calc((100% - 300px)/2)}.record .inspector,.studio .brand{display:none}@media(max-width:700px){.inspector{top:auto;width:100%;height:300px;bottom:0;padding:16px 22px;border-left:0;border-top:1px solid #aca88e44}.inspector header p{display:none}.inspector h1{margin:10px 0}.studio:not(.record) #app{padding-right:0;padding-bottom:300px}.studio .tools{left:50%;bottom:310px}.field{margin:12px 0}#look-sliders{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}}#result span{display:flex;flex-direction:column;align-items:center;line-height:1}#result small{font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;margin-top:9px;opacity:.85}#result .footnote{margin:12px 0 0;max-width:46ch;font-size:11.5px;font-weight:400;line-height:1.45;color:#5a6155;text-align:center}.vote-card{position:absolute;left:20px;top:18px;width:min(360px,40vw);padding:18px 20px;border-radius:14px;background:#f6f1e3;box-shadow:0 8px 30px #1b231a33;color:#333d33}.vote-card .back{display:inline-block;font-size:10px;letter-spacing:1.3px;text-transform:uppercase;text-decoration:none;color:#4a5c4a;opacity:.8}.vote-card .back:hover{opacity:1}.vote-card .meta{display:flex;gap:10px;margin:9px 0 5px;font-size:10px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;opacity:.65}.vote-card h1{margin:0;font:600 17px/1.38 Georgia,serif;display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden}.vote-card .kind{margin:8px 0 0;font-size:12px;opacity:.6}.vote-card .links{display:flex;flex-wrap:wrap;gap:13px;margin:11px 0 0;font-size:11px}.vote-card .links a{color:#3f5a46}.legend{transition:opacity .3s;position:absolute;right:18px;top:18px;margin:0;padding:11px 13px;list-style:none;display:flex;flex-direction:column;gap:4px;font-size:10.5px;color:#333d33;border-radius:11px;background:#f7f2e4e0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 6px 26px #1b231a24}.legend li{display:flex;align-items:center;gap:7px}.legend i{width:10px;height:10px;border-radius:3px;flex:none}.legend b{margin-left:auto;opacity:.55;font-variant-numeric:tabular-nums}html.browsing,body.browsing,body.browsing #app{overflow:auto;background:#eae5d7;display:block;height:auto;min-height:100%}.index{max-width:780px;margin:0 auto;padding:56px 22px 90px}.index h1{font:600 clamp(26px,4vw,40px)/1.15 Georgia,serif;margin:0 0 14px;color:#2f3a31}.index .lede{margin:0 0 26px;font-size:14px;line-height:1.6;max-width:60ch;color:#4c5349}.index .search{display:flex;gap:8px;margin-bottom:26px}.index input{flex:1;padding:12px 14px;font:14px Arial;border:1px solid #c5bfaa;border-radius:8px;background:#fffdf6;color:inherit}.index .search button,.index .more{border:1px solid #b8b19c;border-radius:8px;background:#fffdf6;padding:12px 18px;font-size:13px}.index .more{display:block;width:100%;margin-top:18px}.votes{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}.votes a{display:block;padding:15px 17px;background:#fffdf6;border:1px solid #ddd6c2;border-radius:10px;text-decoration:none;color:inherit}.votes a:hover{border-color:#8fa287;background:#fffef9}.votes .meta{display:flex;gap:12px;margin:0;font-size:11px;letter-spacing:1.2px;text-transform:uppercase;color:#7d8378}.votes h2{margin:7px 0 11px;font:500 15px/1.4 Georgia,serif}.votes .bar{display:flex;height:7px;border-radius:4px;overflow:hidden;margin:0;background:#e6e1d2}.votes .numbers{display:flex;justify-content:space-between;gap:12px;margin:9px 0 0;font-size:11.5px;color:#6d7369;font-variant-numeric:tabular-nums}.votes em{font-style:normal;opacity:.6;white-space:nowrap}.index .status{font-size:13px;color:#6d7369;text-align:center}#error{max-width:520px;position:absolute;inset:50% auto auto 50%;transform:translate(-50%,-50%);box-shadow:0 12px 40px #1d251c22}#error h2{margin:0 0 10px;font:600 20px Georgia,serif}@media(max-width:700px){.vote-card{width:calc(100% - 40px);padding:11px 13px}.vote-card h1{font-size:13px;-webkit-line-clamp:3}.legend{display:none}#result .footnote{font-size:11px}}[hidden]{display:none!important}.sound-start{position:absolute;left:50%;top:70%;transform:translate(-50%);padding:14px 22px;border-radius:24px;background:#fff9e8ed;color:#383b33;cursor:pointer;font-size:14px;box-shadow:0 4px 30px #0002}.sound-start[hidden]{display:none}body.finale .legend{opacity:1}.bean-tip{position:fixed;z-index:20;transform:translate(14px,-50%);pointer-events:none;display:flex;align-items:center;gap:8px;padding:7px 11px;border-radius:9px;background:#1c2a22ee;color:#fff;font-size:12px;font-weight:600;white-space:nowrap;box-shadow:0 6px 20px #0b110c66;line-height:1.25}.bean-tip i{width:11px;height:11px;border-radius:3px;flex:none;box-shadow:0 0 0 1px #ffffff40}.bean-tip b{font-weight:700}.live-link{margin:0 0 22px}.live-link a{display:block;padding:13px 16px;border-radius:10px;background:#2f3a31;color:#f4efe2;text-decoration:none;font-size:13px;line-height:1.5}.live-link a:hover{background:#3a473c}.live-link b{color:#ff6a5a;letter-spacing:.3px}.live-badge{position:absolute;left:26px;top:22px;display:flex;align-items:center;gap:8px;font:700 12px/1 Arial;letter-spacing:2px;color:#c8402f;background:#f7f2e4dd;padding:8px 13px;border-radius:20px;box-shadow:0 4px 18px #1b231a22}.live-badge i{width:9px;height:9px;border-radius:50%;background:#e23b28;box-shadow:0 0 #e23b2899;animation:livepulse 1.8s infinite}@keyframes livepulse{0%{box-shadow:0 0 #e23b2899}70%{box-shadow:0 0 0 9px #e23b2800}to{box-shadow:0 0 #e23b2800}}.live-panel{position:absolute;left:50%;bottom:26px;transform:translate(-50%);max-width:min(560px,92vw);text-align:center;background:#f7f2e4ee;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:14px 20px;border-radius:14px;box-shadow:0 8px 30px #1b231a2e;color:#333d33}.live-panel .live-title{margin:0;font:700 10px/1 Arial;letter-spacing:1.4px;text-transform:uppercase;opacity:.6}.live-panel .live-h{margin:5px 0 0;font:600 15px/1.35 Georgia,serif;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.live-panel .live-status{margin:0;font-size:14px}.live-btn{margin-top:11px;border:1px solid #b8b19c;border-radius:8px;background:#fffdf6;color:#333d33;padding:9px 16px;font-size:12px;cursor:pointer}.live-btn:hover{background:#fff}.bean-tip span{opacity:.7;font-weight:500;border-left:1px solid #ffffff33;padding-left:8px}body.finale .vote-card{opacity:1}.vote-card{transition:opacity .3s}#result.counting{background:#f7f2e4b8;box-shadow:none}#result.counting .tally{font-size:clamp(18px,2.2vw,28px)}#result.counting{padding:9px 16px}#result.counting .footnote{display:none}#result.counting small{font-size:9px;margin-top:6px}.live-panel{left:126px;top:20px;bottom:auto;transform:none;width:min(430px,calc(100vw - 150px));max-width:none;text-align:left;padding:12px 16px}.live-panel .live-h{-webkit-line-clamp:4}.live-panel .live-btn{margin-top:8px}.live-badge{left:20px;top:22px}@media(max-width:600px){.live-panel{left:105px;top:18px;width:calc(100vw - 120px);padding:10px}.live-panel .live-h{font-size:12px}.live-badge{left:10px;padding:8px 10px}}