@charset "UTF-8";

/* Opt-in information chrome. It neither selects a gameplay mode nor implies modality. */
.information_theme, .information_theme::backdrop {
 --information-surface:#fff7fa;
 --information-control:#f2dfe7;
 --information-ink:#3e2634;
 --information-border:#9f687f;
 --information-accent:#8a315b;
 --information-backdrop:#eadce3;
 --information-font:Georgia, "Times New Roman", serif;
}
.information_surface {
 box-sizing:border-box;
 padding:0;
 border:2px solid var(--information-border);
 border-radius:4px;
 background:var(--information-surface);
 color:var(--information-ink);
 font:16px/1.5 var(--information-font);
 overflow:hidden;
 color-scheme:light;
}
.information_theme.information_surface button { font-family:var(--information-font); }
.information_dialog {
 position:fixed;
 inset:0;
 margin:auto;
 width:min(var(--information-dialog-max-width, 1200px), max(320px, calc(100vw - 16px)));
 max-width:100vw;
 max-height:none;
}
.information_dialog::backdrop { background:var(--information-backdrop); }
.information_header {
 display:flex;
 align-items:center;
 justify-content:space-between;
 gap:8px;
 padding:12px 8px;
 flex:none;
 border-bottom:1px solid var(--information-border);
}
.information_title { margin:0; font:600 20px/1.3 var(--information-font); }
.information_surface .information_control {
 padding:8px 12px;
 border:1px solid var(--information-border);
 border-radius:4px;
 background:var(--information-control);
 color:var(--information-ink);
 font:600 16px/1.3 var(--information-font);
 cursor:pointer;
}
/* Keep Profile's authored size/padding; share only its information visual roles. */
#profile_menu_panel .information_menu_action {
 border-radius:4px;
 font-family:var(--information-font);
 border-color:var(--information-border);
 background:var(--information-control);
 color:var(--information-ink);
}
.information_control:hover,
#profile_menu_panel .information_menu_action:hover { border-color:var(--information-accent); }
.information_control:focus-visible,
#profile_menu_panel .information_menu_action:focus-visible {
 outline:3px solid var(--information-accent);
 outline-offset:3px;
}
/* Applied only by the shared native-modal lifecycle, never by visual classes alone. */
html.information-modal-open,
html.information-modal-open body { overflow:hidden !important; overscroll-behavior:none; }

/* Nonmodal tutorial presentation; input policy is owned by the disclosure guard. */
.tutorial_panel { transform:scale(var(--viewport-fit-scale,1)); transform-origin:top left; position:fixed; z-index:14000; width:min(360px,calc(100vw - 16px)); max-height:calc(100dvh - 16px); overflow:clip; display:flex; flex-direction:column; box-shadow:0 8px 24px #3e263433; }
.tutorial_panel .information_title, .tutorial_panel p { min-width:0; overflow-wrap:anywhere; }
.tutorial_panel[hidden] { display:none; }
.tutorial_panel.information_surface { border-width:8px; }
.tutorial_panel { --tutorial-padding:50px; --tutorial-body-size:16px; --tutorial-title-size:20px; }
.tutorial_panel[data-tier="2"] { --tutorial-padding:28px; --tutorial-body-size:15px; --tutorial-title-size:19px; }
.tutorial_panel[data-tier="3"] { --tutorial-padding:12px; --tutorial-body-size:14px; --tutorial-title-size:18px; }
.tutorial_panel[data-tier="4"] { --tutorial-padding:4px; --tutorial-body-size:14px; --tutorial-title-size:16px; }
.tutorial_panel .information_header { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:start; flex:none; padding:calc(var(--tutorial-padding) / 2) var(--tutorial-padding); border-bottom-width:4px; gap:12px; }
.tutorial_panel .information_title { font-size:var(--tutorial-title-size); line-height:1.25; }
.tutorial_panel p { margin:0; padding:var(--tutorial-padding); font-size:var(--tutorial-body-size); line-height:1.5; overflow:clip; min-height:0; }
.tutorial_panel #tutorial_body { flex:1 1 auto; }
.tutorial_panel .information_control { min-height:44px; border-width:4px; font-size:var(--tutorial-body-size); }
.tutorial_panel[data-tier="4"] .information_header { padding:4px; gap:4px; }
.tutorial_panel[data-tier="4"] .information_title { max-height:40px; overflow:clip; }
.tutorial_panel[data-tier="4"] .information_control { width:32px; min-width:32px; height:32px; min-height:32px; padding:0; font-size:20px; line-height:1; }
.tutorial_panel .information_control:focus-visible { outline-offset:-4px; }
.tutorial_error:empty { display:none; }
.tutorial_announcement { position:fixed; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); pointer-events:none; }

.tutorial_measure { left:-10000px; top:0; visibility:hidden; pointer-events:none; max-height:none; height:auto; }
.tutorial_target_cue { position:fixed; z-index:13999; pointer-events:none; box-sizing:border-box; border-radius:6px; box-shadow:inset 0 0 0 calc(6px * var(--viewport-fit-scale,1)) var(--information-accent); }
.tutorial_target_cue[hidden] { display:none; }

#profile_menu_panel .information_menu_action[aria-expanded="true"],
#profile_menu_panel .information_menu_action[aria-pressed="true"] { background:var(--information-accent); color:var(--information-surface); border-color:var(--information-accent); }
#profile_menu_panel .information_menu_action[aria-expanded="true"]:focus-visible,
#profile_menu_panel .information_menu_action[aria-pressed="true"]:focus-visible { outline:2px solid var(--information-surface); outline-offset:-4px; }
.profile_support_children { display:flex; flex-direction:column; gap:4px; padding:6px; margin-top:4px; border:1px solid var(--information-border); border-radius:4px; background:var(--information-surface); color:var(--information-ink); }
.profile_support_children[hidden] { display:none; }
#tutorial_toggle_error { margin:0; font:14px/1.4 var(--information-font); }
#tutorial_toggle_error:empty { display:none; }
#profile_menu_panel { max-height:calc(100dvh - 48px); overflow:auto; }

/* Non-modal top-layer painting preserves authored disclosure geometry across shell transforms. */
/* Important layered geometry outranks consumer rules such as Tech’s top:auto. */
@layer guidance-presentation {
[data-guidance-layer] {
 position:fixed !important; inset:auto !important; margin:0 !important;
 left:var(--guidance-layer-x) !important; top:var(--guidance-layer-y) !important;
 width:var(--guidance-layer-width) !important; height:var(--guidance-layer-height) !important;
 min-width:0 !important; min-height:0 !important; max-width:none !important; max-height:none !important;
 box-sizing:border-box !important; transform-origin:top left !important;
 transform:scale(var(--guidance-layer-scale-x),var(--guidance-layer-scale-y)) !important;
}
[data-guidance-layer]::backdrop { background:transparent; pointer-events:none; }

}

/* Tutorial decoration for a control inside a promoted disclosure; never owns input. */
.tutorial_target_cue[popover] { margin:0; padding:0; border:0; background:transparent; right:auto; bottom:auto; overflow:visible; }

/* Compact overlap fallback is explicitly above its disclosure owner. */
.tutorial_panel[popover] { margin:0; right:auto; bottom:auto; }
.tutorial_panel[data-placement-fallback="true"] .information_title { max-height:32px; }
