/* 스피킹 게임 tab of the student bar (dist/games-tab.js; its frame is student-tabs.js gamesPanelHTML, 2026-10-30). It sits
   in the shared columns of student-tabs.css (top: title and lead; main: one 내 학습-style row per game with its start
   panel folded under it; side: the note) and uses the student home palette. A match covers the whole screen (the game
   screen's own fixed box); the page behind it does not scroll. */
.student-games-view .games-row-icon{background:var(--i-e5dff7,#e5dff7);color:var(--i-8a70ad,#8a70ad)}
.student-games-view .games-row-button strong small{margin-left:4px;color:var(--home-muted,var(--n-716d63,#716d63));font-size:12px;font-weight:700;letter-spacing:0;white-space:nowrap}
.student-games-view .games-start{padding:4px 14px 16px;border:1px solid var(--n-edddcd,#edddcd);border-top:0;border-radius:0 0 18px 18px;background:var(--n-fffdf8,#fffdf8)}
.student-games-view .games-start[hidden]{display:none}
.student-games-view .games-label{margin:10px 2px 6px;color:var(--n-8b6146,#8b6146);font-size:13px;line-height:1.4;font-weight:800}
/* 그림 묶음 pages (2026-10-31, owner: "후아유 탭이 너무 길어 … 6개씩 보이게 해서 스와이프로 넘기면 또 6개"): six tiles to a
   page (two columns, three from 900 px), the pages side by side in one horizontal scroller that snaps a page at a time
   (a finger swipes it; a vertical move still scrolls the page; no scrollbar), every page as tall as the tallest so
   nothing under it moves. The scroller reaches 8 px past the panel's content on each side and the page gives it back
   as padding, so a chosen tile's ring and the focus outline are never clipped and the tiles sit where they did. Under
   it the dots (the current one a short bar; both at least 3:1 on the panel) between ‹ › (44 × 44 px targets). */
.student-games-view .games-pager{margin:-8px -8px 0}
.student-games-view .games-sets{position:relative;display:grid;grid-auto-flow:column;grid-auto-columns:100%;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.student-games-view .games-sets::-webkit-scrollbar{display:none}
.student-games-view .games-page{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-content:start;gap:8px;min-width:0;padding:8px;scroll-snap-align:start;scroll-snap-stop:always}
.student-games-view .games-pager-nav{display:flex;align-items:center;justify-content:center;height:44px;margin-top:-4px}
.student-games-view .games-pager-step{display:grid;place-items:center;flex:none;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:transparent;color:var(--n-a0714f,#a0714f);cursor:pointer}
.student-games-view .games-pager-step svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.student-games-view .games-pager-step:hover{background:var(--n-fff5e9,#fff5e9);filter:none}
.student-games-view .games-pager-step[aria-disabled="true"]{color:var(--n-e3d3c1,#e3d3c1);background:transparent;cursor:default}
.student-games-view .games-dots{display:flex;align-items:center}
.student-games-view .games-dot{display:grid;place-items:center;flex:none;width:44px;height:44px;padding:0;border:0;border-radius:12px;background:transparent;cursor:pointer}
.student-games-view .games-dot:hover{filter:none}
.student-games-view .games-dot:focus-visible,.student-games-view .games-pager-step:focus-visible{outline-offset:0}
.student-games-view .games-dot span{display:block;width:8px;height:8px;border-radius:999px;background:var(--n-b38a6a,#b38a6a);transition:width 200ms ease,background-color 200ms ease}
.student-games-view .games-dot.is-current span{width:20px;background:var(--n-8b6146,#8b6146)}
@media(prefers-reduced-motion:reduce){.student-games-view .games-dot span{transition:none}}
.student-games-view .games-set{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"thumbs thumbs" "name tag";align-items:center;align-content:start;gap:6px;min-width:0;min-height:44px;padding:8px;border:1px solid var(--n-e3cdb6,#e3cdb6);border-radius:14px;background:var(--n-ffffff,#fff);color:var(--n-403b35,#403b35);text-align:left;cursor:pointer}
.student-games-view .games-set:hover{background:var(--n-fff8ef,#fff8ef);filter:none}
.student-games-view .games-set.is-chosen{border-color:var(--n-d3925f,#d3925f);background:var(--n-fff5e9,#fff5e9);box-shadow:0 0 0 2px var(--n-f1c9a4,#f1c9a4)}
.student-games-view .games-set-thumbs{grid-area:thumbs;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
.student-games-view .games-set-thumb{display:block;aspect-ratio:1;border:1px solid var(--p-f0e3d0,#f0e3d0);border-radius:8px;overflow:hidden;background:var(--p-fff8ec,#fff8ec)}
.student-games-view .games-set-thumb svg{display:block;width:100%;height:100%}
.student-games-view .games-set-name{grid-area:name;min-width:0;font-size:14px;line-height:1.35;font-weight:800;letter-spacing:-.3px;word-break:keep-all}
.student-games-view .games-set-tag{grid-area:tag;padding:2px 8px;border-radius:999px;font-size:11px;line-height:1.5;font-weight:800;white-space:nowrap}
.student-games-view .games-set-tag.is-easy{background:var(--i-e8f1e3,#e8f1e3);color:var(--i-46733b,#46733b)}
.student-games-view .games-set-tag.is-hard{background:var(--n-fbe1d6,#fbe1d6);color:var(--n-a94c31,#a94c31)}
.student-games-view .games-label.is-tight{margin:8px 2px 4px}
/* Compact choices (2026-10-31, owner on a 412 px screenshot, circling the big boxed [친구와 하기][컴퓨터와 하기] and
   컴퓨터 실력 [쉬움][보통][어려움] + [시작하기]: "이부분 자리 좀 덜 차지하면서 심플하게 보이게 수정해줘"). Every one-of-n
   choice of the start panels is one flat segmented track (a radio group, dist/games-tab.js): the options share a light
   track and the chosen one is a white thumb with a 3:1 border, a soft shadow and bolder, darker text (never colour
   alone). Each option is a whole 44 px target and its thumb is drawn 3 px inside it, so the track is no taller than the
   target; equal columns, so choosing moves nothing. A label that does not fit its column (large text) wraps between
   words (inside a word only as a last resort) in a taller option instead of spilling out of it (review 2026-10-31). The thumb fades in 120 ms (reduced
   motion: at once). Text from the --act-* tokens. */
.student-games-view .games-seg{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);min-width:0;border-radius:14px;background:var(--n-f3e9dd,#f3e9dd)}
.student-games-view .games-seg.is-grid{grid-auto-flow:row;grid-template-columns:repeat(3,minmax(0,1fr))}
.student-games-view .games-seg-option{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:center;gap:4px;min-width:0;min-height:44px;margin:0;padding:4px 6px;border:0;border-radius:14px;background:transparent;color:var(--n-6f5b49,#6f5b49);font-size:var(--act-button,15px);font-weight:600;line-height:1.2;letter-spacing:-.2px;text-align:center;white-space:normal;word-break:keep-all;overflow-wrap:anywhere;cursor:pointer}
.student-games-view .games-seg-option::before{content:"";position:absolute;inset:3px;z-index:-1;border:1.5px solid transparent;border-radius:11px;transition:background-color 120ms ease,border-color 120ms ease,box-shadow 120ms ease}
.student-games-view .games-seg-option:hover{filter:none}
@media(hover:hover){.student-games-view .games-seg-option:hover::before{background:var(--n-faf4ec,#faf4ec)}}
.student-games-view .games-seg-option[aria-checked="true"]{color:var(--n-7d4a31,#7d4a31);font-weight:800}
.student-games-view .games-seg-option[aria-checked="true"]::before{background:var(--n-ffffff,#fff);border-color:var(--n-b5784f,#b5784f);box-shadow:0 1px 3px #7d4a3133}
.student-games-view .games-seg-option:focus-visible{outline:3px solid var(--n-d4916b,#d4916b);outline-offset:-1px}
@media(prefers-reduced-motion:reduce){.student-games-view .games-seg-option::before{transition:none}}
/* 컴퓨터 실력 and its start on one row; a row too narrow for both (the levels need 192 px) puts the start under them, full
   width. The start buttons are 44 px like every control here, still the panel's one filled button. */
.student-games-view .games-go{display:flex;flex-wrap:wrap;gap:8px}
.student-games-view .games-go .games-seg{flex:999 1 192px;max-width:100%}
.student-games-view .games-go .games-computer{flex:1 0 auto;width:auto;margin:0}
.student-games-view .games-computer{width:100%;min-height:44px;margin-top:12px;padding:8px 18px;font-size:var(--act-button,16px);font-weight:800;line-height:1.2;white-space:nowrap}
/* 단어 설명's start panel (2026-10-30): the shuffle note, 난이도 with what each level mixes, the start button, the note
   (text sizes from the --act-* tokens, spec §A.1). */
.student-games-view .games-mixed{margin:10px 2px 0;color:var(--home-muted,var(--n-716d63,#716d63));font-size:var(--act-note,12px);line-height:1.5;font-weight:700;word-break:keep-all}
/* 난이도 with what each level mixes: two lines in one 48 px option (room between the second line and the thumb's edge). */
.student-games-view .games-level-pair{flex-direction:column;gap:0;min-height:48px;padding:3px 4px;line-height:1.15}
.student-games-view .games-level-pair small{color:var(--n-6f5b49,#6f5b49);font-size:var(--act-label,12px);font-weight:600;letter-spacing:-.2px}
.student-games-view .games-level-pair[aria-checked="true"] small{color:var(--n-9a5b3d,#9a5b3d);font-weight:700}
.student-games-view .games-pair-note{margin:8px 2px 0;color:var(--home-muted,var(--n-716d63,#716d63));font-size:var(--act-note,12px);line-height:1.5;font-weight:700;text-align:center;word-break:keep-all}
.student-games-view .games-note{margin:0;padding:12px 14px;border:1px dashed var(--n-e2d6c4,#e2d6c4);border-radius:14px;background:var(--n-fffdf8,#fffdf8);color:var(--home-muted,var(--n-716d63,#716d63));font-size:12px;line-height:1.6;word-break:keep-all}
.student-games-view .games-notice[hidden]{display:none}
.student-games-view .games-update{display:grid;justify-items:center;gap:12px;margin:24px 0;padding:24px 16px;border:1px solid var(--n-eee3d5,#eee3d5);border-radius:18px;background:var(--n-fffdf8,#fffdf8);text-align:center}
.student-games-view .games-update p{margin:0;color:var(--n-403b35,#403b35);font-size:14px;line-height:1.6;font-weight:700;word-break:keep-all}
.student-games-view .games-match[hidden]{display:none}
body[data-games-match="open"]{overflow:hidden;overscroll-behavior:none}
@media(min-width:900px){.student-games-view .games-page{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(orientation:landscape) and (max-width:899px){.student-games-view .games-page{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* 친구와 하기 (stage 2, B6): who to play with, 마주 보고 | 멀리서, the friend list (우리 반 then 다른 반) under its
   fixed-height line (hint, 초대를 보냈어요 + 취소, or the result), the tapped row's 30-second ring, missed invites, the
   count and 오늘은 초대 안 받기. Rows never move under a finger (the list changes 800 ms after the last touch and holds
   still while an invite is out); a new row fades in where it lands. An invite to this child is the bar's card
   (student-tabs.css), never a card in this page. */
.student-games-view .games-with{margin:8px 0 0}
.student-games-view .games-set.is-any .games-set-thumbs.is-any{display:grid;grid-template-columns:1fr;place-items:center;aspect-ratio:3/1;border:1px dashed var(--p-e0cdb8,#e0cdb8);border-radius:8px;color:var(--p-b38a6a,#b38a6a);font-size:20px;font-weight:800}
.student-games-view .games-mode-note,.student-games-view .games-mode-hint{margin:6px 2px 0;color:var(--home-muted,var(--n-716d63,#716d63));font-size:12px;line-height:1.55;word-break:keep-all}
.student-games-view .games-mode-hint{color:var(--n-8b6146,#8b6146);font-weight:700}
.student-games-view .games-friends{margin-top:12px}
.student-games-view .games-friends-line{display:grid;gap:10px;padding:14px;border:1px solid var(--n-eee3d5,#eee3d5);border-radius:16px;background:var(--n-ffffff,#fff);text-align:center}
.student-games-view .games-friends-line p{margin:0;color:var(--n-403b35,#403b35);font-size:14px;line-height:1.6;font-weight:700;word-break:keep-all}
.student-games-view .games-friends-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.student-games-view .games-friends-actions button{min-height:44px;padding:8px 16px;font-size:15px}
/* The line above the list: the same height for the hint, the open invite (+ 취소) and a result (two lines of text). */
.student-games-view .games-friends-status{display:flex;align-items:center;gap:10px;box-sizing:border-box;min-height:64px;margin:0 0 10px;padding:8px 12px;border:1px dashed var(--n-e2d6c4,#e2d6c4);border-radius:14px;background:var(--n-fffdf8,#fffdf8)}
.student-games-view .games-friends-status p{flex:1;min-width:0;margin:0;color:var(--home-muted,var(--n-716d63,#716d63));font-size:13px;line-height:1.45;font-weight:700;word-break:keep-all}
.student-games-view .games-friends-status.is-out{border-style:solid;border-color:var(--i-e9c7b9,#e9c7b9);background:var(--i-ffffff,#fff)}
.student-games-view .games-friends-status.is-out p{color:var(--i-403b35,#403b35)}
.student-games-view .games-friends-status.is-result{border-style:solid;border-color:var(--n-f0d6c4,#f0d6c4);background:var(--n-fff8f1,#fff8f1)}
.student-games-view .games-friends-status.is-result p{color:var(--n-403b35,#403b35)}
.student-games-view .games-friends-status button{flex:0 0 auto;min-height:44px;padding:8px 16px;font-size:15px}
.student-games-view .games-friends-line+.games-friend-group{margin-top:10px}
.student-games-view .games-friends-note{margin:0 2px 8px;color:var(--n-8b6146,#8b6146);font-size:13px;font-weight:700;line-height:1.5}
.student-games-view .games-friend-group+.games-friend-group{margin-top:10px}
.student-games-view .games-friend-heading{margin:0 2px 6px;color:var(--n-8b6146,#8b6146);font-size:13px;font-weight:800}
.student-games-view .games-friend-list{display:grid;gap:6px;margin:0;padding:0;list-style:none}
.student-games-view .games-friend{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:8px;width:100%;min-height:48px;box-sizing:border-box;padding:8px 12px;border:1px solid var(--n-e3cdb6,#e3cdb6);border-radius:14px;background:var(--n-ffffff,#fff);color:var(--n-403b35,#403b35);text-align:left}
.student-games-view .games-friend.is-new{animation:games-row-in 240ms ease-out}
.student-games-view button.games-friend{cursor:pointer}
.student-games-view button.games-friend:hover{background:var(--n-fff8ef,#fff8ef);filter:none}
.student-games-view .games-friend.is-busy{grid-template-columns:minmax(0,1fr) auto;border-style:dashed;background:var(--n-faf7f2,#faf7f2);color:var(--n-9a9288,#9a9288)}
.student-games-view .games-friend-name{min-width:0;overflow:hidden;font-size:15px;font-weight:800;text-overflow:ellipsis;white-space:nowrap}
.student-games-view .games-friend-chip{padding:2px 8px;border-radius:999px;background:var(--n-e8f1e3,#e8f1e3);color:var(--n-46733b,#46733b);font-size:12px;font-weight:800;white-space:nowrap}
.student-games-view .games-friend.is-busy .games-friend-chip{background:var(--n-efebe4,#efebe4);color:var(--n-8a837a,#8a837a)}
.student-games-view .games-friend-arrow{color:var(--n-b38a6a,#b38a6a);font-size:18px;font-weight:800}
/* The tapped friend while the invite is out (it cannot be tapped again), and the rows resting meanwhile. */
.student-games-view button.games-friend.is-waiting{border-color:var(--n-e9c7b9,#e9c7b9);background:var(--n-fff8f1,#fff8f1);cursor:default}
.student-games-view .games-friend-chip.is-waiting{display:inline-flex;align-items:center;gap:6px;background:var(--n-fbe1d6,#fbe1d6);color:var(--n-a94c31,#a94c31)}
.student-games-view .games-friend.is-waiting .games-friend-arrow{visibility:hidden}
.student-games-view button.games-friend.is-held{opacity:.55;cursor:default}
.student-games-view .games-friends-more{width:100%;min-height:44px;margin-top:8px;border:1px dashed var(--n-e0cdb8,#e0cdb8);border-radius:14px;background:var(--n-fffdf8,#fffdf8);color:var(--n-8b6146,#8b6146);font-size:14px;font-weight:800;cursor:pointer}
@keyframes games-row-in{from{opacity:0}to{opacity:1}}
/* The 30-second ring of an invite (sent or received): the whole duration with a negative delay for the time gone. */
.student-games-view .games-ring{justify-self:center;width:34px;height:34px;border-radius:50%;background:conic-gradient(var(--i-c2413a,#c2413a) var(--games-ring-left,100%),var(--i-f3e2da,#f3e2da) 0);animation:games-ring var(--games-ring,30000ms) linear forwards;animation-delay:var(--games-ring-gone,0ms);-webkit-mask:radial-gradient(circle,transparent 10px,#000 11px);mask:radial-gradient(circle,transparent 10px,#000 11px)}
@property --games-ring-left{syntax:'<percentage>';inherits:false;initial-value:100%}
@keyframes games-ring{from{--games-ring-left:100%}to{--games-ring-left:0%}}
.student-games-view .games-friend-chip .games-ring{width:16px;height:16px;-webkit-mask:radial-gradient(circle,transparent 4px,#000 5px);mask:radial-gradient(circle,transparent 4px,#000 5px)}
/* The top slot: missed invites. */
.student-games-view .games-notice{display:grid;gap:10px;margin-top:12px}
.student-games-view .games-missed{display:grid;gap:6px;margin:0;padding:0;list-style:none}
.student-games-view .games-missed li{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px 8px 12px;border:1px dashed var(--i-e2d6c4,#e2d6c4);border-radius:14px;background:var(--i-fffdf8,#fffdf8);color:var(--i-5f584f,#5f584f);font-size:13px;font-weight:700;line-height:1.5}
.student-games-view .games-missed button{flex:0 0 auto;min-height:40px;padding:6px 12px;font-size:14px}
/* The side: friends in the game, 오늘은 초대 안 받기. */
.student-games-view .games-presence{display:grid;gap:6px;margin-bottom:10px;padding:12px 14px;border:1px solid var(--n-eee3d5,#eee3d5);border-radius:14px;background:var(--n-fffdf8,#fffdf8)}
.student-games-view .games-presence[hidden]{display:none}
.student-games-view .games-count{margin:0;color:var(--n-403b35,#403b35);font-size:14px;font-weight:800;line-height:1.5}
.student-games-view .games-rest{display:flex;align-items:center;justify-content:space-between;gap:12px}
.student-games-view .games-rest-label{color:var(--n-5f584f,#5f584f);font-size:14px;font-weight:700}
.student-games-view .games-switch{position:relative;flex:0 0 auto;width:52px;height:32px;padding:0;border:0;border-radius:999px;background:var(--n-e2d9cc,#e2d9cc);cursor:pointer;transition:background 160ms ease}
.student-games-view .games-switch span{position:absolute;top:3px;left:3px;width:26px;height:26px;border-radius:50%;background:var(--p-ffffff,#fff);box-shadow:0 1px 3px #0003;transition:transform 160ms ease}
.student-games-view .games-switch[aria-checked="true"]{background:var(--n-c98055,#c98055)}
.student-games-view .games-switch[aria-checked="true"] span{transform:translateX(20px)}
.student-games-view .games-rest-note{margin:0;color:var(--home-muted,var(--n-716d63,#716d63));font-size:12px;line-height:1.5}
.student-games-view .games-rest-note.is-off{visibility:hidden}
@media(prefers-reduced-motion:reduce){.student-games-view .games-friend,.student-games-view .games-ring{animation:none}.student-games-view .games-switch,.student-games-view .games-switch span{transition:none}}
/* 스피킹 게임 샘플 (2026-10-30, spec sgsamples §A.2): the row's 샘플 tag in its own column before the arrow, the title on
   one line (the small English name gives way first), and the sample start panel: 누구와 할까요? and 난이도 (with their
   notes), the registry's options (가게 놀이's six shops: three columns) — compact choices since 2026-10-31 — 시작하기 and
   the notes. */
.student-games-view .games-row-button.is-sample strong{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.student-games-view .games-row-tag{flex:none;align-self:center;padding:2px 8px;border-radius:999px;background:var(--n-fdecc8,#fdecc8);color:var(--n-8a5a12,#8a5a12);font-size:11px;line-height:1.5;font-weight:800;white-space:nowrap}
.student-games-view .games-row-button.is-sample>.student-activity-arrow{margin-left:0}
.student-games-view .games-option{padding:4px;font-size:var(--act-ko-sm,14px)}
.student-games-view .games-option-icon{flex:none;font-size:16px;line-height:1}
/* A shop name never breaks in two (과일 / 가게) where it can be helped: in a narrow row of shops the picture sits over the
   name (review 2026-10-30). The row's own width decides (a container query), not the screen's, so the panel in the
   right column of a phone held sideways (about 235 px wide at 568×320) stacks too (review 2026-10-31). */
.student-games-view .games-options{container-type:inline-size}
@container (max-width:279px){.student-games-view .games-option{flex-direction:column;gap:1px;padding:3px 2px}}
.student-games-view .games-sample-note+.games-sample-note{margin-top:2px}
/* 그림 설명 · 토론 (2026-11-04, design talkgames §4.1; registry play 'mixed'): 누구와 할까요? (when there is more than one
   way), 난이도 · 수준 with what each level means, and for 토론 주제 — a list of one fixed height (5.5 rows of 44 px) that
   scrolls inside itself, 아무거나 then the level's 20 titles (a 수준 tap fills the same box) — and 내 편 with that side's
   statement under it, then [시작하기] and the way's note, the panel's last line. The statement and the note keep two
   lines' room whatever they say, so a tap moves nothing (not even the rows under the panel). Text from the --act-*
   tokens. */
.student-games-view .games-topics{display:grid;align-content:start;box-sizing:border-box;height:244px;overflow-y:auto;overscroll-behavior:contain;border:1px solid var(--n-e3cdb6,#e3cdb6);border-radius:14px;background:var(--n-ffffff,#fff);-webkit-overflow-scrolling:touch}
.student-games-view .games-topic{display:flex;align-items:center;min-width:0;min-height:44px;margin:0;padding:6px 12px;border:0;border-bottom:1px solid var(--n-f3e9dd,#f3e9dd);border-radius:0;background:transparent;color:var(--n-403b35,#403b35);font-size:var(--act-ko-sm,14px);font-weight:600;line-height:1.35;letter-spacing:-.2px;text-align:left;word-break:keep-all;overflow-wrap:anywhere;cursor:pointer}
.student-games-view .games-topic:last-child{border-bottom:0}
.student-games-view .games-topic:hover{filter:none}
@media(hover:hover){.student-games-view .games-topic:hover{background:var(--n-fff8ef,#fff8ef)}}
.student-games-view .games-topic.is-any{color:var(--n-8b6146,#8b6146);font-weight:700}
.student-games-view .games-topic[aria-checked="true"]{background:var(--n-fff5e9,#fff5e9);color:var(--n-7d4a31,#7d4a31);font-weight:800;box-shadow:inset 4px 0 0 var(--n-b5784f,#b5784f)}
.student-games-view .games-topic:focus-visible{outline:3px solid var(--n-b5784f,#b5784f);outline-offset:-3px}
.student-games-view .games-talk-note{min-height:calc(2 * 1.5 * var(--act-note,12px))}
.student-games-view .games-side-note{box-sizing:border-box;min-height:calc(2 * 1.5 * var(--act-note,13px) + 4px);margin:6px 2px 0;color:var(--n-5f584f,#5f584f);font-size:var(--act-note,13px);line-height:1.5;font-weight:700;word-break:keep-all}