/* ===== AAA Instant Messenger — AIM homage ===== */

/* The running man runs the other way. .rm is the only hook — never flip .ic or
   .ie-ico, which the file icons and the IE 'e' also use. inline-block because
   transform is a no-op on inline elements. */
.rm{ display:inline-block; transform:scaleX(-1); }

.aim-win{ position:absolute; z-index:500; display:flex; flex-direction:column; background:var(--face); box-shadow:var(--bevel-up); padding:3px; min-width:220px; }
.aim-tbar{ display:flex; align-items:center; gap:6px; padding:3px 3px 3px 7px; cursor:move; color:#fff; background:linear-gradient(90deg,#12308a,#3f74d8); }
.aim-tbar .rm{ font-size:14px; line-height:1; }
.aim-tbar .ttl{ flex:1; font-weight:bold; font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.aim-tbar.blur{ background:linear-gradient(90deg,#6b6b86,#9aa0bd); }
.aim-ctrls{ display:flex; gap:2px; }
.aim-b{ width:18px; height:15px; display:grid; place-items:center; font-size:10px; font-weight:bold; color:#000; background:var(--face); box-shadow:var(--bevel-up); border:0; cursor:pointer; line-height:1; }
.aim-b:active{ box-shadow:var(--bevel-dn); }

/* sign-on */
.aim-signon{ width:290px; }
.aim-banner{ background:linear-gradient(180deg,#4f84e8,#12308a); color:#fff; text-align:center; padding:14px 10px 12px; }
.aim-banner .rm{ font-size:42px; display:block; line-height:1; }
.aim-banner b{ display:block; margin-top:4px; font-size:15px; letter-spacing:.02em; }
.aim-banner small{ font-size:10px; opacity:.85; }
.aim-form{ padding:15px 16px 16px; }
.aim-form label{ display:block; font-size:11px; font-weight:bold; color:#00006a; margin-bottom:4px; }
.aim-form label .hint{ font-weight:normal; color:#555; }
.aim-form input{ width:100%; font-family:var(--ui); font-size:13px; background:#fff; box-shadow:var(--bevel-dn); border:0; padding:7px 8px; }
.aim-row2{ display:flex; align-items:center; justify-content:space-between; margin-top:13px; }
.aim-signbtn{ font-family:var(--ui); font-weight:bold; font-size:13px; padding:7px 20px; background:#c9e7c9; color:#053d05; box-shadow:var(--bevel-up); border:0; cursor:pointer; }
.aim-signbtn:active{ box-shadow:var(--bevel-dn); }
.aim-links{ text-align:center; font-size:11px; color:#0000c8; }

/* buddy list */
.aim-bl{ width:238px; height:398px; }
.aim-bl-head{ display:flex; align-items:center; gap:8px; padding:8px 9px; background:linear-gradient(180deg,#fff,#dbe4f6); box-shadow:var(--bevel-dn); }
.aim-bl-head .rm{ font-size:26px; }
.aim-bl-head b{ font-size:13px; color:#12308a; }
.aim-bl-head span{ display:block; font-size:10px; color:#2f8a2f; font-weight:bold; }
.aim-bl-list{ flex:1; min-height:0; overflow:auto; background:#fff; box-shadow:var(--bevel-dn); margin:3px 0; padding:3px; }
.aim-grp{ font-size:11px; font-weight:bold; color:#12308a; padding:5px 6px 2px; }
.aim-grp .c{ color:#999; font-weight:normal; }
.aim-bud{ display:flex; align-items:center; gap:7px; padding:3px 6px 3px 16px; cursor:pointer; font-size:12px; }
.aim-bud:hover{ background:#e6eeff; }
.aim-bud .dot{ width:8px; height:8px; border-radius:50%; background:#2ec234; box-shadow:0 0 0 1px #0a0; flex:none; }
.aim-bud.away .dot{ background:#e0a800; box-shadow:0 0 0 1px #a07000; }
.aim-bud.you .nm{ font-style:italic; color:#555; }
.aim-bl-tools{ display:flex; gap:5px; padding:4px 3px 2px; }
.aim-tool{ flex:1; font-size:11px; font-weight:bold; padding:7px 4px; background:var(--face); box-shadow:var(--bevel-up); border:0; cursor:pointer; }
.aim-tool:active{ box-shadow:var(--bevel-dn); }

/* IM / chat window */
.aim-im{ width:362px; height:302px; }
.aim-im.room{ width:452px; height:346px; }
.aim-away{ font-size:11px; color:#7a5000; background:#fff7e0; box-shadow:var(--bevel-dn); margin:3px 3px 0; padding:5px 8px; line-height:1.4; }
.aim-im-top{ display:flex; flex:1; min-height:0; }
.aim-log{ flex:1; min-height:0; overflow:auto; background:#fff; box-shadow:var(--bevel-dn); margin:3px; padding:6px 8px; font-size:12.5px; line-height:1.5; }
.aim-log .m{ margin:2px 0; word-wrap:break-word; }
.aim-log .who{ font-weight:bold; }
.aim-log .me{ color:#c00; }
.aim-log .them{ color:#0033cc; }
.aim-log .bot{ color:#7a3aef; }
.aim-log .sys{ color:#999; font-style:italic; }
.aim-parts{ width:120px; flex:none; overflow:auto; background:#fff; box-shadow:var(--bevel-dn); margin:3px 3px 3px 0; padding:6px; font-size:11px; }
.aim-parts b{ display:block; color:#12308a; margin-bottom:5px; }
.aim-parts .p{ padding:2px 0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.aim-input{ display:flex; gap:4px; padding:0 3px 3px; }
.aim-input textarea{ flex:1; height:46px; resize:none; font-family:var(--ui); font-size:12.5px; background:#fff; box-shadow:var(--bevel-dn); border:0; padding:5px 7px; }
.aim-send{ width:66px; font-weight:bold; font-size:12px; background:#c9e7c9; color:#053d05; box-shadow:var(--bevel-up); border:0; cursor:pointer; }
.aim-send:active{ box-shadow:var(--bevel-dn); }

#aimTray{ cursor:pointer; }

/* unread IM — taskbar tab flashes orange (classic AOL) */
.task-btn.flash{ animation:aimflash .66s steps(1) infinite; }
@keyframes aimflash{ 50%{ background:#ff9a2e; color:#000; box-shadow:var(--bevel-dn); } }
#aimTray.flash{ animation:aimflash .66s steps(1) infinite; }