/* Moneroute desktop: 1998 chrome, windows, taskbar, Start menu, first-screen placements, phone layout. Layout verbatim from the approved desktop design; brand colour is Monero orange. */
@font-face{font-family:"CMU Serif";src:url("../assets/fonts/cmunrm.woff") format("woff");font-weight:400;font-style:normal;font-display:block}
@font-face{font-family:"CMU Serif";src:url("../assets/fonts/cmunti.woff") format("woff");font-weight:400;font-style:italic;font-display:block}
@font-face{font-family:"CMU Serif";src:url("../assets/fonts/cmunbx.woff") format("woff");font-weight:700;font-style:normal;font-display:block}
@font-face{font-family:"CMU Typewriter";src:url("../assets/fonts/cmuntt.woff") format("woff");font-weight:400;font-style:normal;font-display:block}

:root{
  --face:#c0c0c0; --hi:#fff; --lt:#dfdfdf; --sh:#808080; --dk:#000;
  --xo:#ff6600; --xo-dk:#b34700;
  --desk:#ff6600;
  --sel:#000; --sel-t:#fff;
  --ui:"Microsoft Sans Serif", Tahoma, "MS Sans Serif", sans-serif;
  --ui-b:Tahoma, "Microsoft Sans Serif", sans-serif;
  --raised-win: inset -1px -1px var(--dk), inset 1px 1px var(--lt), inset -2px -2px var(--sh), inset 2px 2px var(--hi);
  --raised-btn: inset -1px -1px var(--dk), inset 1px 1px var(--hi), inset -2px -2px var(--sh), inset 2px 2px var(--lt);
  --pressed: inset -1px -1px var(--hi), inset 1px 1px var(--dk), inset -2px -2px var(--lt), inset 2px 2px var(--sh);
  --sunken: inset -1px -1px var(--hi), inset 1px 1px var(--sh), inset -2px -2px var(--lt), inset 2px 2px var(--dk);
  --shallow: inset -1px -1px var(--hi), inset 1px 1px var(--sh);
  --thin-up: inset -1px -1px var(--sh), inset 1px 1px var(--hi);
  --thin-dn: inset -1px -1px var(--hi), inset 1px 1px var(--sh);
  --checker: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='2' height='2' shape-rendering='crispEdges'><rect width='1' height='1' fill='%23ffffff'/><rect x='1' y='1' width='1' height='1' fill='%23ffffff'/></svg>");
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--desk);color:#000;font:11px/1.3 var(--ui);-webkit-text-size-adjust:100%}
img.px{image-rendering:pixelated}
button{font:inherit;color:inherit}
a{color:inherit}
:focus{outline:none}
:focus-visible{outline:1px dotted #000;outline-offset:-4px}

/* ---------- classic scrollbars ---------- */
.scroll::-webkit-scrollbar{width:16px;height:16px}
.scroll::-webkit-scrollbar-track{background:#c0c0c0 var(--checker)}
.scroll::-webkit-scrollbar-thumb{background:var(--face);box-shadow:var(--raised-win)}
.scroll::-webkit-scrollbar-corner{background:var(--face)}
.scroll::-webkit-scrollbar-button:single-button{display:block;width:16px;height:16px;background-color:var(--face);background-repeat:no-repeat;background-position:center;box-shadow:var(--raised-win)}
.scroll::-webkit-scrollbar-button:single-button:active{box-shadow:inset 0 0 0 1px var(--sh);background-position:calc(50% + 1px) calc(50% + 1px)}
.scroll::-webkit-scrollbar-button:single-button:vertical:decrement{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='7' height='4' shape-rendering='crispEdges'><path d='M3 0h1v1H3zM2 1h3v1H2zM1 2h5v1H1zM0 3h7v1H0z'/></svg>")}
.scroll::-webkit-scrollbar-button:single-button:vertical:increment{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='7' height='4' shape-rendering='crispEdges'><path d='M0 0h7v1H0zM1 1h5v1H1zM2 2h3v1H2zM3 3h1v1H3z'/></svg>")}
.scroll::-webkit-scrollbar-button:single-button:horizontal:decrement{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='4' height='7' shape-rendering='crispEdges'><path d='M3 0h1v7H3zM2 1h1v5H2zM1 2h1v3H1zM0 3h1v1H0z'/></svg>")}
.scroll::-webkit-scrollbar-button:single-button:horizontal:increment{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='4' height='7' shape-rendering='crispEdges'><path d='M0 0h1v7H0zM1 1h1v5H1zM2 2h1v3H2zM3 3h1v1H3z'/></svg>")}

/* ---------- desktop ---------- */
.desktop{position:relative;height:calc(100vh - 28px);min-height:600px;overflow:hidden}
.icons{position:absolute;left:6px;top:8px;display:flex;flex-direction:column;gap:10px;width:78px;z-index:1}
.dicon{display:flex;flex-direction:column;align-items:center;gap:4px;text-decoration:none;color:#fff;padding:2px 0;cursor:default;-webkit-tap-highlight-color:transparent}
.dicon .ic{position:relative;width:32px;height:32px;display:block}
.dicon .ic img{display:block}
.dicon .badge{position:absolute;right:-3px;bottom:-1px;width:16px;height:16px}
.dicon .lbl{font-size:11px;line-height:13px;text-align:center;padding:1px 2px;max-width:76px;text-shadow:1px 1px 0 #000}
.dicon.sel .ic .base{filter:brightness(.55)}
.dicon.sel .lbl{background:var(--sel);color:var(--sel-t);text-shadow:none}
.dicon:focus-visible{outline:none}
.dicon:focus-visible .lbl{outline:1px dotted #fff;outline-offset:0}
.watermark{position:absolute;left:100px;bottom:10px;color:#000;font-size:11px;line-height:15px;z-index:0}
.watermark img{height:22px;width:auto;vertical-align:bottom;margin-bottom:3px}

/* ---------- window chrome ---------- */
.win{position:absolute;background:var(--face);padding:3px;box-shadow:var(--raised-win);display:flex;flex-direction:column;min-width:0}
.win[hidden]{display:none}
.tb{display:flex;align-items:center;gap:3px;height:18px;flex:none;padding:0 2px;margin-bottom:1px;
  background:linear-gradient(90deg,#000 0%,var(--xo) 100%);color:#fff;font:bold 11px/1 var(--ui-b);user-select:none;-webkit-user-select:none}
.win:not(.active) .tb{background:linear-gradient(90deg,#808080 0%,#c0c0c0 100%);color:#d4d4d4}
.tb-ic{width:16px;height:16px;flex:none}
.tb-ic.brand{width:22px;height:22px;margin:-3px}
.tb-t{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-left:1px}
.tb-btns{display:flex;align-items:center;flex:none}
.tbb{width:16px;height:14px;padding:0;border:0;background:var(--face);box-shadow:var(--raised-btn);display:flex;align-items:center;justify-content:center;cursor:default}
.tbb svg{display:block;fill:#000}
.tbb[data-act="close"]{margin-left:2px}
.tbb[data-act="min"]{align-items:flex-end;padding-bottom:3px}
.tbb:active{box-shadow:var(--pressed)}
.tbb:active svg{transform:translate(1px,1px)}
.tbb:focus-visible{outline-offset:-3px}
.win.max{left:0 !important;top:0 !important;right:0 !important;bottom:0 !important;width:auto !important;height:auto !important}

.btn{min-width:75px;height:23px;padding:0 12px;border:0;background:var(--face);box-shadow:var(--raised-btn);cursor:default;white-space:nowrap;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;color:#000}
.btn:active{box-shadow:var(--pressed);padding:1px 11px 0 13px}
.btn.default{box-shadow:inset 0 0 0 1px var(--dk), inset -2px -2px var(--dk), inset 2px 2px var(--hi), inset -3px -3px var(--sh), inset 3px 3px var(--lt)}
.btn.default:active{box-shadow:inset 0 0 0 1px var(--dk), inset 0 0 0 2px var(--sh)}
.btn.default:focus-visible{outline-offset:-5px}
.field{min-width:0;height:21px;padding:3px 4px 2px;border:0;background:#fff;box-shadow:var(--sunken);font:11px var(--ui);color:#000}
.field:focus-visible{outline:none}
.groove{height:2px;flex:none;box-shadow:inset 0 1px var(--sh), inset 0 -1px var(--hi)}
.sb{display:flex;gap:2px;margin-top:2px;height:20px;flex:none}
.sbf{box-shadow:var(--thin-dn);padding:3px 5px;white-space:nowrap;overflow:hidden;display:flex;align-items:center;gap:4px;min-width:0}
.sbf.grow{flex:1}
.sbf img{width:16px;height:16px;flex:none;margin:-2px 0}
.win.nosb .sb{display:none}

/* menu bar and drop-down menus */
.mbar{display:flex;align-items:center;height:20px;flex:none;padding:0 1px}
.mb{height:18px;padding:0 6px;border:0;background:none;cursor:default;font:11px var(--ui)}
.mb:hover{box-shadow:var(--thin-up)}
.mb[aria-expanded="true"]{box-shadow:var(--thin-dn);padding:1px 5px 0 7px}
.mb:focus-visible{outline-offset:-2px}
.menu{position:fixed;z-index:3000;background:var(--face);box-shadow:var(--raised-win);padding:3px;min-width:168px}
.menu[hidden]{display:none}
.mi{display:flex;align-items:center;width:100%;height:20px;padding:0 26px 0 22px;border:0;background:none;text-align:left;font:11px var(--ui);cursor:default;position:relative;white-space:nowrap;color:#000}
.mi:hover,.mi:focus{background:var(--sel);color:var(--sel-t);outline:none}
.mi[aria-disabled="true"]{color:var(--sh);text-shadow:1px 1px var(--hi)}
.mi[aria-disabled="true"]:hover,.mi[aria-disabled="true"]:focus{color:var(--sh);text-shadow:none}
.mi .ck{position:absolute;left:8px;top:7px;display:none;fill:currentColor}
.mi[aria-checked="true"] .ck{display:block}
.msep{height:2px;margin:3px 1px;box-shadow:inset 0 1px var(--sh), inset 0 -1px var(--hi)}

/* ---------- welcome ---------- */
#w-welcome{width:756px}
.wl-head{background:#fff;display:flex;align-items:center;justify-content:space-between;padding:12px 14px 12px 20px;border-bottom:1px solid var(--hi);box-shadow:inset 0 -1px var(--sh)}
.wl-title{margin:0;font:22px/1 "Arial Black", "Arial Bold", sans-serif;letter-spacing:-.3px;color:#000}
.wl-head img{width:56px;height:56px;margin:-8px;flex:none}
.wl-body{display:grid;grid-template-columns:196px 1fr;gap:12px;padding:12px 12px 0}
.opts{display:flex;flex-direction:column;gap:6px}
.opt{display:flex;align-items:center;gap:10px;height:54px;width:100%;padding:0 10px;border:0;background:var(--face);box-shadow:var(--raised-btn);text-align:left;font:12px/1.2 var(--ui);cursor:default}
.opt img{flex:none}
.opt[aria-pressed="true"]{box-shadow:var(--pressed);background:var(--face) var(--checker);padding:1px 9px 0 11px;font-family:var(--ui-b);font-weight:bold}
.opt:active{box-shadow:var(--pressed)}
.pane-wrap{background:#fff;box-shadow:var(--sunken);padding:2px;display:flex}
.pane{padding:22px 24px 16px;display:flex;flex-direction:column;flex:1;min-height:244px}
.pane[hidden]{display:none}
.headline{margin:0 0 14px;font:28px/1.12 "Franklin Gothic Medium", "Trebuchet MS", Tahoma, sans-serif;letter-spacing:-.3px}
.headline span{display:block}
.pane p{margin:0 0 10px;font:13px/1.55 Tahoma, var(--ui);max-width:60ch}
.pane .lead{margin:0}
.ph{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.ph h2{margin:0;font:21px/1.15 "Franklin Gothic Medium", "Trebuchet MS", Tahoma, sans-serif}
.ph .step{display:block;font:11px/1.3 var(--ui);color:#404040;margin-top:2px}
.pane .fact{display:flex;align-items:center;gap:6px;font:11px/1.3 var(--ui);color:#000}
.pane .fact img{width:16px;height:16px}
.wiz{margin-top:auto;padding-top:10px;display:flex;justify-content:flex-end;gap:6px}
#w-welcome.wl-compact .wl-head{padding:8px 12px 8px 16px}
#w-welcome.wl-compact .wl-title{font-size:20px}
#w-welcome.wl-compact .wl-head img{width:48px;height:48px;margin:-7px}
#w-welcome.wl-compact .wl-body{grid-template-columns:176px 1fr;gap:10px;padding:10px 10px 0}
#w-welcome.wl-compact .opts{gap:5px}
#w-welcome.wl-compact .opt{height:46px;gap:8px}
#w-welcome.wl-compact .pane{padding:16px 18px 12px;min-height:199px}
#w-welcome.wl-compact .headline{font-size:24px;margin-bottom:10px}
#w-welcome.wl-compact .pane p{font-size:12px;line-height:1.5}
#w-welcome.wl-compact .ph h2{font-size:19px}
#w-welcome.wl-compact .group{margin:10px 10px 0;padding:6px 8px 7px}
#w-welcome.wl-compact .wl-foot{margin-top:10px;padding:8px 10px 8px}
.group{margin:12px 12px 0;padding:8px 10px 9px;border:1px solid var(--sh);box-shadow:inset 1px 1px var(--hi), 1px 1px var(--hi);position:relative}
.group legend{padding:0 3px;margin-left:-2px}
.ca-row{display:flex;align-items:center;gap:6px}
.ca-row label{flex:none;width:22px}
.ca-row .field{flex:1}
.note{margin:6px 0 0 28px}
.note a{color:#000}
.wl-foot{display:flex;align-items:center;gap:8px;margin:12px 0 0;padding:10px 12px 9px;box-shadow:inset 0 1px var(--sh), inset 0 2px var(--hi)}
.wl-foot .chk{margin-right:auto}
.chk{display:inline-flex;align-items:center;gap:6px;cursor:default;position:relative}
.chk input{position:absolute;opacity:0;width:13px;height:13px;margin:0}
.chk .box{width:13px;height:13px;background:#fff;box-shadow:var(--sunken);display:flex;align-items:center;justify-content:center}
.chk .box svg{display:none}
.chk input:checked + .box svg{display:block}
.chk input:focus-visible ~ .t{outline:1px dotted #000;outline-offset:1px}

/* ---------- list views (who sees what, folders, route) ---------- */
#w-who{width:640px;height:254px}
.lv{flex:1;min-height:0;background:#fff;box-shadow:var(--sunken);padding:2px;overflow:auto}
.lv table{border-collapse:collapse;width:100%;table-layout:fixed}
.lv th{padding:0;height:18px;text-align:left;font-weight:normal;position:sticky;top:0;z-index:1}
.lv th button{display:block;width:100%;height:18px;padding:0 6px;border:0;text-align:left;background:var(--face);box-shadow:var(--raised-btn);cursor:default;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lv th button:active{box-shadow:inset -1px -1px var(--sh), inset 1px 1px var(--sh);padding:1px 5px 0 7px}
.lv td{padding:2px 6px;vertical-align:top;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font:11px/16px var(--ui)}
.lv td:first-child{padding-left:3px}
.lv td .n{display:inline-flex;align-items:center;gap:5px;max-width:100%}
.lv td .n img{flex:none}
.lv td .n .t{overflow:hidden;text-overflow:ellipsis}
.lv tr.sel td{background:var(--sel);color:var(--sel-t)}
.lv tbody tr{cursor:default}
.lv tbody tr:focus-visible td{outline:none}
.lv tbody tr:focus-visible td:first-child .t{outline:1px dotted currentColor}
.lv .enc{font-style:italic;color:#555}
.lv tr.sel .enc{color:#ddd}
#w-who col.c1{width:128px}
#w-who col.c2{width:228px}

/* ---------- route ---------- */
#w-route{width:456px}
.rt-body{padding:8px 8px 8px;display:flex;flex-direction:column;gap:7px}
.rt-head{display:flex;align-items:center;gap:10px}
.rt-head img{flex:none}
.rt-head p{margin:0;line-height:15px}
#w-route .lv{flex:none;height:auto}
#w-route col.r1{width:36px} #w-route col.r2{width:84px} #w-route col.r3{width:62px} #w-route col.r4{width:48px} #w-route col.r5{width:94px}
.st{display:inline-flex;align-items:center;gap:4px}
.st img{width:16px;height:16px}
.rt-leg{display:grid;grid-template-columns:1fr auto;gap:5px 10px;align-items:center}
.rt-leg p{margin:0}
.prog{grid-column:1 / -1;height:18px;padding:2px;background:#fff;box-shadow:var(--shallow);display:flex;gap:2px;overflow:hidden}
.prog i{flex:none;width:8px;height:14px;background:var(--xo);box-shadow:inset 0 -1px var(--xo-dk)}

/* ---------- notepad ---------- */
.np{width:560px;height:440px}
.np-frame{flex:1;min-height:0;box-shadow:var(--sunken);padding:2px;display:flex;background:#fff}
.np-text{flex:1;overflow:auto;padding:2px 4px;font:12px/16px "Lucida Console","Courier New",monospace;white-space:pre-wrap;overflow-wrap:anywhere;color:#000;cursor:text}
.np.nowrap .np-text{white-space:pre;overflow-wrap:normal}
.np-text a{color:#000;text-decoration:underline;cursor:pointer}
.np-text a:focus-visible{outline:1px dotted #000;outline-offset:0}
.np-text::selection,.np-text *::selection{background:#000;color:#fff}

/* ---------- folders ---------- */
.fold{width:620px;height:292px}
.fold col.f1{width:150px} .fold col.f2{width:118px} .fold col.f3{width:118px}

/* ---------- browser ---------- */
.bchrome{display:grid;grid-template-columns:minmax(0,1fr) auto;flex:none}
.bchrome .mbar{grid-column:1}
.tools{grid-column:1;display:flex;align-items:center;gap:1px;padding:2px 4px 3px 2px;box-shadow:inset 0 1px var(--sh), inset 0 2px var(--hi);min-width:0;overflow:hidden}
.grip{width:3px;height:36px;box-shadow:var(--thin-up);margin:2px 5px 0 1px;flex:none}
.tbtn{width:48px;height:40px;flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:0;background:none;padding:2px 0 0;cursor:default;font:11px var(--ui)}
.tbtn img{width:20px;height:20px}
.tbtn:hover:not(:disabled){box-shadow:var(--thin-up)}
.tbtn:active:not(:disabled){box-shadow:var(--thin-dn);padding:3px 0 0 2px}
.tbtn:disabled{color:var(--sh);text-shadow:1px 1px var(--hi)}
.tbtn .off,.tbtn:disabled .on{display:none}
.tbtn:disabled .off{display:block}
.tsep{width:2px;height:34px;flex:none;box-shadow:inset 1px 0 var(--sh), inset -1px 0 var(--hi);margin:0 4px}
.throb{grid-column:2;grid-row:1 / span 2;width:56px;margin:2px 2px 3px 2px;background:#000;display:grid;place-items:center;box-shadow:var(--thin-dn)}
.throb img{width:32px;height:32px}
.abar{display:flex;align-items:center;gap:5px;padding:3px 3px 3px 2px;flex:none;box-shadow:inset 0 1px var(--sh), inset 0 2px var(--hi)}
.abar .lbl{flex:none;color:#000}
.combo{flex:1;display:flex;align-items:center;height:22px;background:#fff;box-shadow:var(--sunken);padding:2px 2px 2px 4px;gap:4px;min-width:0}
.combo img{width:16px;height:16px;flex:none}
.combo input{flex:1;min-width:0;border:0;outline:0;font:11px var(--ui);padding:0;background:transparent;color:#000}
.combo input:focus{background:#fff}
.cbtn{width:16px;height:18px;flex:none;border:0;background:var(--face);box-shadow:var(--raised-btn);display:grid;place-items:center;padding:0;cursor:default}
.cbtn svg{fill:#000}
.cbtn:active{box-shadow:var(--pressed)}
.abar .btn{min-width:0;height:22px;padding:0 9px}
.vpw{flex:1;min-height:0;display:flex;padding:2px;box-shadow:var(--sunken);margin-top:2px;background:#fff}
.vp{flex:1;min-width:0;overflow:auto;background:#d6dbe1;container:web / inline-size;position:relative}
#w-web .sb .lprog{width:118px;padding:3px 3px;gap:1px}
.lprog i{flex:none;width:6px;height:12px;background:var(--xo);box-shadow:inset 0 -1px var(--xo-dk)}
#w-web .sb .zone{width:92px}

/* ---------- pdf viewer ---------- */
.pd-tools{display:flex;align-items:center;gap:2px;height:30px;padding:2px 4px 2px 2px;flex:none;box-shadow:inset 0 1px var(--sh), inset 0 2px var(--hi)}
.sbtn{width:24px;height:22px;flex:none;border:0;background:none;display:grid;place-items:center;padding:0;cursor:default}
.sbtn img{width:16px;height:16px}
.sbtn:hover:not(:disabled){box-shadow:var(--thin-up)}
.sbtn:active:not(:disabled){box-shadow:var(--thin-dn);padding:1px 0 0 1px}
.sbtn:disabled img{opacity:.35}
.pd-tools .tsep{height:22px;margin:0 4px}
.pd-tools label{display:flex;align-items:center;gap:4px;margin:0 2px;white-space:nowrap}
.pd-tools .field{height:20px;padding:2px 3px;text-align:center}
#pd-pg{width:28px} #pd-z{width:48px}
.pd-tools .btn{margin-left:auto;min-width:0;height:22px}
.pd-frame{flex:1;min-height:0;display:flex;padding:2px;box-shadow:var(--sunken);margin-top:2px;background:#808080}
.pd-vp{flex:1;min-width:0;overflow:auto;background:#808080;container:pdf / inline-size}

/* ---------- taskbar ---------- */
.taskbar{position:fixed;left:0;right:0;bottom:0;height:28px;background:var(--face);box-shadow:inset 0 1px var(--lt), inset 0 2px var(--hi);display:flex;align-items:center;gap:3px;padding:4px 2px 2px;z-index:1000}
.start{height:22px;display:flex;align-items:center;gap:3px;padding:0 5px 0 3px;border:0;background:var(--face);box-shadow:var(--raised-btn);font:bold 11px var(--ui-b);cursor:default;flex:none}
.start img{width:16px;height:16px}
.start[aria-expanded="true"]{box-shadow:var(--pressed);padding:1px 4px 0 4px}
.tgrip{width:2px;height:20px;box-shadow:inset 1px 0 var(--sh), inset -1px 0 var(--hi);margin:0 2px 0 3px;flex:none}
.tasks{display:flex;gap:3px;flex:1;min-width:0}
.task{width:160px;min-width:0;flex:0 1 160px;height:22px;display:flex;align-items:center;gap:4px;padding:0 6px 0 4px;border:0;background:var(--face);box-shadow:var(--raised-btn);text-align:left;cursor:default}
.task img{width:16px;height:16px;flex:none}
.task span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.task.on{box-shadow:var(--pressed);background:var(--face) var(--checker);font:bold 11px var(--ui-b);padding:1px 5px 0 5px}
.task[hidden]{display:none}
.tray{height:22px;display:flex;align-items:center;gap:10px;padding:0 10px 0 8px;box-shadow:var(--shallow);flex:none;white-space:nowrap}
.tray .tp{display:inline-flex;align-items:center;gap:4px}
.tray .tp img{width:16px;height:16px}

/* ---------- start menu ---------- */
.startmenu{position:fixed;left:2px;bottom:26px;z-index:1001;background:var(--face);box-shadow:var(--raised-win);padding:3px;display:flex;min-width:230px}
.startmenu[hidden]{display:none}
.sm-band{width:22px;background:#000;display:flex;align-items:flex-end;justify-content:center;padding-bottom:6px}
.sm-band span{writing-mode:vertical-rl;transform:rotate(180deg);color:var(--xo);font:17px/1 "Arial Black", sans-serif;letter-spacing:.2px}
.startmenu ul{list-style:none;margin:0;padding:0;flex:1}
.startmenu li.sep{height:2px;margin:2px 2px;box-shadow:inset 0 1px var(--sh), inset 0 -1px var(--hi)}
.sm-i{display:flex;align-items:center;gap:10px;width:100%;height:38px;padding:0 18px 0 6px;border:0;background:none;text-align:left;text-decoration:none;color:#000;cursor:default;font:11px var(--ui)}
.sm-i img{width:32px;height:32px;flex:none}
.sm-i:hover,.sm-i:focus-visible{background:var(--sel);color:var(--sel-t);outline:none}

/* ---------- placements ---------- */
#w-guide{left:150px;top:44px} #w-sec{left:186px;top:78px}
#w-sol{left:222px;top:112px} #w-xmr{left:258px;top:146px}
/* fallbacks; arrange() in the script sets the real first screen from the desktop size */
#w-welcome{left:96px;top:14px} #w-web{left:760px;top:14px;width:640px;height:600px}
#w-route{left:96px;top:520px} #w-who{left:160px;top:90px}
#w-pdf{left:110px;top:10px;width:min(960px, calc(100% - 130px));bottom:10px}
@media (min-width:1600px) and (min-height:980px){ #w-pdf{left:150px;top:18px;width:1080px;bottom:18px} }
.watermark{left:auto;right:14px;bottom:10px;text-align:right}
/* phone */
@media (max-width:820px){
  .desktop{height:auto;min-height:calc(100vh - 28px);overflow:visible;padding:8px 6px 44px;display:flex;flex-direction:column;gap:10px}
  .icons{position:static;order:-10000;display:grid;grid-template-columns:repeat(4,1fr);width:auto;gap:8px 0;padding:0 0 2px}
  .dicon .lbl{max-width:86px}
  .win{position:relative;left:auto !important;top:auto !important;right:auto !important;bottom:auto !important;width:100% !important;height:auto !important}
  .win.max{position:relative}
  #w-welcome{order:1} #w-web{order:2} #w-route{order:3} #w-who{order:4}
  .watermark{position:static;order:5;padding:2px 4px;text-align:left}
  .wl-head{padding:12px 12px 12px 14px}
  .wl-title{font-size:21px}
  .wl-head img{width:50px;height:50px;margin:-7px}
  .wl-body{grid-template-columns:1fr;padding:10px 8px 0}
  .opts{display:grid;grid-template-columns:1fr 1fr;gap:6px}
  .opt{height:44px;gap:8px;padding:0 8px;font-size:11px}
  .opt[aria-pressed="true"]{padding:1px 7px 0 9px}
  .pane{padding:16px 14px 12px;min-height:0}
  .headline{font-size:21px}
  .group{margin:10px 8px 0}
  .note{margin-left:0}
  .ca-row label{display:none}
  .ca-row .btn{min-width:58px;padding:0 8px}
  .wl-foot{flex-wrap:wrap;padding:10px 8px 9px}
  .wl-foot .chk{flex-basis:100%;margin-bottom:6px}
  .wl-foot .btn.default{margin-left:auto}
  #w-who .lv{overflow:visible}
  #w-who col.c1{width:96px}
  #w-who col.c2{width:auto}
  #w-who .lv td{white-space:normal}
  .lv th button{padding:0 4px}
  #w-route table,.fold table{table-layout:auto}
  #w-route col,.fold col{width:auto !important}
  #w-route .hide-s{display:none}
  .fold .lv{height:auto;overflow:visible}
  .fold .hide-s{display:none}
  .fold .lv td{white-space:normal}
  .tbb[data-act="max"]{display:none}
  .vpw{height:600px;flex:none}
  .np-frame{height:340px;flex:none}
  .pd-frame{height:620px;flex:none}
  .throb{width:44px}
  .tbtn{width:44px}
  .tools .tsep{display:none}
  .abar .btn{display:none}
  #w-web .sb .lprog{display:none}
  .pd-tools .btn,.pd-tools #pd-print,.pd-tools .tsep:first-of-type{display:none}
  .tasks{overflow:hidden}
  .task{flex:0 0 26px;width:26px;padding:0 5px}
  .task span{display:none}
  .task.on{padding:1px 4px 0 6px}
  .tray{gap:7px;padding:0 6px}
  .tray .tp img{display:none}
  .tgrip{display:none}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none !important;transition:none !important}
}