/* Platform previews: compact, navigable workspaces. */
#owned-websites .platform-workspace { border-color:#37322f; border-radius:12px; box-shadow:0 16px 44px #0004; }
#owned-websites .platform-workspace .ref-platform-title { min-height:74px; padding:18px 20px; background:linear-gradient(110deg,#221a15,#131313 65%); box-sizing:border-box; }
#owned-websites .platform-workspace .ref-platform-title h3 { font-size:15px; letter-spacing:-.4px; }
#owned-websites .platform-workspace .ref-platform-title > span { font:7px/1.5 monospace; letter-spacing:.7px; }
#owned-websites .platform-workspace .ref-site-preview { container-type:normal; background:#101010; }
.platform-workspace .platform-addressbar { display:flex; align-items:center; gap:12px; padding:10px 15px; background:#191919; border-block:1px solid #ffffff0d; }
.platform-window-dots { font-size:7px; letter-spacing:3px; color:#675144; white-space:nowrap; }
.platform-addressbar small { min-width:0; overflow:hidden; text-overflow:ellipsis; color:#9b9692; font:9px monospace; }
.platform-preview-label { margin-left:auto; font:6px monospace; letter-spacing:1px; color:#bd8867; border:1px solid #644630; padding:3px 5px; border-radius:3px; }
.platform-workspace-body { display:grid; grid-template-columns:112px minmax(0,1fr); }
.platform-menu { display:flex; flex-direction:column; padding:18px 9px 14px; background:#141414; border-right:1px solid #ffffff0c; }
.platform-menu-brand { padding:0 9px 22px; color:#ff792f; font:26px monospace; }
.platform-menu-brand small { display:block; margin-top:8px; font:7px monospace; letter-spacing:1px; color:#8f837a; }
.platform-workspace .platform-nav { display:flex; flex-direction:column; align-items:stretch; padding:0; gap:6px; border:0; background:transparent; }
.platform-workspace .platform-nav button { display:flex; align-items:center; gap:8px; padding:11px 8px; text-align:left; font-size:10px; border:1px solid transparent; border-radius:5px; }
.platform-workspace .platform-nav button i { font:15px monospace; color:#8b8179; }
.platform-workspace .platform-nav button[aria-selected="true"] { color:#ffc29b; border-color:#ff792f33; background:linear-gradient(90deg,#ff792f20,#ff792f06); }
.platform-workspace .platform-nav button[aria-selected="true"] i { color:#ff792f; }
.platform-workspace .platform-nav button[aria-selected="true"]::after { left:-10px; top:10px; bottom:10px; height:auto; width:2px; right:auto; }
.platform-menu-note { margin-top:auto; padding:18px 8px 0; font:7px/1.7 monospace; color:#9f8d80; }
.platform-menu-note > i { display:inline-block; width:4px; height:4px; background:#ff792f; border-radius:50%; margin-right:4px; }
.platform-menu-note span { display:block; margin-top:4px; color:#645e59; font:8px/1.7 sans-serif; }
.platform-workspace .platform-panels { min-width:0; background:radial-gradient(circle,#ffffff16 .7px,transparent 1px) 0 0/12px 12px; }
.platform-workspace .platform-panel { height:360px; padding:22px; background:radial-gradient(ellipse at 100% 0,#ff792f0a,transparent 70%); }
.platform-workspace .platform-kicker { font:7px/1.5 monospace; letter-spacing:1.1px; color:#af8e78; }
.platform-workspace .platform-panel h4 { margin:11px 0 10px; font-size:clamp(23px,2.05vw,31px); line-height:1.14; letter-spacing:-.9px; }
.platform-workspace .platform-panel p { font-size:11px; line-height:1.65; margin:0 0 16px; color:#aaa19b; }
.platform-code-window,.platform-publication { margin-top:18px; border:1px solid #ffffff17; border-radius:7px; background:#151515; overflow:hidden; }
.platform-code-window > div { display:flex; align-items:center; gap:9px; padding:8px 10px; border-bottom:1px solid #ffffff0a; background:#1e1c1a; }
.platform-code-window > div > span { display:flex; gap:3px; }
.platform-code-window i { height:4px; width:4px; background:#a66f4d; border-radius:50%; }
.platform-code-window small { font:7px monospace; color:#9e948d; }
.platform-code-window b { margin-left:auto; font:7px monospace; color:#e9a36d; }
.platform-code-window pre { margin:0; padding:12px 10px; font:9px/1.8 monospace; color:#c7c2bd; overflow:auto; }
.platform-code-window pre span { color:#5e554f; padding-right:9px; }
.platform-code-window pre em { font-style:normal; color:#ed9569; }
.platform-code-window pre strong { font-weight:400; color:#ff5a00; }
.platform-code-window footer { display:flex; align-items:center; justify-content:space-between; padding:7px 10px; border-top:1px solid #ffffff0c; color:#9e806b; font:6px monospace; letter-spacing:.5px; }
.platform-publication > div:first-child { display:flex; justify-content:space-between; gap:5px; padding:9px 10px; background:#211c18; }
.platform-publication small { font:6px/1.5 monospace; letter-spacing:.8px; color:#c69b7c; }
.platform-publication > div:first-child > span { font-size:7px; color:#b3a69c; }
.platform-publication-cover { position:relative; padding:12px; overflow:hidden; background:radial-gradient(ellipse at right,#68321550,transparent),#181614; min-height:91px; box-sizing:border-box; }
.platform-publication-cover > span { position:absolute; right:4px; top:-20px; font-size:100px; color:#ff792f14; }
.platform-publication-cover > div { position:relative; }
.platform-publication-cover b { display:block; font-size:17px; line-height:1.65; color:#ead8cb; margin-top:5px; }
.platform-publication footer { display:flex; justify-content:space-between; gap:5px; padding:9px 10px; border-top:1px solid #ffffff0b; font:6px monospace; color:#a58b77; }
.platform-inline-action { display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%; margin-top:15px; padding:0; border:0; background:none; color:#ff975c; text-align:left; font:500 10px/1.6 sans-serif; cursor:pointer; }
.platform-inline-action:hover { color:#ffc49f; }
.platform-inline-action > span { font-size:17px; }
.platform-workspace .platform-row { padding:11px 9px; gap:8px; background:#181716; border-radius:6px; }
.platform-workspace .platform-row > i { flex-basis:26px; height:28px; font-size:13px; }
.platform-workspace .platform-row b { font-size:10px; }
.platform-workspace .platform-row small { font-size:9px; }
.platform-workspace .platform-action { font-size:10px; padding:10px; }
.platform-workspace .platform-steps { font-size:11px; }
#owned-websites .platform-workspace .ref-platform-footer { min-height:54px; padding:14px 18px; background:#151413; }
#owned-websites .platform-workspace .ref-platform-footer > small { max-width:none; font-size:9px; }
#owned-websites .platform-workspace .platform-external { font-size:10px; }
@media(min-width:761px) and (max-width:1100px) {
  .platform-workspace-body { grid-template-columns:90px minmax(0,1fr); }
  .platform-workspace .platform-panel { padding:17px 12px; }
  .platform-workspace .platform-nav button { gap:5px; padding:10px 4px; font-size:9px; }
  .platform-menu { padding-inline:6px; }
  .platform-workspace .platform-panel h4 { font-size:24px; }
  #owned-websites .platform-workspace .ref-platform-title { height:86px; align-content:center; }
}
@media(max-width:540px) {
  .platform-workspace-body { display:block; }
  .platform-menu { padding:8px 12px; border-right:0; border-bottom:1px solid #ffffff10; }
  .platform-menu-brand,.platform-menu-note { display:none; }
  .platform-workspace .platform-nav { flex-direction:row; gap:5px; }
  .platform-workspace .platform-nav button { justify-content:center; flex:1; padding:9px 4px; font-size:10px; }
  .platform-workspace .platform-nav button[aria-selected="true"]::after { display:none; }
  .platform-workspace .platform-panel { padding:20px; height:360px; }
  .platform-workspace .platform-panel h4 { font-size:28px; }
  #owned-websites .platform-workspace .ref-platform-title { height:82px; align-content:center; }
  #owned-websites .platform-workspace .ref-platform-title h3 { font-size:14px; }
  #owned-websites .platform-workspace .ref-platform-footer { gap:8px; padding-inline:14px; }
}

/* Prominent platform identities and Tamil-only typography. */
#owned-websites .ref-platform-connection { height:82px; gap:45px; }
#owned-websites .ref-platform-connection > div { width:180px; height:70px; }
#owned-websites .ref-platform-connection .ref-platform-logo { width:150px; height:62px; }
#owned-websites .ref-platform-connection::before { top:35px; height:46px; }
#owned-websites.ref-platforms { grid-template-columns:1fr; gap:18px; padding:38px 3.8% 42px; }
#owned-websites .ref-intro { display:block; width:min(100%,900px); max-width:none; margin-inline:auto; text-align:center; }
#owned-websites .ref-intro h2 { margin:14px 0 10px; font-size:clamp(30px,3.1vw,44px); }
#owned-websites .ref-intro h2 br { display:none; }
#owned-websites .ref-intro > p:not(.ref-eyebrow) { margin:0; font-size:13px; }
#owned-websites .ref-platform-connection { height:78px; }
#owned-websites .ref-platform-connection::before { top:35px; height:43px; }
#owned-websites .ref-platform-grid { gap:24px; align-items:stretch; }
#owned-websites .platform-workspace { border-radius:12px; }
#owned-websites .platform-workspace .ref-platform-title { min-height:92px; height:auto; padding:12px 20px; }
#owned-websites .platform-workspace .ref-platform-title h3 { font-size:clamp(17px,1.55vw,22px); }
#owned-websites .platform-workspace .ref-platform-title > span { flex-basis:auto; margin-left:auto; font-size:7px; }
#owned-websites .ref-platform-title .platform-brand-logo { position:static; transform:none; width:72px; height:64px; flex:0 0 72px; opacity:1; }
#owned-websites .platform-workspace-body { grid-template-columns:112px minmax(0,1fr); min-height:390px; }
#owned-websites .platform-workspace .platform-panel { height:390px; padding:22px; }
#owned-websites .platform-workspace .platform-panel h4 { font-size:clamp(22px,2vw,30px); }
#owned-websites .platform-workspace .platform-panel p { font-size:11px; }
#owned-websites .platform-code-window,.platform-publication { margin-top:18px; }
#owned-websites .platform-code-window { min-height:155px; }
#owned-websites .platform-publication { min-height:155px; }
#owned-websites .platform-workspace .ref-platform-footer { min-height:62px; padding:14px 20px; }
#owned-websites .platform-workspace .ref-platform-title { min-height:108px; height:auto; gap:8px 14px; }
#owned-websites .ref-platform-title h3 { min-width:0; gap:14px; }
#owned-websites .platform-brand-logo { display:block; width:72px; height:64px; flex:0 0 72px; object-fit:contain; }
#owned-websites [lang="ta"], #owned-websites [lang="ta"] * { font-family:'Anek Tamil',sans-serif; letter-spacing:normal; }
#owned-websites .platform-row [lang="ta"] { font-size:13px; line-height:1.6; }
#owned-websites .platform-row small [lang="ta"] { font-size:11px; }
#owned-websites .platform-panel h4:has([lang="ta"]) { font-size:24px; line-height:1.5; }
#owned-websites .platform-nav [lang="ta"] { font-size:12px; }
@media(max-width:540px) {
  #owned-websites .ref-platform-connection { gap:12px; }
  #owned-websites .ref-platform-connection > div { width:150px; }
  #owned-websites .ref-platform-connection .ref-platform-logo { width:132px; }
  #owned-websites .platform-workspace .ref-platform-title { padding:16px; }
  #owned-websites .platform-brand-logo { width:64px; height:58px; flex-basis:64px; }
  #owned-websites .ref-platform-title h3 { gap:10px; }
  #owned-websites .platform-workspace .ref-platform-title h3 { font-size:13px; }
}

/* Platform names remain prominent over a subtle brand watermark. */
#owned-websites .ref-platform-title { position:relative; isolation:isolate; overflow:hidden; }
#owned-websites .ref-platform-title h3 { position:static; }
#owned-websites .ref-platform-title .platform-brand-logo { position:absolute; right:14px; top:50%; transform:translateY(-50%); width:130px; height:100px; opacity:.24; z-index:0; pointer-events:none; }
#owned-websites .platform-workspace .ref-platform-title h3,
#owned-websites .ref-platform-title h3 { font-size:clamp(20px,2vw,28px); line-height:1.2; letter-spacing:.02em; text-transform:uppercase; }
#owned-websites .ref-platform-title { flex-wrap:wrap; }
#owned-websites .ref-platform-title > span { flex-basis:100%; }
#owned-websites .platform-mobile-tabs button { text-transform:uppercase; font-size:10px; }

#owned-websites .ref-platform-title h3 > span,
#owned-websites .ref-platform-title > span { position:relative; z-index:1; }
#owned-websites .platform-workspace .ref-platform-title h3 { font-size:clamp(24px,2.2vw,32px); font-weight:750; }
#owned-websites .platform-workspace .ref-platform-title { min-height:120px; }

/* Keep the connected-platform section aligned with the supplied reference. */
#owned-websites.ref-platforms { grid-template-columns:1fr; gap:18px; padding:38px 3.8% 42px; }
#owned-websites .ref-intro { display:block; width:min(100%,900px); max-width:none; margin-inline:auto; text-align:center; }
#owned-websites .ref-intro h2 { margin:14px 0 10px; font-size:clamp(30px,3.1vw,44px); }
#owned-websites .ref-intro h2 br { display:none; }
#owned-websites .ref-intro > p:not(.ref-eyebrow) { margin:0; font-size:13px; }
#owned-websites .ref-platform-connection { height:78px; }
#owned-websites .ref-platform-connection::before { top:35px; height:43px; }
#owned-websites .ref-platform-grid { gap:24px; align-items:stretch; }
#owned-websites .platform-workspace { border-radius:12px; }
#owned-websites .platform-workspace .ref-platform-title { min-height:92px; height:auto; padding:12px 20px; }
#owned-websites .platform-workspace .ref-platform-title h3 { font-size:clamp(17px,1.55vw,22px); }
#owned-websites .platform-workspace .ref-platform-title > span { flex-basis:auto; margin-left:auto; font-size:7px; }
#owned-websites .ref-platform-title .platform-brand-logo { position:static; transform:none; width:72px; height:64px; flex:0 0 72px; opacity:1; }
#owned-websites .platform-workspace-body { grid-template-columns:112px minmax(0,1fr); min-height:390px; }
#owned-websites .platform-workspace .platform-panel { height:390px; padding:22px; }
#owned-websites .platform-workspace .platform-panel h4 { font-size:clamp(22px,2vw,30px); }
#owned-websites .platform-workspace .platform-panel p { font-size:11px; }
#owned-websites .platform-code-window,
#owned-websites .platform-publication { margin-top:18px; min-height:155px; }
#owned-websites .platform-workspace .ref-platform-footer { min-height:62px; padding:14px 20px; }
@media(max-width:760px) {
  #owned-websites.ref-platforms { padding:34px 20px; }
  #owned-websites .ref-intro h2 { font-size:30px; }
  #owned-websites .ref-platform-grid { grid-template-columns:1fr; gap:18px; }
  #owned-websites .ref-platform-title .platform-brand-logo { width:58px; height:54px; flex-basis:58px; }
  #owned-websites .platform-workspace .ref-platform-title { min-height:80px; padding:12px 15px; }
  #owned-websites .platform-workspace .ref-platform-title h3 { font-size:17px; }
}
@media(max-width:540px) {
  #owned-websites .ref-platform-connection { height:72px; gap:12px; }
  #owned-websites .ref-platform-connection > div { width:150px; height:62px; }
  #owned-websites .ref-platform-connection .ref-platform-logo { width:125px; height:52px; }
  #owned-websites .ref-platform-connection::before { top:31px; height:40px; }
  #owned-websites .platform-workspace-body { display:block; }
  #owned-websites .platform-menu { padding:8px 10px; }
  #owned-websites .platform-workspace .platform-nav button { font-size:9px; }
  #owned-websites .platform-workspace .platform-panel { height:360px; padding:20px; }
  #owned-websites .platform-workspace .platform-panel h4 { font-size:27px; }
  #owned-websites .platform-code-window pre { font-size:8px; }
}

/* Platform header lockup: keep each logo on the left and its text on the right. */
#owned-websites .platform-workspace .ref-platform-title { display:flex; flex-wrap:nowrap; justify-content:flex-start; align-items:center; gap:12px; }
#owned-websites .platform-workspace .ref-platform-title h3 { display:contents; }
#owned-websites .platform-workspace .ref-platform-title .platform-brand-logo { order:0; position:static; top:auto; right:auto; transform:none; width:72px; height:64px; flex:0 0 72px; opacity:1; object-fit:contain; }
#owned-websites .platform-workspace .ref-platform-title h3 > span { order:1; margin:0 !important; color:#f1f4f5 !important; opacity:1 !important; font-size:clamp(15px,1.45vw,21px); }
#owned-websites .platform-workspace .ref-platform-title > span { order:2; flex-basis:auto; margin-left:auto; text-align:right; font-size:7px; }
@media(max-width:760px) {
  #owned-websites .platform-workspace .ref-platform-title { min-height:82px; padding:12px 15px; }
  #owned-websites .platform-workspace .ref-platform-title .platform-brand-logo { width:58px; height:54px; flex-basis:58px; }
  #owned-websites .platform-workspace .ref-platform-title h3 > span { font-size:15px; }
}
@media(max-width:540px) {
  #owned-websites .platform-workspace .ref-platform-title { flex-wrap:wrap; gap:4px 10px; }
  #owned-websites .platform-workspace .ref-platform-title > span { order:2; flex-basis:100%; margin-left:68px; text-align:left; }
  #owned-websites .platform-workspace .ref-platform-title .platform-brand-logo { width:52px; height:48px; flex-basis:52px; }
  #owned-websites .platform-workspace .ref-platform-title h3 > span { font-size:14px; }
}

/* Large, subdued platform names sit behind the clear logo in each card header. */
#owned-websites .platform-workspace .ref-platform-title h3 > span {
  position:absolute;
  z-index:0;
  left:50%;
  top:50%;
  max-width:calc(100% - 220px);
  transform:translate(-50%,-50%);
  color:#f1f4f5 !important;
  opacity:.07 !important;
  font-size:clamp(19px,2.1vw,29px);
  font-weight:800;
  line-height:1.05;
  letter-spacing:.01em;
  white-space:nowrap;
  pointer-events:none;
}
#owned-websites .platform-workspace .ref-platform-title .platform-brand-logo { position:relative; z-index:1; }
#owned-websites .platform-workspace .ref-platform-title > span { position:relative; z-index:1; }
@media(max-width:760px) {
  #owned-websites .platform-workspace .ref-platform-title h3 > span { left:50%; max-width:calc(100% - 150px); font-size:clamp(17px,3vw,23px); }
}
@media(max-width:540px) {
  #owned-websites .platform-workspace .ref-platform-title h3 > span { left:50%; top:50%; max-width:calc(100% - 32px); font-size:clamp(19px,6vw,28px); white-space:nowrap; text-align:center; }
}
