/* flintloop.app - classic shareware product site. Tahoma/Verdana, steel-blue chrome, amber buy/download, beveled panels. */
:root{
  --ink:#1f2733; --mut:#5b6775; --faint:#8793a2; --line:#c6d0dc; --line2:#dde4ec;
  --steel:#2f4a68; --steel-d:#243b53; --steel-l:#e9eef4; --panel:#f3f6fa; --field:#fff;
  --amber:#f4a623; --amber-d:#c57f0e; --green:#4a8f5e; --red:#b23b3b;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#dfe6ee;color:var(--ink);
  font-family:Tahoma,Geneva,Verdana,"Segoe UI",sans-serif;font-size:13.5px;line-height:1.55}
a{color:#1d5fa8;text-decoration:none}
a:hover{text-decoration:underline}
.mono{font-family:ui-monospace,Consolas,"Lucida Console",monospace}
h1{font-size:1.55rem;color:var(--steel-d);margin:.1rem 0 .6rem;line-height:1.18}
h2{font-size:1.1rem;color:var(--steel-d);margin:1.4rem 0 .5rem;border-bottom:1px solid var(--line);padding-bottom:.2rem}
h3{font-size:.98rem;color:var(--steel-d);margin:1rem 0 .3rem}
p{margin:.5rem 0}
.lede{font-size:.98rem;color:#2c3744}
.smallp{font-size:.82rem;color:var(--mut)}

/* top bar + nav */
.sw-top{background:var(--steel-d)}
.sw-bar{max-width:1080px;margin:0 auto;display:flex;align-items:center;gap:.6rem;padding:.4rem 1rem}
.sw-logo{display:flex;align-items:center;gap:.5rem;color:#fff;font-size:1.15rem;font-weight:700}
.sw-logo:hover{text-decoration:none}
.sw-logo small{font-size:.7rem;font-weight:400;color:#aab8c9;vertical-align:middle}
.reg-link{margin-left:auto;color:#cdd8e4;font-size:.82rem;border:1px solid #47617d;padding:.2rem .55rem;border-radius:3px}
.reg-link:hover{background:#365273;color:#fff;text-decoration:none}
.sw-nav{background:linear-gradient(#3b587a,#2f4a68);border-top:1px solid #50688a;display:flex;flex-wrap:wrap}
.sw-nav a{color:#dce4ee;padding:.42rem .8rem;font-size:.84rem;border-right:1px solid #3a5676}
.sw-nav a:hover{background:#4a688c;text-decoration:none;color:#fff}
.sw-nav a.on{background:var(--amber);color:#3a2a06;font-weight:700}

.sw-wrap{max-width:1080px;margin:0 auto;background:#fff;border-left:1px solid var(--line);border-right:1px solid var(--line);box-shadow:0 0 0 1px #fff inset}
.sw-main{padding:1rem 1.4rem 2rem}
.sw-crumb{font-size:.78rem;color:var(--faint);margin-bottom:.7rem}
.sw-crumb a{color:var(--mut)}

/* two-column with download box */
.sw-cols{display:grid;grid-template-columns:1fr 250px;gap:1.6rem;align-items:start}
.sw-content{min-width:0}

/* download box - beveled shareware panel */
.dlbox{border:1px solid var(--line);border-radius:4px;background:var(--panel);overflow:hidden;box-shadow:0 1px 2px rgba(40,60,90,.12)}
.dl-tbar{background:linear-gradient(#3b587a,#2f4a68);color:#fff;font-weight:700;font-size:.9rem;padding:.4rem .7rem;letter-spacing:.03em}
.dl-body{padding:.8rem}
.dl-ver{margin:.1rem 0 .6rem;font-size:1rem}
.dl-facts{margin:0 0 .8rem;display:grid;grid-template-columns:auto 1fr;gap:.18rem .5rem;font-size:.8rem}
.dl-facts dt{color:var(--mut)}.dl-facts dd{margin:0;text-align:right;font-weight:600}
.dl-btn,.buy-btn{display:block;text-align:center;padding:.55rem;border-radius:4px;font-weight:700;margin-bottom:.5rem;border:1px solid}
.dl-btn{background:var(--amber);border-color:var(--amber-d);color:#3a2a06}
.dl-btn:hover{background:#f6b544;text-decoration:none}
.buy-btn{background:#fff;border-color:var(--steel);color:var(--steel-d)}
.buy-btn:hover{background:var(--steel-l);text-decoration:none}
.dl-foot{font-size:.74rem;color:var(--faint);margin:0;text-align:center}

/* lists */
.hi{list-style:none;padding:0;margin:1rem 0}
.hi li{padding:.5rem .7rem;border-left:3px solid var(--amber);background:var(--panel);margin:.4rem 0;border-radius:0 3px 3px 0}
.steps{margin:.6rem 0 .6rem 1.3rem}.steps li{margin:.35rem 0}
.feat{margin:.4rem 0 .6rem 1.2rem}.feat li{margin:.28rem 0}
.conns{columns:2;list-style:square;margin:.5rem 0 .8rem 1.2rem;font-size:.9rem}
.whatsnew{background:#fff7e8;border:1px solid #f0d9a8;border-radius:4px;padding:.6rem .8rem}

/* tables */
.sw-tbl{border-collapse:collapse;width:100%;margin:.6rem 0;font-size:.86rem}
.sw-tbl th,.sw-tbl td{border:1px solid var(--line);padding:.4rem .55rem;text-align:left;vertical-align:top}
.sw-tbl thead th{background:var(--steel-l);color:var(--steel-d);font-size:.8rem}
.sw-tbl.kv th{background:var(--panel);width:34%;color:var(--mut)}
.sw-tbl tbody tr:nth-child(even) td{background:#fafcfe}
.cl{font-weight:700;font-size:.74rem;text-align:center;border-radius:3px;color:#fff}
.cl-panel{color:#2f4a68}.cl-plc{color:#2f6b3e}.cl-dcs{color:#6b3e8f}.cl-safety{color:#b23b3b}.cl-import{color:#8a6d1f}
.pr{font-weight:700;color:var(--steel-d);white-space:nowrap}
.price td:first-child{font-weight:600}
.howget{background:var(--panel);border:1px solid var(--line);border-radius:4px;padding:.7rem .9rem}

/* screenshots */
.shotfig{margin:1.1rem 0;background:var(--panel);border:1px solid var(--line);border-radius:5px;padding:.8rem}
.shot{display:block;width:100%;max-width:460px;height:auto;margin:0 auto;background:#fff;border:1px solid var(--line)}
.shl{font-family:Tahoma,sans-serif;font-size:11px;font-weight:700}
.shl2{font-family:ui-monospace,Consolas,monospace;font-size:10px;fill:#2f4a68}
.shotfig figcaption{font-size:.82rem;color:var(--mut);margin-top:.5rem}

/* releases */
.rel{border-bottom:1px solid var(--line2);padding:.5rem 0}
.rel h3{display:flex;align-items:baseline;gap:.5rem}
.rel-d{font-size:.78rem;color:var(--faint);font-family:ui-monospace,monospace}
.cur{background:var(--green);color:#fff;font-size:.68rem;padding:.1rem .4rem;border-radius:3px;font-weight:700}
.rel-sum{margin:.2rem 0}
.rel-notes{margin:.3rem 0 .3rem 1.1rem;font-size:.9rem;color:#3a4552}

/* faq */
.qa{border-top:1px solid var(--line2);padding:.5rem 0}
.qa h3{color:var(--steel-d)}

/* register / forms */
.reg-form{max-width:360px;background:var(--panel);border:1px solid var(--line);border-radius:5px;padding:1.1rem;margin:1rem 0;display:flex;flex-direction:column;gap:.7rem;box-shadow:0 1px 2px rgba(40,60,90,.1)}
.reg-form label{display:flex;flex-direction:column;gap:.25rem;font-size:.82rem;font-weight:700;color:var(--mut)}
.reg-form input{font:inherit;padding:.5rem .6rem;border:1px solid var(--line);border-radius:3px;background:#fff}
.reg-form button{background:var(--amber);border:1px solid var(--amber-d);color:#3a2a06;font-weight:700;padding:.55rem;border-radius:4px;cursor:pointer;font-size:.95rem}
.reg-form button:hover{background:#f6b544}
.reg-msg{font-size:.82rem;margin:0;min-height:1rem}
.reg-msg.err{color:var(--red);background:#fbecec;border:1px solid #edc9c9;padding:.5rem .6rem;border-radius:3px}
.reg-msg.ok{color:#2f6b3e;background:#eaf4ed;border:1px solid #c7e0ce;padding:.5rem .6rem;border-radius:3px}

.seealso{margin-top:1.6rem;background:var(--panel);border:1px solid var(--line);border-radius:4px;padding:.7rem .9rem}
.seealso h4{margin:0 0 .3rem;font-size:.78rem;text-transform:uppercase;letter-spacing:.04em;color:var(--mut)}
.seealso ul{margin:0;padding-left:1.1rem}

/* footer */
.sw-foot{max-width:1080px;margin:0 auto;background:var(--steel-d);color:#c6d2df;border-top:3px solid var(--amber)}
.foot-cols{display:grid;grid-template-columns:repeat(4,1fr);gap:1.1rem;padding:1.3rem 1.4rem .8rem}
.foot-cols h4{color:#fff;font-size:.78rem;margin:0 0 .4rem;text-transform:uppercase;letter-spacing:.05em}
.foot-cols ul{list-style:none;margin:0;padding:0}
.foot-cols li{margin:.2rem 0}
.foot-cols a{color:#aebdce;font-size:.82rem}
.foot-cols a:hover{color:#fff}
.foot-small{border-top:1px solid #3a5676;padding:.9rem 1.4rem 1.3rem;font-size:.78rem;color:#9fb0c2}
.foot-small a{color:#cdd8e4}
.foot-small .upd{font-family:ui-monospace,monospace;font-size:.72rem;color:#8ba0b6}
.foot-small .cr{color:#7c90a6}

@media (max-width:860px){
  .sw-cols{grid-template-columns:1fr}
  .dlbox{max-width:320px}
  .foot-cols{grid-template-columns:1fr 1fr}
  .conns{columns:1}
}
@media (max-width:420px){ .sw-main{padding:.9rem} .foot-cols{grid-template-columns:1fr} }

@media (prefers-color-scheme:dark){
  body{background:#10151c;color:#d5dde7}
  .sw-wrap{background:#161d27;border-color:#2a3542;box-shadow:none}
  h1,h2,h3{color:#ccd9e8}
  a{color:#7fb0e6}
  .panel,.dlbox,.whatsnew,.howget,.seealso,.reg-form,.shotfig{background:#1b232f}
  .dlbox,.seealso,.reg-form,.shotfig,.howget{border-color:#2a3542}
  :root{--panel:#1b232f;--steel-l:#223044;--line:#2a3542;--line2:#243040;--mut:#9aa7b6;--ink:#d5dde7}
  .sw-tbl th,.sw-tbl td{border-color:#2a3542}
  .sw-tbl tbody tr:nth-child(even) td{background:#182029}
  .shot{background:#0f141b}
  .whatsnew{border-color:#4a3c1a}
}