/* ============================================================
   Encyclopædia Britannica CD 97 — period stylesheet
   Windows 95-era chrome: buttonface, bevels, navy titlebars
   ============================================================ */
:root {
  --face:#c0c0c0; --face2:#d4d0c8; --hl:#ffffff; --sh:#808080; --dsh:#404040;
  --navy:#000080; --navy2:#1084d0; --teal:#008080; --warn:#ffffe1;
}
* { box-sizing:border-box; margin:0; padding:0; }
html,body { width:100%; height:100%; overflow:hidden; }
body {
  font-family:Arial, Helvetica, sans-serif; font-size:11px;
  background:#000; color:#000; cursor:default; user-select:none;
}
input, textarea { user-select:text; }
button { font-family:inherit; font-size:11px; }
img { user-select:none; -webkit-user-drag:none; }

::-webkit-scrollbar { width:16px; height:16px; }
::-webkit-scrollbar-track { background:#dfdfdf; border-left:1px solid #808080; }
::-webkit-scrollbar-thumb { background:#c0c0c0; border:1px solid #808080; }
::-webkit-scrollbar-thumb:hover { background:#d4d0c8; }
::-webkit-scrollbar-button { background:#c0c0c0; border:1px solid #808080; height:16px; width:16px; display:block; }
::-webkit-scrollbar-corner { background:#dfdfdf; }

/* ============ 3D bevels ============ */
.raise { border-top:2px solid var(--hl); border-left:2px solid var(--hl); border-right:2px solid var(--dsh); border-bottom:2px solid var(--dsh); }
.sink  { border-top:2px solid var(--dsh); border-left:2px solid var(--dsh); border-right:2px solid var(--hl); border-bottom:2px solid var(--hl); }
.raise-thin { border-top:1px solid var(--hl); border-left:1px solid var(--hl); border-right:1px solid var(--sh); border-bottom:1px solid var(--sh); }
.sink-thin  { border-top:1px solid var(--sh); border-left:1px solid var(--sh); border-right:1px solid var(--hl); border-bottom:1px solid var(--hl); }
.frame-out { border:2px solid; border-color:var(--dsh) var(--hl) var(--hl) var(--dsh); }

/* ============ BOOT ============ */
.boot { position:fixed; inset:0; background:#000; display:flex; align-items:center; justify-content:center; z-index:100; }
.boot-box { text-align:center; width:640px; }
.boot-globe {
  width:150px; height:150px; border-radius:50%; margin:0 auto 18px;
  background:radial-gradient(circle at 35% 30%, #e8e8ff, #a8b8e0 55%, #485a90);
  box-shadow:0 0 60px rgba(120,150,255,.35), inset -18px -22px 40px rgba(0,0,60,.45);
  display:flex; align-items:center; justify-content:center; position:relative;
}
.boot-globe::after { content:""; position:absolute; inset:-14px; border-radius:50%; border:2px dashed #6a7ab0; opacity:.6; animation:bootspin 22s linear infinite; }
.boot-globe::before { content:""; position:absolute; width:170px; height:170px; border-radius:50%; border:1px solid #8a9ac8; opacity:.5; animation:bootspin 14s linear infinite reverse; }
@keyframes bootspin { to { transform:rotate(360deg); } }
.boot-eb { font-family:Georgia, "Times New Roman", serif; font-size:52px; font-weight:bold; color:#0a1460; text-shadow:1px 1px 0 #c8d4f0; letter-spacing:2px; }
.boot-name { font-family:Georgia, "Times New Roman", serif; font-size:44px; font-weight:bold; color:#fff; letter-spacing:8px; text-shadow:0 0 24px rgba(140,170,255,.7), 2px 2px 0 #001; }
.boot-edition { font-family:'Courier New', monospace; font-size:12px; color:#8ab0e0; margin-top:8px; letter-spacing:2px; }
.boot-drive { margin:34px auto 0; width:320px; }
.drive-face {
  background:linear-gradient(#2a2f38, #171a20); border:2px solid #000; border-radius:6px;
  padding:14px; position:relative; box-shadow:inset 0 0 18px rgba(0,0,0,.8);
}
.drive-slot { height:74px; background:#0a0c10; border:1px solid #000; border-radius:3px; display:flex; align-items:center; justify-content:center; }
.drive-disc {
  width:120px; height:120px; border-radius:50%; background:
    repeating-conic-gradient(#9aa4b2 0deg 6deg, #7d8796 6deg 12deg);
  box-shadow:0 0 18px rgba(160,190,255,.35), inset 0 0 24px rgba(0,0,0,.5);
  animation:spin 1.4s linear infinite;
}
.drive-disc::after { content:""; position:absolute; inset:44px; border-radius:50%; background:#0a0c10; }
@keyframes spin { to { transform:rotate(360deg); } }
.drive-led { width:8px; height:8px; border-radius:50%; background:#3a3a3a; position:absolute; top:12px; right:12px; }
.drive-led.on { background:#ff4040; box-shadow:0 0 8px #ff4040; }
.drive-label { text-align:center; font-family:'Courier New', monospace; font-size:11px; color:#5a6472; margin-top:10px; letter-spacing:1px; }
.boot-drive.clickable { cursor:pointer; }
.boot-drive.clickable:hover .drive-face { box-shadow:inset 0 0 18px rgba(0,0,0,.8), 0 0 22px rgba(120,150,255,.4); }
.boot-status { margin-top:30px; }
.boot-msg { font-family:'Courier New', monospace; font-size:14px; color:#c8d8f0; min-height:18px; text-shadow:0 0 8px rgba(140,170,255,.5); }
.boot-bar { width:520px; height:16px; margin:14px auto 0; background:#0a0c10; border:1px solid #000; box-shadow:inset 0 0 6px #000; padding:2px; }
.boot-progress { height:100%; width:0%; background:repeating-linear-gradient(90deg,#2a5ad0 0 8px,#1a3a90 8px 16px); transition:width .18s linear; }
.boot-hint { font-family:'Courier New', monospace; font-size:12px; color:#5a6a80; margin-top:12px; min-height:14px; }

/* ============ SHUTDOWN ============ */
.shutdown { position:fixed; inset:0; background:#000; z-index:200; display:flex; flex-direction:column; align-items:center; justify-content:center; cursor:pointer; }
.shutdown-text { font-family:Arial, sans-serif; font-size:30px; font-weight:bold; color:#ff9a00; text-align:center; line-height:1.5; }
.shutdown-hint { font-family:'Courier New', monospace; font-size:13px; color:#666; margin-top:40px; animation:blink 1.6s infinite; }
@keyframes blink { 50% { opacity:.15; } }

/* ============ DESKTOP ============ */
.desktop { position:fixed; inset:0; display:flex; flex-direction:column; }
.wallpaper {
  flex:1; background:
    radial-gradient(ellipse at 20% 15%, rgba(255,255,255,.05), transparent 50%),
    repeating-linear-gradient(0deg, rgba(255,255,255,.02) 0 2px, transparent 2px 64px),
    repeating-linear-gradient(90deg, rgba(255,255,255,.02) 0 2px, transparent 2px 64px),
    var(--teal);
}
.icons { position:absolute; top:0; left:0; padding:8px; display:flex; flex-direction:column; flex-wrap:wrap; height:calc(100% - 40px); align-content:flex-start; }
.icon { width:76px; padding:6px 2px; text-align:center; cursor:pointer; color:#fff; text-shadow:1px 1px 0 #000; font-size:11px; margin:2px; border:1px dotted transparent; }
.icon:hover { border:1px dotted #fff; }
.icon.sel { background:rgba(0,0,128,.35); border:1px dotted #fff; }
.icon .ic { display:block; width:40px; height:40px; margin:0 auto 4px; filter:drop-shadow(1px 1px 0 rgba(0,0,0,.6)); }

.taskbar { height:34px; background:var(--face); display:flex; align-items:center; padding:2px; gap:3px; border-top:2px solid var(--hl); position:relative; z-index:60; }
.start-btn {
  display:flex; align-items:center; gap:4px; padding:2px 8px; font-weight:bold; font-size:11px;
  background:var(--face); border-top:2px solid var(--hl); border-left:2px solid var(--hl);
  border-right:2px solid var(--dsh); border-bottom:2px solid var(--dsh); cursor:pointer;
}
.start-btn:active { border-top:2px solid var(--dsh); border-left:2px solid var(--dsh); border-right:2px solid var(--hl); border-bottom:2px solid var(--hl); }
.start-eb { background:var(--navy); color:#fff; font-family:Georgia, serif; font-weight:bold; font-size:11px; padding:1px 3px; }
.task-list { flex:1; display:flex; gap:3px; overflow:hidden; }
.task-btn {
  display:flex; align-items:center; gap:5px; padding:2px 8px; background:var(--face); cursor:pointer;
  border-top:2px solid var(--hl); border-left:2px solid var(--hl); border-right:2px solid var(--dsh); border-bottom:2px solid var(--dsh);
  max-width:160px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.task-btn.min { border-top:2px solid var(--dsh); border-left:2px solid var(--dsh); border-right:2px solid var(--hl); border-bottom:2px solid var(--hl); background:#d4d0c8; }
.task-eb { background:var(--navy); color:#fff; font-family:Georgia, serif; font-weight:bold; padding:0 3px; }
.tray { display:flex; align-items:center; gap:6px; padding:0 6px; }
.tray-clock { padding:2px 8px; border-top:1px solid var(--sh); border-left:1px solid var(--sh); border-right:1px solid var(--hl); border-bottom:1px solid var(--hl); background:var(--face); font-size:11px; }

.start-menu {
  position:fixed; left:2px; bottom:36px; width:220px; background:var(--face); z-index:300;
  border:2px solid; border-color:var(--hl) var(--dsh) var(--dsh) var(--hl); padding:2px; box-shadow:2px 2px 8px rgba(0,0,0,.4);
}
.sm-item { display:flex; align-items:center; gap:8px; padding:5px 8px; cursor:pointer; }
.sm-item:hover { background:var(--navy); color:#fff; }
.sm-sep { border-top:1px solid var(--sh); border-bottom:1px solid var(--hl); margin:3px 0; }

/* ============ APP WINDOW ============ */
.appwin {
  position:absolute; inset:4px 4px 38px 4px; background:var(--face); display:flex; flex-direction:column;
  border:2px solid; border-color:var(--hl) var(--dsh) var(--dsh) var(--hl);
  outline:1px solid #000; outline-offset:-4px;
}
.appwin.grow { animation:growwin .16s ease-out; transform-origin:0 0; }
@keyframes growwin { from { transform:scale(.6,.4); opacity:.4; } to { transform:scale(1,1); opacity:1; } }
.appwin.maxed { inset:4px 4px 38px 4px; }
.titlebar {
  height:22px; display:flex; align-items:center; gap:4px; padding-left:4px;
  background:linear-gradient(90deg, var(--navy), var(--navy2)); color:#fff; font-weight:bold; font-size:11px;
}
.appwin.inactive .titlebar { background:linear-gradient(90deg,#7a7a7a,#a8a8a8); }
.title-icon { width:16px; height:16px; background:#fff; color:var(--navy); font-family:Georgia, serif; font-weight:bold; font-size:10px; display:flex; align-items:center; justify-content:center; border:1px solid #000; }
.title-text { flex:1; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.title-buttons { display:flex; gap:2px; padding-right:2px; }
.tbtn {
  width:18px; height:16px; background:var(--face); color:#000; font-size:11px; line-height:1;
  border-top:2px solid var(--hl); border-left:2px solid var(--hl); border-right:2px solid var(--dsh); border-bottom:2px solid var(--dsh);
  cursor:pointer; display:flex; align-items:center; justify-content:center; padding:0;
}
.tbtn:active { border-top:2px solid var(--dsh); border-left:2px solid var(--dsh); border-right:2px solid var(--hl); border-bottom:2px solid var(--hl); }
.tbtn-close { font-size:13px; }

.menubar { display:flex; background:var(--face); padding:1px 2px 0; }
.menu-item { padding:3px 9px; cursor:pointer; font-size:11px; }
.menu-item:hover, .menu-item.open { background:var(--navy); color:#fff; }
.menu-panel {
  position:absolute; background:var(--face); border:1px solid; border-color:var(--hl) var(--dsh) var(--dsh) var(--hl);
  box-shadow:2px 2px 6px rgba(0,0,0,.35); z-index:120; min-width:190px; padding:2px;
}
.menu-entry { display:flex; align-items:center; padding:4px 8px; cursor:pointer; gap:8px; white-space:nowrap; }
.menu-entry:hover { background:var(--navy); color:#fff; }
.menu-entry.dis { color:#8a8a8a; }
.menu-entry.dis:hover { background:transparent; color:#8a8a8a; }
.menu-entry .m-check { width:12px; text-align:center; }
.menu-entry .m-label { flex:1; }
.menu-entry .m-short { color:#5a5a5a; }
.menu-entry:hover .m-short { color:#c0c0c0; }
.menu-sep { border-top:1px solid var(--sh); border-bottom:1px solid var(--hl); margin:2px 4px; }
.menu-sub { position:relative; }
.menu-sub .m-arrow { width:10px; text-align:center; }
.menu-subpanel { position:absolute; left:100%; top:-3px; background:var(--face); border:1px solid; border-color:var(--hl) var(--dsh) var(--dsh) var(--hl); box-shadow:2px 2px 6px rgba(0,0,0,.35); z-index:121; min-width:150px; padding:2px; }

.toolbar { display:flex; align-items:center; gap:1px; background:var(--face); padding:2px 4px; border-top:1px solid var(--sh); border-bottom:1px solid var(--sh); flex-wrap:nowrap; }
.tb-btn {
  display:flex; align-items:center; gap:4px; padding:2px 5px; background:transparent; border:1px solid transparent; cursor:pointer; white-space:nowrap;
}
.tb-btn:hover { border-top:1px solid var(--hl); border-left:1px solid var(--hl); border-right:1px solid var(--dsh); border-bottom:1px solid var(--dsh); }
.tb-btn:active { border-top:1px solid var(--dsh); border-left:1px solid var(--dsh); border-right:1px solid var(--hl); border-bottom:1px solid var(--hl); background:#dfdfdf; }
.tb-btn:disabled { color:#8a8a8a; }
.tb-btn:disabled:hover { border:1px solid transparent; background:transparent; }
.tb-btn-sq { padding:2px 4px; }
.tb-sep { width:2px; height:22px; margin:0 4px; background:var(--sh); border-right:1px solid var(--hl); }
.tb-spacer { flex:1; }
.tb-search { display:flex; align-items:center; position:relative; }
.tb-input {
  width:230px; height:20px; padding:1px 4px; font-size:11px;
  border-top:2px solid var(--dsh); border-left:2px solid var(--dsh); border-right:2px solid var(--hl); border-bottom:2px solid var(--hl);
  outline:none; background:#fff;
}
.typedown {
  position:absolute; top:22px; left:0; width:340px; background:var(--face); z-index:150;
  border:1px solid; border-color:var(--hl) var(--dsh) var(--dsh) var(--hl); box-shadow:3px 3px 8px rgba(0,0,0,.35); padding:1px;
}
.td-item { padding:4px 6px; cursor:pointer; display:flex; gap:6px; align-items:center; white-space:nowrap; }
.td-item.sel { background:var(--navy); color:#fff; }
.td-item .td-type { font-size:9px; border:1px solid currentColor; padding:0 3px; opacity:.9; }
.td-item .td-title { font-weight:bold; }
.td-item .td-sub { opacity:.75; font-size:10px; overflow:hidden; text-overflow:ellipsis; }
.td-empty { padding:6px; color:#5a5a5a; font-style:italic; }
.td-hit { background:#ffff00; color:#000; }

.client { flex:1; position:relative; min-height:0; background:var(--face); padding:4px; }
.viewport { position:absolute; inset:0; margin:4px; background:#fff; border:2px solid; border-color:var(--dsh) var(--hl) var(--hl) var(--dsh); overflow:auto; }

.statusbar { display:flex; align-items:center; gap:2px; background:var(--face); padding:2px 20px 2px 3px; border-top:2px solid var(--hl); height:22px; }
.resize-grip {
  position:absolute; right:2px; bottom:2px; width:16px; height:16px; cursor:nwse-resize; z-index:10;
  background:repeating-linear-gradient(45deg, transparent 0 2px, var(--sh) 2px 3px, transparent 3px 5px, var(--sh) 5px 6px);
  opacity:.75;
}
.sb-seg { border-top:1px solid var(--sh); border-left:1px solid var(--sh); border-right:1px solid var(--hl); border-bottom:1px solid var(--hl); padding:1px 8px; background:var(--face); height:18px; line-height:14px; font-size:11px; }
.sb-msg { flex:1; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.sb-info { max-width:200px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.sb-progress { width:110px; padding:2px; }
.sb-prog-fill { height:100%; width:0%; background:repeating-linear-gradient(90deg,#1084d0 0 6px,#0060a0 6px 12px); transition:width .2s linear; }
.sb-prog-fill.indet { animation:indet 1.2s linear infinite; }
@keyframes indet { 0% { margin-left:0; width:20%; } 50% { margin-left:80%; width:20%; } 100% { margin-left:0; width:20%; } }
.sb-cd, .sb-sound { cursor:pointer; }
.sb-cd:active, .sb-sound:active { border-top:1px solid var(--hl); border-left:1px solid var(--hl); border-right:1px solid var(--sh); border-bottom:1px solid var(--sh); }

/* ============ VIEWS ============ */
.view { min-height:100%; background:#fff; }
.view.busy { cursor:wait; }
body.busy, body.busy * { cursor:wait !important; }

/* -- welcome -- */
.welcome { background:#fff; padding:34px 46px; }
.welcome-masthead { text-align:center; border-bottom:2px solid var(--navy); padding-bottom:18px; margin-bottom:22px; }
.wm-globe { width:86px; height:86px; margin:0 auto 10px; border-radius:50%; background:radial-gradient(circle at 35% 30%, #e8e8ff, #9ab0dc 55%, #2a3a70); display:flex; align-items:center; justify-content:center; box-shadow:inset -8px -10px 18px rgba(0,0,60,.45); }
.wm-eb { font-family:Georgia, serif; font-size:30px; font-weight:bold; color:#101c60; }
.wm-title { font-family:Georgia, "Times New Roman", serif; font-size:34px; font-weight:bold; letter-spacing:2px; color:#0a1460; }
.wm-sub { font-family:Georgia, serif; font-size:13px; font-style:italic; color:#444; margin-top:6px; }
.wm-date { font-size:11px; color:#666; margin-top:4px; }
.welcome-cols { display:flex; gap:26px; }
.wcol-main { flex:1.6; }
.wcol-side { flex:1; }
.w-card { border:1px solid #a0a0a0; margin-bottom:14px; background:#fafafa; }
.w-card-h { background:linear-gradient(90deg,#e8ecf8,#f8f8ff); border-bottom:1px solid #a0a0a0; padding:4px 10px; font-weight:bold; font-size:11px; color:#203060; display:flex; align-items:center; gap:6px; }
.w-card-b { padding:10px 12px; }
.w-aotd-title { font-family:Georgia, serif; font-size:19px; font-weight:bold; color:#0a1460; margin-bottom:4px; }
.w-aotd-title a { color:#0a1460; text-decoration:none; }
.w-aotd-title a:hover { text-decoration:underline; }
.w-aotd-sum { font-family:Georgia, serif; font-size:13px; line-height:1.5; color:#222; }
.w-quick { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.w-quick-btn {
  display:flex; align-items:center; gap:8px; padding:8px; border:1px solid #a0a0a0; background:#f4f4f4; cursor:pointer; text-align:left;
  font-size:11px;
}
.w-quick-btn:hover { background:#e8ecf8; }
.w-quick-btn:active { border-style:inset; }
.w-feature-title { font-size:11px; font-weight:bold; }
.w-feature-sub { font-size:10px; color:#666; }
.w-stats { font-size:10px; color:#666; text-align:center; padding:8px 0 2px; border-top:1px solid #ddd; margin-top:18px; }

/* -- article -- */
.article { max-width:860px; margin:0 auto; padding:26px 34px 40px; font-family:"Times New Roman", Times, Georgia, serif; }
.art-head { border-bottom:2px solid #000; padding-bottom:12px; margin-bottom:14px; }
.art-kicker { font-size:11px; letter-spacing:2px; color:#666; font-family:Arial, sans-serif; text-transform:uppercase; }
.art-title { font-size:32px; font-weight:bold; line-height:1.15; color:#000; margin-top:2px; }
.art-dates { font-family:Georgia, serif; font-size:14px; font-style:italic; color:#555; margin-top:4px; }
.art-factbox {
  float:right; width:260px; margin:0 0 14px 18px; background:#f2f0ea; border:1px solid #b8b4a8; font-size:12.5px;
}
.art-factbox table { width:100%; border-collapse:collapse; }
.art-factbox td { padding:5px 8px; border-bottom:1px solid #ddd8cc; vertical-align:top; }
.art-factbox td.fb-k { font-weight:bold; white-space:nowrap; width:1%; padding-right:10px; color:#3a3a3a; }
.art-factbox .fb-h { background:#e4e0d4; font-weight:bold; padding:5px 8px; border-bottom:1px solid #b8b4a8; }
.art-factbox .fb-foot { font-size:10.5px; color:#777; padding:6px 8px; }
.art-lead p { font-size:16.5px; line-height:1.55; margin-bottom:12px; text-align:justify; }
.art-body p { font-size:14.5px; line-height:1.5; margin-bottom:10px; text-align:justify; }
.art-body h2 { font-size:19px; font-weight:bold; margin:22px 0 8px; padding-bottom:2px; border-bottom:1px solid #999; }
.art-body .art-section { clear:both; }
.art-media { margin:10px 0; }
.art-media.float-right { float:right; width:250px; margin:4px 0 10px 16px; }
.art-media.float-left { float:left; width:250px; margin:4px 16px 10px 0; }
.art-media img, .art-media svg { width:100%; border:1px solid #999; background:#fff; cursor:pointer; }
.art-media .am-cap { font-size:11px; line-height:1.35; color:#444; margin-top:3px; text-align:justify; }
.art-media .am-cap b { display:block; font-size:10px; letter-spacing:1px; color:#666; }
a.artlink { color:#0000ee; text-decoration:underline; cursor:pointer; }
a.artlink:visited { color:#551a8b; }
a.artlink:hover { color:#ff0000; }
.art-seealso { clear:both; margin-top:22px; border:1px solid #b8b4a8; background:#f7f5f0; padding:10px 14px; }
.art-seealso h3 { font-size:12px; letter-spacing:1px; text-transform:uppercase; color:#333; margin-bottom:6px; font-family:Arial, sans-serif; }
.art-seealso .as-link { display:inline-block; margin:2px 8px 2px 0; }
.art-foot { margin-top:26px; padding-top:10px; border-top:1px solid #bbb; font-size:11px; color:#777; font-family:Arial, sans-serif; line-height:1.6; }
.art-foot .af-fav { display:inline-block; margin-left:8px; }
.art-zoom { font-size:11px; font-family:Arial, sans-serif; color:#666; text-align:right; margin-bottom:6px; }
.art-zoom button { font-size:11px; margin-left:4px; }

/* -- search results -- */
.search-view { max-width:860px; margin:0 auto; padding:22px 30px; }
.sv-head { margin-bottom:14px; }
.sv-q { width:100%; font-size:14px; padding:4px 6px; border:1px solid #888; font-family:Georgia, serif; }
.sv-sum { font-size:11px; color:#555; margin-top:6px; font-family:Arial, sans-serif; }
.sv-refine { margin-top:6px; font-size:11px; font-family:Arial, sans-serif; }
.result { padding:8px 10px; border-bottom:1px solid #e0e0e0; cursor:pointer; }
.result:hover { background:#eef2fa; }
.result .r-top { display:flex; gap:8px; align-items:baseline; }
.result .r-rank { font-size:10px; color:#888; font-family:Arial, sans-serif; width:34px; flex:none; }
.result .r-title { font-family:Georgia, serif; font-size:16px; font-weight:bold; color:#0a1460; }
.result .r-type { font-size:9px; border:1px solid #999; padding:0 4px; color:#555; font-family:Arial, sans-serif; text-transform:uppercase; }
.result .r-sum { font-family:Georgia, serif; font-size:12.5px; color:#333; margin-top:2px; line-height:1.4; }
.result .r-bar { width:140px; height:6px; border:1px solid #999; background:#eee; margin-top:4px; }
.result .r-bar i { display:block; height:100%; background:linear-gradient(90deg,#6a8ad0,#304a90); }
.no-results { text-align:center; padding:60px 30px; }
.nr-title { font-family:Georgia, serif; font-size:24px; color:#444; }
.nr-q { font-family:Georgia, serif; font-size:18px; font-style:italic; color:#0a1460; }
.nr-tips { text-align:left; max-width:420px; margin:22px auto 0; font-size:12px; color:#333; font-family:Arial, sans-serif; }
.nr-tips li { margin:6px 0; }
.nr-dym { margin-top:18px; font-size:13px; font-family:Arial, sans-serif; }
.nr-dym a { color:#0000ee; cursor:pointer; }

/* -- browse -- */
.browse { display:flex; height:100%; }
.browse-tree { width:270px; min-width:200px; border-right:2px solid; border-color:var(--dsh) var(--hl); background:#f4f4f4; overflow:auto; padding:6px; }
.browse-tree h4 { font-size:11px; color:#333; margin:4px 2px; font-family:Arial, sans-serif; }
.tree-node { font-size:12px; font-family:Arial, sans-serif; }
.tree-row { display:flex; align-items:center; gap:3px; padding:2px 4px; cursor:pointer; white-space:nowrap; }
.tree-row:hover { background:#e0e6f4; }
.tree-row.sel { background:var(--navy); color:#fff; }
.tree-twist { width:12px; text-align:center; font-size:9px; color:#666; flex:none; }
.tree-row.sel .tree-twist { color:#fff; }
.tree-leaf { font-family:Georgia, serif; }
.tree-count { font-size:10px; color:#888; margin-left:4px; }
.browse-content { flex:1; overflow:auto; background:#fff; }

/* -- index -- */
.index-view { display:flex; flex-direction:column; height:100%; }
.idx-tabs { display:flex; gap:2px; padding:8px 10px 6px; border-bottom:2px solid var(--navy); background:#fff; flex-wrap:wrap; }
.idx-tab { width:26px; height:24px; border:1px solid #999; background:#eee; cursor:pointer; font-size:11px; font-family:Georgia, serif; }
.idx-tab:hover { background:#fff; }
.idx-tab.sel { background:var(--navy); color:#fff; border-color:var(--navy); }
.idx-body { flex:1; overflow:auto; padding:10px 22px; }
.idx-head { font-size:11px; color:#666; margin-bottom:8px; font-family:Arial, sans-serif; }
.idx-entry { padding:2px 0; cursor:pointer; font-family:Georgia, serif; font-size:13px; display:flex; gap:8px; }
.idx-entry:hover { background:#eef2fa; }
.idx-entry .ie-term { font-weight:bold; color:#0a1460; }
.idx-entry .ie-see { font-style:italic; color:#555; }
.idx-entry .ie-see b { color:#0a1460; font-weight:bold; font-style:normal; }

/* -- atlas -- */
.atlas { display:flex; height:100%; }
.atlas-side { width:250px; min-width:190px; border-right:2px solid; border-color:var(--dsh) var(--hl); background:#f4f4f4; display:flex; flex-direction:column; }
.atlas-regions { display:flex; flex-wrap:wrap; gap:3px; padding:6px; border-bottom:1px solid #c0c0c0; }
.region-btn { font-size:10px; padding:2px 6px; border:1px solid #999; background:#fff; cursor:pointer; }
.region-btn:hover { background:#eef2fa; }
.region-btn.sel { background:var(--navy); color:#fff; border-color:var(--navy); }
.atlas-filter { padding:6px; }
.atlas-filter input { width:100%; font-size:11px; padding:2px 4px; border:1px solid #888; }
.atlas-list { flex:1; overflow:auto; padding:2px 4px 8px; }
.atlas-country { padding:3px 6px; cursor:pointer; font-size:12px; display:flex; align-items:center; gap:6px; white-space:nowrap; }
.atlas-country:hover { background:#e0e6f4; }
.atlas-country.sel { background:var(--navy); color:#fff; }
.atlas-country .flag-mini { width:22px; height:14px; flex:none; border:1px solid #888; }
.atlas-main { flex:1; display:flex; flex-direction:column; background:#a8c8e0; }
.atlas-toolbar { display:flex; gap:4px; padding:4px 6px; background:#d8e4ee; border-bottom:1px solid #888; align-items:center; }
.atlas-zoombtn { width:22px; height:20px; border:1px solid #666; background:#fff; cursor:pointer; font-weight:bold; font-size:12px; }
.atlas-zoombtn:hover { background:#eef2fa; }
.atlas-toolbar .at-label { font-size:11px; color:#333; }
.atlas-canvas-wrap { flex:1; position:relative; overflow:hidden; }
.atlas-canvas { position:absolute; cursor:pointer; }
.atlas-status { font-size:11px; padding:2px 8px; background:#d8e4ee; border-top:1px solid #888; color:#222; }
.atlas-countryview { background:#fff; max-width:860px; margin:0 auto; padding:24px 32px; }
.ac-head { border-bottom:2px solid #000; padding-bottom:10px; margin-bottom:12px; }
.ac-title { font-family:Georgia, serif; font-size:28px; font-weight:bold; }
.ac-flag { display:flex; align-items:center; gap:12px; }
.ac-flag canvas { border:1px solid #999; }
.ac-flag .ac-flag-name { font-family:Arial, sans-serif; font-size:12px; color:#555; }
.ac-prose { font-family:Georgia, serif; font-size:14.5px; line-height:1.5; text-align:justify; margin-bottom:14px; }
.ac-prose .ac-flag-inline { float:right; margin:0 0 10px 16px; }
.ac-facts { border:1px solid #b8b4a8; background:#f7f5f0; margin-top:14px; }
.ac-facts table { width:100%; border-collapse:collapse; }
.ac-facts td { padding:5px 9px; border-bottom:1px solid #ddd8cc; font-size:12.5px; font-family:Georgia, serif; }
.ac-facts td.fb-k { font-weight:bold; width:1%; white-space:nowrap; color:#3a3a3a; }
.ac-links { margin-top:14px; font-family:Arial, sans-serif; font-size:12px; }
.ac-map { margin-top:16px; border:1px solid #999; }
.ac-map canvas { display:block; width:100%; }

/* -- timeline -- */
.timeline { display:flex; flex-direction:column; height:100%; }
.tl-head { background:#f4f4f4; border-bottom:1px solid #999; padding:8px 14px; }
.tl-era-row, .tl-cat-row { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.tl-label { font-size:10px; color:#666; width:52px; font-family:Arial, sans-serif; }
.tl-chip { font-size:10.5px; padding:2px 8px; border:1px solid #999; background:#fff; cursor:pointer; }
.tl-chip:hover { background:#eef2fa; }
.tl-chip.sel { background:var(--navy); color:#fff; border-color:var(--navy); }
.tl-year-readout { font-size:11px; color:#333; margin-top:6px; font-family:Arial, sans-serif; }
.tl-body { flex:1; overflow:auto; background:#fff; }
.tl-list { max-width:760px; margin:0 auto; padding:14px 20px 30px; }
.tl-century { font-family:Georgia, serif; font-size:16px; font-weight:bold; color:#0a1460; margin:18px 0 6px; border-bottom:1px solid #ccc; }
.tl-event { display:flex; gap:10px; padding:3px 0; border-bottom:1px dotted #ddd; }
.tl-year { width:64px; flex:none; font-family:Georgia, serif; font-size:13px; font-weight:bold; color:#333; text-align:right; padding-top:1px; }
.tl-text { font-family:Georgia, serif; font-size:13.5px; line-height:1.4; color:#222; }
.tl-cat { font-size:9px; border:1px solid #aaa; padding:0 4px; color:#666; font-family:Arial, sans-serif; text-transform:uppercase; align-self:center; }
.tl-empty { text-align:center; padding:50px; color:#666; font-family:Georgia, serif; font-style:italic; font-size:15px; }

/* -- gallery -- */
.gallery { display:flex; flex-direction:column; height:100%; }
.gal-cats { display:flex; gap:5px; padding:8px 12px; border-bottom:1px solid #999; background:#f4f4f4; flex-wrap:wrap; }
.gal-grid { flex:1; overflow:auto; padding:14px; background:#fff; }
.gal-grid-inner { display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:14px; max-width:1100px; margin:0 auto; }
.gal-item { cursor:pointer; text-align:center; }
.gal-item:hover .gal-thumb { border-color:var(--navy); }
.gal-thumb {
  height:120px; border:1px solid #999; background:#eee; display:flex; align-items:center; justify-content:center; overflow:hidden;
  position:relative;
}
.gal-thumb img, .gal-thumb svg { max-width:100%; max-height:100%; }
.gal-title { font-size:11px; margin-top:4px; color:#333; font-family:Arial, sans-serif; line-height:1.3; }
.gal-kind { font-size:9px; color:#888; text-transform:uppercase; }
.gal-thumb .gal-ph { color:#888; font-size:10px; padding:10px; font-family:'Courier New', monospace; }
.gal-count { font-size:10.5px; color:#555; padding:8px 12px 2px; font-family:Arial, sans-serif; }

/* -- viewer -- */
.viewer { display:flex; flex-direction:column; height:100%; background:#3a3a40; }
.vw-toolbar { display:flex; align-items:center; gap:4px; padding:4px 8px; background:#f4f4f4; border-bottom:1px solid #888; }
.vw-stage { flex:1; display:flex; align-items:center; justify-content:center; overflow:hidden; position:relative; }
.vw-stage img, .vw-stage svg { max-width:92%; max-height:88%; border:1px solid #000; background:#fff; transition:transform .15s; }
.vw-stage .vw-noprev {
  width:70%; max-width:560px; border:2px solid #666; background:#1c1c22; color:#c8c8c8; text-align:center; padding:30px;
  font-family:'Courier New', monospace; font-size:13px; line-height:1.7;
}
.vw-noprev .np-title { font-size:15px; color:#fff; margin-bottom:10px; }
.vw-noprev .np-frame { border:1px solid #555; padding:10px; margin:12px 0; }
.vw-noprev .np-frame .np-btn { display:inline-block; border:1px solid #888; padding:2px 14px; margin-top:8px; color:#aaa; }
.vw-noprev .np-note { color:#777; font-size:11px; }
.vw-caption { background:#f4f4f4; border-top:1px solid #888; padding:6px 12px; font-family:Georgia, serif; font-size:13px; color:#222; }
.vw-caption .vw-credit { font-family:Arial, sans-serif; font-size:10.5px; color:#666; }
.vw-slidebar { height:4px; background:#888; }
.vw-slidebar i { display:block; height:100%; width:0%; background:#c0392b; }

/* -- favorites -- */
.fav-view { max-width:760px; margin:0 auto; padding:22px 30px; }
.fav-row { display:flex; align-items:center; gap:10px; padding:6px 8px; border-bottom:1px solid #e0e0e0; cursor:pointer; }
.fav-row:hover { background:#eef2fa; }
.fav-row .f-title { font-family:Georgia, serif; font-size:15px; font-weight:bold; color:#0a1460; flex:1; }
.fav-row .f-date { font-size:10.5px; color:#888; font-family:Arial, sans-serif; }
.fav-row .f-remove { font-size:10px; border:1px solid #999; padding:1px 6px; background:#fff; cursor:pointer; }
.fav-empty { text-align:center; padding:60px 20px; color:#666; font-family:Georgia, serif; font-style:italic; font-size:16px; }
.fav-tools { margin-top:14px; display:flex; gap:8px; }
.fav-tools button { font-size:11px; padding:3px 10px; border:1px solid #888; background:#eee; cursor:pointer; }
.fav-tools button:hover { background:#fff; }

/* -- print preview -- */
.pp-view { display:flex; flex-direction:column; height:100%; background:#6a6a6a; }
.pp-toolbar { display:flex; gap:6px; align-items:center; padding:5px 10px; background:#f4f4f4; border-bottom:1px solid #888; }
.pp-toolbar button { font-size:11px; padding:2px 10px; border:1px solid #888; background:#eee; cursor:pointer; }
.pp-toolbar button:hover { background:#fff; }
.pp-toolbar select { font-size:11px; }
.pp-stage { flex:1; overflow:auto; display:flex; flex-direction:column; align-items:center; gap:12px; padding:16px; }
.pp-page {
  width:680px; min-height:860px; background:#fff; box-shadow:0 2px 10px rgba(0,0,0,.5);
  padding:56px 64px; position:relative; font-family:"Times New Roman", Times, serif;
}
.pp-page .pp-hdr { font-size:10px; letter-spacing:2px; color:#555; border-bottom:1px solid #999; padding-bottom:4px; margin-bottom:16px; display:flex; justify-content:space-between; font-family:Arial, sans-serif; }
.pp-page .pp-ftr { position:absolute; bottom:36px; left:64px; right:64px; font-size:10px; color:#555; border-top:1px solid #999; padding-top:4px; display:flex; justify-content:space-between; font-family:Arial, sans-serif; }
.pp-cnt { font-size:11px; color:#ccc; font-family:Arial, sans-serif; }

/* -- readme -- */
.readme { max-width:780px; margin:0 auto; padding:20px 30px; font-family:'Courier New', Courier, monospace; font-size:12.5px; line-height:1.55; color:#1a1a1a; }
.readme h1 { font-size:17px; font-weight:bold; margin-bottom:4px; }
.readme h2 { font-size:14px; font-weight:bold; margin:18px 0 4px; border-bottom:1px solid #aaa; padding-bottom:2px; }
.readme .rm-note { background:#ffffe0; border:1px solid #cc0; padding:8px 10px; margin:10px 0; }

/* -- dialogs -- */
.dlg-layer { position:fixed; inset:0; background:rgba(0,0,0,.12); z-index:300; display:flex; align-items:center; justify-content:center; }
.dlg {
  background:var(--face); min-width:320px; max-width:520px;
  border:2px solid; border-color:var(--hl) var(--dsh) var(--dsh) var(--hl);
  outline:1px solid #000; outline-offset:-4px; box-shadow:4px 4px 14px rgba(0,0,0,.4);
}
.dlg-title { height:20px; background:linear-gradient(90deg,var(--navy),var(--navy2)); color:#fff; font-weight:bold; font-size:11px; display:flex; align-items:center; padding-left:6px; }
.dlg-body { padding:16px 18px; font-size:12px; }
.dlg-body .dlg-icon { float:left; width:36px; height:36px; margin-right:12px; }
.dlg-btns { display:flex; justify-content:center; gap:10px; padding:8px 0 14px; }
.dlg-btns button {
  min-width:80px; padding:3px 10px; background:var(--face); cursor:pointer; font-size:11px;
  border-top:2px solid var(--hl); border-left:2px solid var(--hl); border-right:2px solid var(--dsh); border-bottom:2px solid var(--dsh);
}
.dlg-btns button:active { border-top:2px solid var(--dsh); border-left:2px solid var(--dsh); border-right:2px solid var(--hl); border-bottom:2px solid var(--hl); }
.dlg-btns button.def { font-weight:bold; }
.dlg-field { margin:10px 0; }
.dlg-field input[type=text] { width:100%; border:1px solid #888; padding:3px 5px; font-size:12px; }
.about-box { width:420px; }
.about-main { padding:14px 18px; }
.about-logo { display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.about-globe { width:64px; height:64px; border-radius:50%; background:radial-gradient(circle at 35% 30%, #e8e8ff, #9ab0dc 55%, #2a3a70); display:flex; align-items:center; justify-content:center; box-shadow:inset -6px -8px 14px rgba(0,0,60,.45); }
.about-globe span { font-family:Georgia, serif; font-weight:bold; font-size:22px; color:#101c60; }
.about-title { font-family:Georgia, serif; font-size:20px; font-weight:bold; color:#0a1460; }
.about-sub { font-size:11px; color:#555; margin-top:2px; }
.about-text { font-size:11px; line-height:1.6; color:#222; }
.about-credits { font-size:10.5px; color:#666; margin-top:8px; }
.about-legal { font-size:10px; color:#888; margin-top:10px; border-top:1px solid #ccc; padding-top:8px; line-height:1.5; }
.about-btns { display:flex; justify-content:center; padding:6px 0 14px; }

/* -- eject / disc screen -- */
.discscreen { height:100%; background:#000; display:flex; flex-direction:column; align-items:center; justify-content:center; color:#c8d8f0; font-family:'Courier New', monospace; }
.discscreen .ds-disc { width:150px; height:150px; border-radius:50%; background:repeating-conic-gradient(#9aa4b2 0deg 6deg, #7d8796 6deg 12deg); position:relative; box-shadow:0 0 40px rgba(160,190,255,.3); }
.discscreen .ds-disc::after { content:""; position:absolute; inset:56px; border-radius:50%; background:#0a0c10; }
.discscreen .ds-title { font-size:20px; margin-top:30px; color:#fff; }
.discscreen .ds-msg { font-size:13px; margin-top:8px; color:#8ab0e0; }
.discscreen .ds-btn { margin-top:26px; font-size:13px; padding:6px 22px; border:1px solid #6a7ab0; color:#c8d8f0; cursor:pointer; }
.discscreen .ds-btn:hover { background:#1a2440; }

/* -- context menu -- */
.ctx-menu { position:fixed; background:var(--face); z-index:400; min-width:170px; border:1px solid; border-color:var(--hl) var(--dsh) var(--dsh) var(--hl); box-shadow:3px 3px 8px rgba(0,0,0,.4); padding:2px; }
.ctx-item { padding:4px 10px; cursor:pointer; }
.ctx-item:hover { background:var(--navy); color:#fff; }
.ctx-sep { border-top:1px solid var(--sh); border-bottom:1px solid var(--hl); margin:2px 4px; }

/* -- misc -- */
.ebmono { font-family:Georgia, serif; font-weight:bold; }
.bigclock { font-family:Georgia, serif; font-size:22px; color:#0a1460; }
.center { text-align:center; }
.hidden { display:none !important; }

/* icons (16px pixel-ish) */
.tb-ico { display:inline-block; width:16px; height:16px; background-size:16px 16px; }
.ico-back { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect width='16' height='16' fill='%23c0c0c0'/%3E%3Cpath d='M2 3 L7 3 L7 5 L4 5 L4 7 L7 7 L7 9 L4 9 L4 11 L7 11 L7 13 L2 13 Z' fill='%23000000'/%3E%3Cpath d='M8 8 L14 4 L14 12 Z' fill='%23000000'/%3E%3C/svg%3E"); }
.ico-fwd { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect width='16' height='16' fill='%23c0c0c0'/%3E%3Cpath d='M14 3 L9 3 L9 5 L12 5 L12 7 L9 7 L9 9 L12 9 L12 11 L9 11 L9 13 L14 13 Z' fill='%23000000'/%3E%3Cpath d='M8 8 L2 4 L2 12 Z' fill='%23000000'/%3E%3C/svg%3E"); }
.ico-home { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect width='16' height='16' fill='%23c0c0c0'/%3E%3Cpath d='M3 8 L8 3 L13 8 L13 13 L10 13 L10 9 L6 9 L6 13 L3 13 Z' fill='%23f4c430'/%3E%3Cpath d='M8 3 L8 1 M6 5 L6 3' stroke='%23553a00' stroke-width='1'/%3E%3C/svg%3E"); }
.ico-find { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect width='16' height='16' fill='%23c0c0c0'/%3E%3Ccircle cx='7' cy='7' r='4' fill='%23fff' stroke='%23000'/%3E%3Cpath d='M10 10 L14 14' stroke='%23000' stroke-width='2'/%3E%3C/svg%3E"); }
.ico-book { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect width='16' height='16' fill='%23c0c0c0'/%3E%3Crect x='3' y='2' width='10' height='12' fill='%23f4c430' stroke='%23000'/%3E%3Cpath d='M5 4 L11 4 M5 6 L11 6 M5 8 L11 8 M5 10 L9 10' stroke='%23000'/%3E%3C/svg%3E"); }
.ico-index { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect width='16' height='16' fill='%23c0c0c0'/%3E%3Crect x='2' y='2' width='4' height='12' fill='%23fff' stroke='%23000'/%3E%3Crect x='8' y='2' width='6' height='12' fill='%23fff' stroke='%23000'/%3E%3Cpath d='M3 4 L5 4 M3 7 L5 7 M3 10 L5 10 M9 4 L13 4 M9 7 L13 7 M9 10 L13 10' stroke='%23000'/%3E%3C/svg%3E"); }
.ico-globe { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect width='16' height='16' fill='%23c0c0c0'/%3E%3Ccircle cx='8' cy='8' r='6' fill='%233a7ac0' stroke='%23000'/%3E%3Cpath d='M2 8 L14 8 M8 2 A10 6 0 0 1 8 14 A10 6 0 0 1 8 2' fill='none' stroke='%2358c858'/%3E%3C/svg%3E"); }
.ico-clock { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect width='16' height='16' fill='%23c0c0c0'/%3E%3Ccircle cx='8' cy='8' r='6' fill='%23fff' stroke='%23000'/%3E%3Cpath d='M8 3 L8 8 L11 10' fill='none' stroke='%23000' stroke-width='1.4'/%3E%3C/svg%3E"); }
.ico-media { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect width='16' height='16' fill='%23c0c0c0'/%3E%3Crect x='2' y='4' width='12' height='8' fill='%23000'/%3E%3Crect x='4' y='6' width='4' height='4' fill='%23f4c430'/%3E%3Ccircle cx='10' cy='8' r='2' fill='%2333a033'/%3E%3C/svg%3E"); }
.ico-star { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect width='16' height='16' fill='%23c0c0c0'/%3E%3Cpath d='M8 2 L10 6 L14 6.5 L11 9.5 L11.8 13.5 L8 11.2 L4.2 13.5 L5 9.5 L2 6.5 L6 6 Z' fill='%23f4c430' stroke='%23000'/%3E%3C/svg%3E"); }
.ico-dice { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect width='16' height='16' fill='%23c0c0c0'/%3E%3Crect x='2' y='2' width='12' height='12' fill='%23fff' stroke='%23000'/%3E%3Ccircle cx='5.5' cy='5.5' r='1' fill='%23000'/%3E%3Ccircle cx='10.5' cy='5.5' r='1' fill='%23000'/%3E%3Ccircle cx='5.5' cy='10.5' r='1' fill='%23000'/%3E%3Ccircle cx='10.5' cy='10.5' r='1' fill='%23000'/%3E%3C/svg%3E"); }
.ico-print { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect width='16' height='16' fill='%23c0c0c0'/%3E%3Crect x='3' y='2' width='10' height='4' fill='%23fff' stroke='%23000'/%3E%3Crect x='2' y='6' width='12' height='5' fill='%23fff' stroke='%23000'/%3E%3Crect x='4' y='11' width='8' height='3' fill='%23fff' stroke='%23000'/%3E%3C/svg%3E"); }
.ico-sound { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect width='16' height='16' fill='%23c0c0c0'/%3E%3Cpath d='M2 6 L5 6 L9 3 L9 13 L5 10 L2 10 Z' fill='%23000'/%3E%3Cpath d='M11 5 A4 4 0 0 1 11 11 M13 3 A7 7 0 0 1 13 13' fill='none' stroke='%23000'/%3E%3C/svg%3E"); }
.ico-sound.off { filter:grayscale(1); opacity:.6; }
.ico-cd { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Ccircle cx='20' cy='20' r='19' fill='%237d8796' stroke='%232a2a2a'/%3E%3Ccircle cx='20' cy='20' r='19' fill='url(%23cd)'/%3E%3Cdefs%3E%3Cpattern id='cd' width='8' height='8' patternUnits='userSpaceOnUse'%3E%3Crect width='8' height='8' fill='%239aa4b2'/%3E%3Crect width='4' height='8' fill='%237d8796'/%3E%3C/pattern%3E%3C/defs%3E%3Ccircle cx='20' cy='20' r='8' fill='%230a0c10'/%3E%3Ccircle cx='20' cy='20' r='3.4' fill='%234a5a8a'/%3E%3Ctext x='20' y='27' text-anchor='middle' font-size='7' font-family='Arial' fill='%23c8d8f0'%3E97%3C/text%3E%3C/svg%3E"); background-size:40px 40px; }
.ico-readme { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Crect width='40' height='40' fill='transparent'/%3E%3Crect x='7' y='4' width='26' height='32' fill='%23fff' stroke='%23000'/%3E%3Crect x='9' y='6' width='22' height='4' fill='%23c0392b'/%3E%3Cpath d='M11 14 L31 14 M11 18 L31 18 M11 22 L31 22 M11 26 L24 26' stroke='%23000'/%3E%3C/svg%3E"); background-size:40px 40px; }
.ico-info { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Ccircle cx='20' cy='20' r='18' fill='%23f4c430' stroke='%23000'/%3E%3Ctext x='20' y='28' text-anchor='middle' font-size='22' font-weight='bold' font-family='Georgia' fill='%23000'%3Ei%3C/text%3E%3C/svg%3E"); background-size:40px 40px; }
.ico-power { background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Ccircle cx='20' cy='20' r='18' fill='%23c0392b' stroke='%23000'/%3E%3Cpath d='M20 8 L20 22 M14 12 A11 11 0 1 0 26 12' fill='none' stroke='%23fff' stroke-width='3'/%3E%3C/svg%3E"); background-size:40px 40px; }

/* ============ PRINT ============ */
@media print {
  body > * { display:none !important; }
  #print-root { display:block !important; }
  .print-root { display:none; }
  .print-page { width:auto; padding:0; }
}
.print-root { display:none; }