.sym-shortcut{display:flex;justify-content:space-between;align-items:center;gap:24px;background:var(--ks-f1f7fc);border:1px solid var(--ks-d9e6ef);border-radius:16px;padding:24px;margin:24px 0}.sym-shortcut h2{font-size:23px;margin:8px 0}.sym-shortcut p{line-height:1.5}.sym-shortcut .button{flex-shrink:0}.sym-toolbar,.sym-actions,.sym-point-picker{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.sym-toolbar{margin:24px 0}.sym-toolbar [aria-pressed=true]{background:var(--ks-174a81);color:var(--kt-ffffff);border-color:var(--ks-174a81)}.sym-sheet{padding:28px;background:var(--ks-ffffff);border:1px solid var(--ks-dde5eb);border-radius:16px}.sym-sheet h2{font-size:24px;line-height:1.4;margin:8px 0 24px}.sym-workspace{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(220px,1fr);gap:28px;align-items:start}.sym-board{position:relative;max-width:480px;margin:0 auto;width:100%;background:var(--ks-fafdff);border-radius:12px}.sym-board svg{display:block;width:100%;height:auto}.sym-grid-line{stroke:var(--kg-d4e0e9);stroke-width:1}.sym-coordinate{font-size:12px;text-anchor:middle;fill:var(--kg-63798a)}.sym-axis{stroke:var(--kg-d57915);stroke-width:3}.sym-source{fill:var(--kg-2368af);stroke:var(--kg-2368af)}.sym-answer{fill:var(--kg-7952c3);stroke:var(--kg-7952c3)}.sym-expected{fill:var(--kg-087652);stroke:var(--kg-087652)}.sym-wrong{fill:var(--kgk-b12d46);stroke:var(--kgk-b12d46);stroke-width:3}.sym-board g text{font-size:15px;font-weight:700;stroke:var(--kg-ffffff);stroke-width:3px;paint-order:stroke fill}.sym-shape{fill-opacity:.09;stroke-width:2}.sym-shape.sym-expected{stroke-dasharray:5 4}.sym-guide{stroke:var(--kg-087652);stroke-width:1.5;stroke-dasharray:4 4}.sym-distance{fill:var(--kg-076143);stroke:var(--kg-ffffff);stroke-width:4px;paint-order:stroke fill;font-size:13px;text-anchor:middle;font-weight:700}.sym-grid-buttons{position:absolute;inset:5%;display:grid;grid-template-columns:repeat(9,1fr);grid-template-rows:repeat(9,1fr)}.sym-grid-buttons [role=row]{display:contents}.sym-grid-buttons button{background:transparent;border:0;border-radius:50%;padding:0;min-width:0;min-height:0;cursor:crosshair;touch-action:manipulation}.sym-grid-buttons button:hover:not(:disabled){background:var(--ks-7952c31a)}.sym-grid-buttons button:focus-visible{outline:3px solid var(--ks-7952c3);outline-offset:-4px;background:var(--ks-7952c31a)}.sym-grid-buttons button:disabled{cursor:default;opacity:1}.sym-point-picker button{border:1px solid var(--ks-cabee0);background:var(--ks-fff);border-radius:8px;min-height:44px;min-width:48px;color:var(--kt-6036a3);font-weight:700}.sym-point-picker button[aria-pressed=true]{background:var(--ks-6e44b0);color:var(--kt-ffffff)}.sym-point-picker span{font-size:14px}.sym-legend{display:flex;flex-wrap:wrap;gap:10px;font-size:12px;line-height:1.6}.sym-legend span:first-child{color:var(--kt-2368af)}.sym-legend span:last-child{color:var(--kt-a55806)}.sym-position{font-size:13px;font-weight:600;line-height:1.6;min-height:21px}.sym-keyboard{font-size:12px;color:var(--kt-5e6e7b);line-height:1.5}.sym-instructions{background:var(--ks-f5f8fb);padding:20px;border-radius:12px;font-size:15px;line-height:1.65}.sym-instructions h3{margin:0 0 12px}.sym-instructions ol{padding-left:22px}.sym-instructions li{margin-bottom:9px}.sym-feedback{border-top:1px solid var(--ks-d9e4df);margin-top:20px;padding-top:18px;line-height:1.6}.sym-feedback ul{padding-left:18px}.sym-feedback li{margin:10px 0}.sym-actions{margin-top:20px}.sym-actions a{font-size:14px;color:var(--kt-235f99)}.sym-review-board{max-width:480px;margin:16px auto}.review-sheet .sym-feedback{padding:18px;background:var(--ks-f3f8f5);border-radius:10px}.sym-sheet button:disabled{opacity:.6}.sym-sheet .sym-grid-buttons button:disabled{opacity:1}
@media(max-width:1050px){.sym-workspace{grid-template-columns:1fr}.sym-instructions ol{margin-bottom:0}.sym-shortcut{align-items:flex-start;flex-direction:column}}
@media(max-width:600px){.sym-sheet{padding:14px}.sym-sheet h2{font-size:20px}.sym-point-picker{gap:6px}.sym-point-picker span{width:100%;margin:5px 0}.sym-shortcut{padding:20px}.sym-actions .button{width:100%;text-align:center}.sym-instructions{padding:16px}.sym-toolbar .button{flex:1;padding:12px 8px;font-size:14px}.sym-review-board{margin:12px -6px}}
