.quest-hint-guide{color:var(--win-ink,#e8f1ed);padding:16px;border-radius:16px;background:var(--win-panel,#213329)}
.quest-hint-guide p{line-height:1.55;margin:12px 0}.quest-hint-guide p>img{vertical-align:middle;object-fit:contain}
.quest-hint-guide button,.quest-hint-guide a{min-height:44px;display:inline-flex;align-items:center;gap:8px;padding:9px 12px;color:inherit}
.quest-hint-legend{display:grid;grid-template-columns:repeat(auto-fit,minmax(185px,1fr));gap:10px;margin:14px 0}
.quest-hint-legend>div{padding:10px;border-radius:12px;background:color-mix(in srgb,currentColor 5%,transparent)}
.quest-hint-legend dt{display:flex;align-items:center;gap:9px}.quest-hint-legend dt img{object-fit:contain;flex:none}.quest-hint-legend dd{margin:7px 0 0;font-size:12px;line-height:1.5}
.exp-hint-action{display:flex;align-items:center;gap:5px;margin:8px 0;font-size:12px;line-height:1.4}.exp-hint-action img{flex:none;object-fit:contain}
html[data-game-theme="light"] .quest-hint-guide{color:#24362d;background:#f4f8f3}
@media(max-width:480px){.quest-hint-legend{grid-template-columns:1fr}.quest-hint-guide{padding:12px}}
.quest-hint-settings{min-width:0}.quest-hint-settings h3{margin:0;font-size:17px}
#app #sidePanel .hint-control-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:14px 0}
#app #sidePanel .hint-control{display:flex;flex-direction:column;gap:8px;min-width:0;font-size:12px;font-weight:650;color:var(--set-ink)}
#app #sidePanel .hint-control[hidden]{display:none}
#app #sidePanel .hint-control>span{display:flex;justify-content:space-between;gap:8px;line-height:1.4}
#app #sidePanel .hint-control output{white-space:nowrap;color:var(--set-muted);font-variant-numeric:tabular-nums}
#app #sidePanel .hint-control select,#app #sidePanel .hint-control input[type="color"]{width:100%;min-width:0;min-height:44px;border:1px solid var(--set-line);border-radius:9px;background:var(--set-paper);color:var(--set-ink);padding:7px;font:inherit}
#app #sidePanel .hint-control input[type="range"]{width:100%;min-width:0;min-height:44px;margin:0;accent-color:var(--set-accent)}
#app #sidePanel .hint-check{display:flex;align-items:center;gap:10px;min-height:44px;font-size:13px;line-height:1.45;cursor:pointer}
#app #sidePanel .hint-check input{width:20px;height:20px;flex:none;accent-color:var(--set-accent)}
#app #sidePanel .hint-presets,#app #sidePanel .hint-settings-footer{display:flex;gap:8px;flex-wrap:wrap}
#app #sidePanel .hint-presets button,#app #sidePanel .hint-settings-footer button,#app #sidePanel .hint-settings-footer a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 12px;border:1px solid var(--set-line);border-radius:9px;background:var(--set-paper);color:var(--set-ink);font:650 12px/1.4 system-ui;text-decoration:none}
#app #sidePanel .hint-advanced{margin:12px 0;border-block:1px solid var(--set-line)}
#app #sidePanel .hint-advanced summary{padding:13px 0;min-height:44px;font-size:13px;cursor:pointer}
#app #sidePanel .hint-target-options{display:grid;gap:2px;margin:12px 0}
.hint-preview{margin:14px 0;border-radius:12px;overflow:hidden;border:1px solid #8e9c70;background:linear-gradient(100deg,#e8c38a 0%,#edcf9a 48%,#7f9f47 52%,#527e3e 100%);color:#203326}
.hint-preview-route{container-type:inline-size;position:relative;height:96px;overflow:hidden}.hint-preview figcaption{background:#ffffffd9;padding:7px 10px;font:600 11px/1.4 system-ui}
.hint-preview-marks{position:relative;height:100%;width:100%}
.hint-preview-marks>i{position:absolute;display:block;left:calc((.5 + var(--i)) * 100% / var(--hint-count));top:calc(30px + (var(--i) / 6 - .5) * 6px);width:calc(18px * var(--hint-size));height:calc(30px * var(--hint-size));rotate:90deg;filter:drop-shadow(1px 0 #16344d) drop-shadow(-1px 0 #16344d) drop-shadow(0 1px #16344d) drop-shadow(0 -1px #16344d)}
.hint-preview[data-animated="true"] .hint-preview-marks>i{left:-40px;animation:hint-preview-travel var(--hint-duration) linear infinite;animation-delay:calc(var(--i) * var(--hint-duration) / var(--hint-count) * -1)}
.hint-preview-marks b{display:block;width:100%;height:100%;background:var(--hint-color);mask:url('/assets/action-emoji-v2/foot-left.webp') center / contain no-repeat;opacity:var(--hint-opacity);animation:hint-preview-step var(--hint-duration) linear infinite;animation-delay:calc(var(--i) * var(--hint-duration) / var(--hint-count) * -1)}
.hint-preview-marks>i:nth-child(even){margin-top:14px}.hint-preview-marks>i:nth-child(even)>b{mask-image:url('/assets/action-emoji-v2/foot-right.webp')}
.hint-preview[data-style="arrows"] .hint-preview-marks>i{top:32px;margin-top:0}.hint-preview[data-style="arrows"] .hint-preview-marks b{mask:none;clip-path:polygon(50% 4%,56% 8%,92% 82%,89% 88%,50% 69%,11% 88%,8% 82%,44% 8%)}
.hint-preview[data-contrast="soft"] .hint-preview-marks>i{filter:none}
.hint-preview[data-contrast="high"] .hint-preview-marks>i{filter:drop-shadow(1px 0 #16344d) drop-shadow(-1px 0 #16344d) drop-shadow(0 1px #16344d) drop-shadow(0 -1px #16344d) drop-shadow(1px 0 #fff) drop-shadow(-1px 0 #fff) drop-shadow(0 1px #fff) drop-shadow(0 -1px #fff)}
.hint-preview-line{position:absolute;inset:0;width:100%;height:100%;overflow:visible;display:none}
.hint-preview-line path{fill:none;stroke:var(--hint-color);stroke-width:calc(4px * var(--hint-size));stroke-dasharray:14 12;stroke-linecap:round;opacity:var(--hint-opacity);filter:drop-shadow(0 1px #16344d) drop-shadow(0 -1px #16344d);animation:hint-preview-flow var(--hint-flow-duration) linear infinite}
.hint-preview[data-contrast="soft"] .hint-preview-line path{filter:none}.hint-preview[data-contrast="high"] .hint-preview-line path{filter:drop-shadow(0 1px #16344d) drop-shadow(0 -1px #16344d) drop-shadow(0 2px #fff) drop-shadow(0 -2px #fff)}
.hint-preview[data-style="line"] .hint-preview-line{display:block}.hint-preview[data-style="line"] .hint-preview-marks,.hint-preview[data-style="off"] .hint-preview-marks{display:none}
.hint-preview-off{display:none;text-align:center;padding-top:35px;font:600 13px system-ui;color:#203326}.hint-preview[data-style="off"] .hint-preview-off{display:block}
.hint-preview[data-animated="false"] b,.hint-preview[data-animated="false"] path,fieldset:disabled .hint-preview b,fieldset:disabled .hint-preview path{animation:none}
@keyframes hint-preview-travel{to{translate:calc(100cqw + 80px) 0}}
.hint-preview[data-animated="false"] .hint-preview-marks>i,fieldset:disabled .hint-preview-marks>i{animation:none;left:calc((.5 + var(--i)) * 100% / var(--hint-count))}
@keyframes hint-preview-step{0%,100%{opacity:calc(var(--hint-opacity) * .58);transform:scale(.94)}50%{opacity:var(--hint-opacity);transform:scale(1)}}
@keyframes hint-preview-flow{to{stroke-dashoffset:-26}}
@media(prefers-reduced-motion:reduce){.hint-preview .hint-preview-marks>i{animation:none!important;left:calc((.5 + var(--i)) * 100% / var(--hint-count))}.hint-preview b,.hint-preview path{animation:none!important}}
@media(max-width:480px){#app #sidePanel .hint-control-grid{grid-template-columns:1fr;gap:10px}.hint-preview figcaption{font-size:10px}}
@media(max-width:760px){#app #sidePanel .settings-workbench .settings-navigation{grid-template-columns:repeat(3,minmax(0,1fr))}}