API tools faq
paste
glucoseguardian

idolsenshi 1.1

glucoseguardian
Sep 26th, 2025
64
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 29.53 KB | None | 0 0
raw download clone embed print report
  1. [nobr]
  2. [div=display: none;]
  3. ui assets by cup nooble (https://cupnooble.itch.io/) with modifications
  4. please keep above credit i don't care about my own
  5. find areas to fill in by ctrl/cmd+f '&&'
  6. [font='Jersey 15']@fluticasone[/font]
  7. [font='Nunito']@fluticasone[/font]
  8. [font='PT Mono']@fluticasone[/font]
  9. [/div]
  10. [div=display: flex; /* main variables */
  11. --tFont: 'Jersey 15', monospace;
  12. --bfont: 'Nunito', sans-serif;
  13. --sfont: 'PT Mono', monospace;
  14. --bcolor: #212121; /* body text color */
  15. --inner: #f3f4e7; /* inner border color */
  16. --mcolor: #bfd5e2; /* main color of box */
  17. --shadow: #54b5e5; /* shadow seen at the bottom + subtitle */
  18. --lborder: #e33863; /* top side border + name */
  19. --dborder: #a12253; /* bottom side border */
  20. --aratio: 1; /* aspect ratio of image */
  21. --icon: url(https://i.imgur.com/eUpPVHu.jpeg) center center/cover; /* image */
  22. --heartnumber: 5; /* total number of hearts */
  23. --filledhearts: 2.5; /* number of filled hearts with decimals accepted*/
  24. flex-flow: row nowrap;
  25. align-items: flex-start;
  26. gap: 5px;
  27. position: relative;
  28. box-sizing: border-box;
  29. font-size: 0;
  30. margin: 1rem auto;
  31. width: clamp(250px,100% - 2rem,650px);
  32. height: auto;
  33. overflow: hidden; /* DO NOT TOUCH ANY VARIABLES PAST THIS POINT */
  34. --tcBorder: url(https://i.imgur.com/BONdqXn.gif) left top / 4px 4px no-repeat;
  35. --tcInner: url(https://i.imgur.com/40B4xZK.gif) left top / 4px 4px no-repeat;
  36. --tcColor: url(https://i.imgur.com/QzifRY2.gif) left top / 4px 4px no-repeat;
  37. --icon_mask: url(https://i.imgur.com/6gjxUkc.gif) left top / 4px 4px no-repeat;
  38. --tBorder: url(https://i.imgur.com/UF3iEsA.gif) left top / 4px 4px repeat-x;
  39. --tInner: url(https://i.imgur.com/1V92zJ3.gif) left top / 4px 4px repeat-x;
  40. --tColor: url(https://i.imgur.com/TqYdcZL.gif) left top / 4px 4px repeat-x;
  41. --vBorder: url(https://i.imgur.com/XHm31Pv.gif) left top / 4px 2px repeat-y;
  42. --vInner: url(https://i.imgur.com/gFEPyyj.gif) left top / 4px 2px repeat-y;
  43. --vColor: url(https://i.imgur.com/4DHwKzQ.gif) left top / 4px 2px repeat-y;
  44. --bcBorder: url(https://i.imgur.com/60PPtAo.gif) left top / 4px 6px no-repeat;
  45. --bcInner: url(https://i.imgur.com/NAiuiqS.gif) left top / 4px 6px no-repeat;
  46. --bcColor: url(https://i.imgur.com/UlpJcSL.gif) left top / 4px 6px no-repeat;
  47. --bcShadow: url(https://i.imgur.com/rk8zYNW.gif) left top / 4px 6px no-repeat;
  48. --bBorder: url(https://i.imgur.com/zLZK1eM.gif) left top / 6px 6px repeat-x;
  49. --bInner: url(https://i.imgur.com/xaOk8Tj.gif) left top / 6px 6px repeat-x;
  50. --bShadow: url(https://i.imgur.com/SUgivm7.gif) left top / 6px 6px repeat-x;
  51. --sdBorder: url(https://i.imgur.com/0cPAyoP.gif) left top / 10px 14px no-repeat;
  52. --slBorder: url(https://i.imgur.com/QPtPipL.gif) left top / 10px 14px no-repeat;
  53. --sInner: url(https://i.imgur.com/KoSJFDO.gif) left top / 10px 14px no-repeat;
  54. --sColor: url(https://i.imgur.com/cKin38I.gif) left top / 10px 14px no-repeat;
  55. --sShadow: url(https://i.imgur.com/E48sOAM.gif) left top / 10px 14px no-repeat;
  56. --eHeart: url(https://i.imgur.com/Fh7mDOr.gif) left top / 12px 12px repeat-x;
  57. --Heart: url(https://i.imgur.com/n9wQcqb.gif) left top / 12px 12px repeat-x;
  58. --dialborder: url(https://i.imgur.com/rl4kJWL.gif) left top / 8px 10px no-repeat;
  59. --diadborder: url(https://i.imgur.com/8xHHqMG.gif) left top / 8px 10px no-repeat;
  60. --diainner: url(https://i.imgur.com/N7HuEjd.gif) left top / 8px 10px no-repeat;
  61. --diacolor: url(https://i.imgur.com/mZyxh4K.gif) left top / 8px 10px no-repeat;
  62. --diashadow: url(https://i.imgur.com/vLs5XVw.gif) left top / 8px 10px no-repeat;
  63. --diacorner: url(https://i.imgur.com/rQ87mwz.gif) left top / 4px 2px repeat-y;]
  64. [div=flex: 0 10px;
  65. height: auto;]
  66. [div=display: block;
  67. position: relative;
  68. margin-top: 35px;
  69. height: 15px;
  70. width: 100%;]
  71. [div=position: absolute;
  72. top: 0px;
  73. left: 0px;
  74. height: 100%;
  75. width: 100%;
  76. image-rendering: pixelated;
  77. mask: var(--sdBorder);
  78. background: var(--dborder);]
  79. select dark border
  80. [/div]
  81. [div=position: absolute;
  82. top: 0px;
  83. left: 0px;
  84. height: 100%;
  85. width: 100%;
  86. image-rendering: pixelated;
  87. mask: var(--slBorder);
  88. background: var(--lborder);]
  89. select light border
  90. [/div]
  91. [div=position: absolute;
  92. top: 0px;
  93. left: 0px;
  94. height: 100%;
  95. width: 100%;
  96. image-rendering: pixelated;
  97. mask: var(--sInner);
  98. background: var(--inner);]
  99. select inner
  100. [/div]
  101. [div=position: absolute;
  102. top: 0px;
  103. left: 0px;
  104. height: 100%;
  105. width: 100%;
  106. image-rendering: pixelated;
  107. mask: var(--sColor);
  108. background: var(--mcolor);]
  109. select main color
  110. [/div]
  111. [div=position: absolute;
  112. top: 0px;
  113. left: 0px;
  114. height: 100%;
  115. width: 100%;
  116. image-rendering: pixelated;
  117. mask: var(--sShadow);
  118. background: var(--shadow);]
  119. select shadow
  120. [/div]
  121. [/div]
  122. [/div]
  123. [div=flex: 1 85px;
  124. max-width: 250px;
  125. height: auto;
  126. box-sizing: border-box;
  127. display: flex;
  128. flex-flow: column nowrap;
  129. align-items: flex-end;]
  130. [div=flex: 0 auto;
  131. position: relative;
  132. container-type: inline-size;
  133. width: 100%;
  134. height: auto;]
  135. [div=position: absolute;
  136. top: 0px;
  137. left: 0px;
  138. height: 4px;
  139. width: 4px;
  140. image-rendering: pixelated;
  141. mask: var(--tcBorder);
  142. background-color: var(--lborder);]
  143. top left border
  144. [/div]
  145. [div=position: absolute;
  146. top: 0px;
  147. left: 0px;
  148. height: 4px;
  149. width: 4px;
  150. image-rendering: pixelated;
  151. mask: var(--tcInner);
  152. background: var(--inner);]
  153. top left inner
  154. [/div]
  155. [div=position: absolute;
  156. top: 0px;
  157. left: 0px;
  158. height: 4px;
  159. width: 4px;
  160. image-rendering: pixelated;
  161. mask: var(--tcColor);
  162. background: var(--mcolor);]
  163. top left color
  164. [/div]
  165. [div=position: absolute;
  166. top: 0px;
  167. left: 4px;
  168. height: 4px;
  169. width: calc(100% - 8px);
  170. image-rendering: pixelated;
  171. mask: var(--tBorder);
  172. background-color: var(--lborder);]
  173. top center border
  174. [/div]
  175. [div=position: absolute;
  176. top: 0px;
  177. left: 4px;
  178. height: 4px;
  179. width: calc(100% - 8px);
  180. image-rendering: pixelated;
  181. mask: var(--tInner);
  182. background: var(--inner);]
  183. top center inner
  184. [/div]
  185. [div=position: absolute;
  186. top: 0px;
  187. right: 0px;
  188. height: 4px;
  189. width: 4px;
  190. transform: scaleX(-1);
  191. image-rendering: pixelated;
  192. mask: var(--tcBorder);
  193. background-color: var(--lborder);]
  194. top right border
  195. [/div]
  196. [div=position: absolute;
  197. top: 0px;
  198. right: 0px;
  199. height: 4px;
  200. width: 4px;
  201. transform: scaleX(-1);
  202. image-rendering: pixelated;
  203. mask: var(--tcInner);
  204. background: var(--inner);]
  205. top right inner
  206. [/div]
  207. [div=position: absolute;
  208. top: 0px;
  209. right: 0px;
  210. height: 4px;
  211. width: 4px;
  212. transform: scaleX(-1);
  213. image-rendering: pixelated;
  214. mask: var(--tcColor);
  215. background: var(--mcolor);]
  216. top right color
  217. [/div]
  218. [div=position: absolute;
  219. top: 4px;
  220. left: 0px;
  221. height: calc(100% - 10px);
  222. width: 4px;
  223. image-rendering: pixelated;
  224. mask: var(--vBorder);
  225. background-color: var(--lborder);]
  226. left center border
  227. [/div]
  228. [div=position: absolute;
  229. top: 4px;
  230. left: 0px;
  231. height: calc(100% - 10px);
  232. width: 4px;
  233. image-rendering: pixelated;
  234. mask: var(--vInner);
  235. background: var(--inner);]
  236. left center Inner
  237. [/div]
  238. [div=position: absolute;
  239. top: 4px;
  240. right: 0px;
  241. height: calc(100% - 10px);
  242. width: 4px;
  243. transform: scaleX(-1);
  244. image-rendering: pixelated;
  245. mask: var(--vBorder);
  246. background-color: var(--lborder);]
  247. right center border
  248. [/div]
  249. [div=position: absolute;
  250. top: 4px;
  251. right: 0px;
  252. height: calc(100% - 10px);
  253. width: 4px;
  254. transform: scaleX(-1);
  255. image-rendering: pixelated;
  256. mask: var(--vInner);
  257. background: var(--inner);]
  258. right center inner
  259. [/div]
  260. [div=position: absolute;
  261. bottom: 0px;
  262. right: 0px;
  263. height: 6px;
  264. width: 4px;
  265. image-rendering: pixelated;
  266. mask: var(--bcBorder);
  267. background-color: var(--dborder);]
  268. bottom right corner border
  269. [/div]
  270. [div=position: absolute;
  271. bottom: 0px;
  272. right: 0px;
  273. height: 6px;
  274. width: 4px;
  275. image-rendering: pixelated;
  276. mask: var(--bcInner);
  277. background-color: var(--inner);]
  278. bottom right corner inner
  279. [/div]
  280. [div=position: absolute;
  281. bottom: 0px;
  282. right: 0px;
  283. height: 6px;
  284. width: 4px;
  285. image-rendering: pixelated;
  286. mask: var(--bcColor);
  287. background-color: var(--mcolor);]
  288. bottom left corner color
  289. [/div]
  290. [div=position: absolute;
  291. bottom: 0px;
  292. right: 0px;
  293. height: 6px;
  294. width: 4px;
  295. image-rendering: pixelated;
  296. mask: var(--bcShadow);
  297. background-color: var(--shadow);]
  298. bottom right corner shadow
  299. [/div]
  300. [div=position: absolute;
  301. bottom: 0px;
  302. left: 0px;
  303. width: 4px;
  304. height: 6px;
  305. transform: scaleX(-1);
  306. image-rendering: pixelated;
  307. mask: var(--bcBorder);
  308. background-color: var(--dborder);]
  309. bottom left corner border
  310. [/div]
  311. [div=position: absolute;
  312. bottom: 0px;
  313. left: 0px;
  314. height: 6px;
  315. width: 4px;
  316. transform: scaleX(-1);
  317. image-rendering: pixelated;
  318. mask: var(--bcInner);
  319. background-color: var(--inner);]
  320. bottom left corner inner
  321. [/div]
  322. [div=position: absolute;
  323. bottom: 0px;
  324. left: 0px;
  325. height: 6px;
  326. width: 4px;
  327. transform: scaleX(-1);
  328. image-rendering: pixelated;
  329. mask: var(--bcShadow);
  330. background-color: var(--shadow);]
  331. bottom left corner shadow
  332. [/div]
  333. [div=position: absolute;
  334. bottom: 0px;
  335. left: 0px;
  336. height: 6px;
  337. width: 4px;
  338. transform: scaleX(-1);
  339. image-rendering: pixelated;
  340. mask: var(--bcColor);
  341. background-color: var(--mcolor);]
  342. bottom left corner color
  343. [/div]
  344. [div=position: absolute;
  345. bottom: 0px;
  346. left: 4px;
  347. width: calc(100% - 8px);
  348. height: 6px;
  349. image-rendering: pixelated;
  350. mask: var(--bBorder);
  351. background-color: var(--dborder);]
  352. bottom center border
  353. [/div]
  354. [div=position: absolute;
  355. bottom: 0px;
  356. left: 4px;
  357. width: calc(100% - 8px);
  358. height: 6px;
  359. image-rendering: pixelated;
  360. mask: var(--bInner);
  361. background-color: var(--inner);]
  362. bottom center inner
  363. [/div]
  364. [div=position: absolute;
  365. bottom: 0px;
  366. left: 4px;
  367. width: calc(100% - 8px);
  368. height: 6px;
  369. image-rendering: pixelated;
  370. mask: var(--bShadow);
  371. background-color: var(--shadow);]
  372. bottom center shadow
  373. [/div]
  374. [div=display: block;
  375. position: relative;
  376. z-index: 3;
  377. width: calc(100% - 6px);
  378. aspect-ratio: var(--aratio);
  379. background: var(--icon);
  380. margin: 3px auto;
  381. margin-bottom: 5px;
  382. clip-path: polygon(1px 0,calc(100% - 1px) 0,100% 1px,100% calc(100% - 1px),calc(100% - 1px) 100%,1px 100%,0 calc(100% - 1px), 0 1px);]
  383. main image
  384. [/div]
  385. [/div]
  386. [div=flex: 0 12px;
  387. margin-top: 8px;
  388. width: calc(12px * var(--heartnumber));
  389. position: relative;
  390. right: clamp(5px,5%,15px);
  391. background: var(--eHeart);
  392. image-rendering: pixelated;]
  393. [div=display: block;
  394. top: 0px;
  395. left: 0px;
  396. height: 12px;
  397. width: calc(12px * var(--filledhearts));
  398. background: var(--Heart);
  399. image-rendering: pixelated;]
  400. [/div]
  401. [/div]
  402. [div=flex: 0 auto;
  403. margin-top: 4px;
  404. font-family: var(--sfont);
  405. text-transform: uppercase;
  406. font-size: .55rem;
  407. padding: 0px clamp(7px,7%,15px);
  408. box-sizing: border-box;
  409. letter-spacing: .25em;
  410. line-height: 1;
  411. text-align: right;]
  412. &&tiny text[br][/br]
  413. linebreak
  414. [/div]
  415. [div=flex: 0 auto;
  416. margin-top: 7px;
  417. text-transform: uppercase;
  418. padding: 0px clamp(7px,7%,15px);
  419. box-sizing: border-box;
  420. display: flex;
  421. flex-flow: row wrap;
  422. align-items: center;
  423. justify-content: space-evenly;
  424. gap: 2px;]
  425. &&tags / wrap each tag in the div
  426. [div=flex: 0 auto;]@fluticasone[/div]
  427. [div=flex: 0 auto;]@fluticasone[/div]
  428. [div=flex: 0 auto;]@fluticasone[/div]
  429. [/div]
  430. [/div]
  431. [div=flex: 4 150px;
  432. height: auto;
  433. box-sizing: border-box;
  434. display: flex;
  435. flex-flow: column nowrap;
  436. align-items: flex-start;
  437. justify-coontent: flex-start;
  438. gap: clamp(15px,1cqw,100px);
  439. container-type: inline-size;
  440. padding: clamp(15px,1cqw,100px) 0px;]
  441. [div=flex: 0 auto;
  442. width: 100%;
  443. font-size: clamp(14px,10cqw,80px);
  444. text-transform: uppercase;
  445. font-family: var(--tFont);
  446. color: var(--lborder);
  447. padding: 0px calc(8px + .5em);
  448. box-sizing: inherit;
  449. line-height: .75;]
  450. &&name here
  451. [div=display: block;
  452. color: var(--shadow);
  453. font-size: 75%;
  454. box-sizing: inherit;]
  455. &&subtitle here
  456. [/div]
  457. [/div]
  458. [div=flex: 0 auto;
  459. height: auto;
  460. display: block;
  461. width: 100%;
  462. position: relative;
  463. padding: 4px 4px 6px 4px;
  464. box-sizing: border-box;]
  465. [div=position: absolute;
  466. top: 0px;
  467. left: 4px;
  468. height: 4px;
  469. width: 4px;
  470. image-rendering: pixelated;
  471. mask: var(--tcBorder);
  472. background-color: var(--lborder);]
  473. top left border
  474. [/div]
  475. [div=position: absolute;
  476. top: 0px;
  477. left: 4px;
  478. height: 4px;
  479. width: 4px;
  480. image-rendering: pixelated;
  481. mask: var(--tcInner);
  482. background: var(--inner);]
  483. top left inner
  484. [/div]
  485. [div=position: absolute;
  486. top: 0px;
  487. left: 4px;
  488. height: 4px;
  489. width: 4px;
  490. image-rendering: pixelated;
  491. mask: var(--tcColor);
  492. background: var(--mcolor);]
  493. top left color
  494. [/div]
  495. [div=position: absolute;
  496. top: 0px;
  497. left: 8px;
  498. height: 4px;
  499. width: calc(100% - 12px);
  500. image-rendering: pixelated;
  501. mask: var(--tBorder);
  502. background-color: var(--lborder);]
  503. top center border
  504. [/div]
  505. [div=position: absolute;
  506. top: 0px;
  507. left: 8px;
  508. height: 4px;
  509. width: calc(100% - 12px);
  510. image-rendering: pixelated;
  511. mask: var(--tInner);
  512. background: var(--inner);]
  513. top center inner
  514. [/div]
  515. [div=position: absolute;
  516. top: 0px;
  517. left: 8px;
  518. height: 4px;
  519. width: calc(100% - 12px);
  520. image-rendering: pixelated;
  521. mask: var(--tColor);
  522. background: var(--mcolor);]
  523. top center color
  524. [/div]
  525. [div=position: absolute;
  526. top: 0px;
  527. right: 0px;
  528. height: 4px;
  529. width: 4px;
  530. transform: scaleX(-1);
  531. image-rendering: pixelated;
  532. mask: var(--tcBorder);
  533. background-color: var(--lborder);]
  534. top right border
  535. [/div]
  536. [div=position: absolute;
  537. top: 0px;
  538. right: 0px;
  539. height: 4px;
  540. width: 4px;
  541. transform: scaleX(-1);
  542. image-rendering: pixelated;
  543. mask: var(--tcInner);
  544. background: var(--inner);]
  545. top right inner
  546. [/div]
  547. [div=position: absolute;
  548. top: 0px;
  549. right: 0px;
  550. height: 4px;
  551. width: 4px;
  552. transform: scaleX(-1);
  553. image-rendering: pixelated;
  554. mask: var(--tcColor);
  555. background: var(--mcolor);]
  556. top right color
  557. [/div]
  558. [div=position: absolute;
  559. top: 4px;
  560. right: 0px;
  561. height: calc(100% - 10px);
  562. width: 4px;
  563. transform: scaleX(-1);
  564. image-rendering: pixelated;
  565. mask: var(--vBorder);
  566. background-color: var(--lborder);]
  567. right center border
  568. [/div]
  569. [div=position: absolute;
  570. top: 4px;
  571. right: 0px;
  572. height: calc(100% - 10px);
  573. width: 4px;
  574. transform: scaleX(-1);
  575. image-rendering: pixelated;
  576. mask: var(--vInner);
  577. background: var(--inner);]
  578. right center inner
  579. [/div]
  580. [div=position: absolute;
  581. top: 4px;
  582. right: 0px;
  583. height: calc(100% - 10px);
  584. width: 4px;
  585. transform: scaleX(-1);
  586. image-rendering: pixelated;
  587. mask: var(--vColor);
  588. background: var(--mcolor);]
  589. right center color
  590. [/div]
  591. [div=position: absolute;
  592. top: 4px;
  593. left: 4px;
  594. height: 20px;
  595. width: 4px;
  596. image-rendering: pixelated;
  597. mask: var(--vBorder);
  598. background-color: var(--lborder);]
  599. left center border
  600. [/div]
  601. [div=position: absolute;
  602. top: 4px;
  603. left: 4px;
  604. height: calc(100% - 10px);
  605. width: 4px;
  606. image-rendering: pixelated;
  607. mask: var(--vInner);
  608. background: var(--inner);]
  609. left center Inner
  610. [/div]
  611. [div=position: absolute;
  612. top: 4px;
  613. left: 4px;
  614. height: calc(100% - 10px);
  615. width: 4px;
  616. image-rendering: pixelated;
  617. mask: var(--vColor);
  618. background: var(--mcolor);]
  619. left center color
  620. [/div]
  621. [div=position: absolute;
  622. top: 24px;
  623. left: 0px;
  624. height: 10px;
  625. width: 8px;
  626. image-rendering: pixelated;
  627. mask: var(--dialborder);
  628. background-color: var(--lborder);]
  629. dialogue light border
  630. [/div]
  631. [div=position: absolute;
  632. top: 24px;
  633. left: 0px;
  634. height: 10px;
  635. width: 8px;
  636. image-rendering: pixelated;
  637. mask: var(--diadborder);
  638. background-color: var(--dborder);]
  639. dialogue dark border
  640. [/div]
  641. [div=position: absolute;
  642. top: 24px;
  643. left: 0px;
  644. height: 10px;
  645. width: 8px;
  646. image-rendering: pixelated;
  647. mask: var(--diainner);
  648. background-color: var(--inner);]
  649. dialogue inner
  650. [/div]
  651. [div=position: absolute;
  652. top: 24px;
  653. left: 0px;
  654. height: 10px;
  655. width: 8px;
  656. image-rendering: pixelated;
  657. mask: var(--diashadow);
  658. background-color: var(--shadow);]
  659. dialogue shadow
  660. [/div]
  661. [div=position: absolute;
  662. top: 24px;
  663. left: 0px;
  664. height: 10px;
  665. width: 8px;
  666. image-rendering: pixelated;
  667. mask: var(--diacolor);
  668. background-color: var(--mcolor);]
  669. dialogue color
  670. [/div]
  671. [div=position: absolute;
  672. top: 34px;
  673. left: 4px;
  674. height: calc(100% - 40px);
  675. width: 8px;
  676. image-rendering: pixelated;
  677. mask: var(--diacorner);
  678. background-color: var(--dborder);]
  679. dialogue lower border
  680. [/div]
  681. [div=position: absolute;
  682. bottom: 0px;
  683. right: 0px;
  684. height: 6px;
  685. width: 4px;
  686. image-rendering: pixelated;
  687. mask: var(--bcBorder);
  688. background-color: var(--dborder);]
  689. bottom right corner border
  690. [/div]
  691. [div=position: absolute;
  692. bottom: 0px;
  693. right: 0px;
  694. height: 6px;
  695. width: 4px;
  696. image-rendering: pixelated;
  697. mask: var(--bcInner);
  698. background-color: var(--inner);]
  699. bottom right corner inner
  700. [/div]
  701. [div=position: absolute;
  702. bottom: 0px;
  703. right: 0px;
  704. height: 6px;
  705. width: 4px;
  706. image-rendering: pixelated;
  707. mask: var(--bcColor);
  708. background-color: var(--mcolor);]
  709. bottom right corner color
  710. [/div]
  711. [div=position: absolute;
  712. bottom: 0px;
  713. right: 0px;
  714. height: 6px;
  715. width: 4px;
  716. image-rendering: pixelated;
  717. mask: var(--bcShadow);
  718. background-color: var(--shadow);]
  719. bottom right corner shadow
  720. [/div]
  721. [div=position: absolute;
  722. bottom: 0px;
  723. left: 4px;
  724. width: 4px;
  725. height: 6px;
  726. transform: scaleX(-1);
  727. image-rendering: pixelated;
  728. mask: var(--bcBorder);
  729. background-color: var(--dborder);]
  730. bottom left corner border
  731. [/div]
  732. [div=position: absolute;
  733. bottom: 0px;
  734. left: 4px;
  735. height: 6px;
  736. width: 4px;
  737. transform: scaleX(-1);
  738. image-rendering: pixelated;
  739. mask: var(--bcInner);
  740. background-color: var(--inner);]
  741. bottom left corner inner
  742. [/div]
  743. [div=position: absolute;
  744. bottom: 0px;
  745. left: 4px;
  746. height: 6px;
  747. width: 4px;
  748. transform: scaleX(-1);
  749. image-rendering: pixelated;
  750. mask: var(--bcColor);
  751. background-color: var(--mcolor);]
  752. bottom left corner color
  753. [/div]
  754. [div=position: absolute;
  755. bottom: 0px;
  756. left: 4px;
  757. height: 6px;
  758. width: 4px;
  759. transform: scaleX(-1);
  760. image-rendering: pixelated;
  761. mask: var(--bcShadow);
  762. background-color: var(--shadow);]
  763. bottom left corner shadow
  764. [/div]
  765. [div=position: absolute;
  766. bottom: 0px;
  767. right: 4px;
  768. width: calc(100% - 12px);
  769. height: 6px;
  770. image-rendering: pixelated;
  771. mask: var(--bShadow);
  772. background-color: var(--shadow);]
  773. bottom center shadow
  774. [/div]
  775. [div=position: absolute;
  776. bottom: 0px;
  777. right: 4px;
  778. width: calc(100% - 12px);
  779. height: 6px;
  780. image-rendering: pixelated;
  781. mask: var(--bBorder);
  782. background-color: var(--dborder);]
  783. bottom center border
  784. [/div]
  785. [div=position: absolute;
  786. bottom: 0px;
  787. right: 4px;
  788. width: calc(100% - 12px);
  789. height: 6px;
  790. image-rendering: pixelated;
  791. mask: var(--bInner);
  792. background-color: var(--inner);]
  793. bottom center inner
  794. [/div]
  795. [div=position: absolute;
  796. bottom: 5px;
  797. right: 4px;
  798. height: 1px;
  799. width: calc(100% - 12px);
  800. background-color: var(--mcolor);]
  801. bottom center color
  802. [/div]
  803. [div=display: block;
  804. width: 100%;
  805. height: auto;
  806. background: var(--mcolor);
  807. container-type: inline-size;
  808. box-sizing: border-box;
  809. padding: calc(6px + 8cqw);
  810. padding-bottom: calc(8px + 8cqw);
  811. overflow: hidden;]
  812. [div=display: block;
  813. box-sizing: border-box;
  814. position: relative;
  815. width: 100%;
  816. height: auto;
  817. container-type: inline-size;
  818. overflow: hidden;]
  819. [div=display: block;
  820. box-sizing: border-box;
  821. width: calc(100cqw + 75px);
  822. padding-right: 75px;
  823. height: auto;
  824. overflow-x: hidden;
  825. overflow-y: auto;
  826. font-size: .975rem;
  827. font-family: var(--bfont);
  828. color: var(--bcolor);
  829. text-align: justify;
  830. max-height: 400px;]
  831. [div=display: block;]
  832. &&Main Content Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ac varius quam, non viverra diam. In pharetra pulvinar ligula vel pharetra. Vivamus fermentum placerat dolor ut rutrum. Etiam non gravida purus, vel varius quam. Mauris laoreet augue ac lacus dapibus tempor. Curabitur felis mi, interdum eu quam nec, condimentum convallis enim.
  833. [/div]
  834. [div=display: block; margin-top: .5rem;]
  835. [div=display: inline; color: var(--lborder);]&&Dialogue Ut eget nulla massa.[/div] Aliquam volutpat purus tincidunt, dignissim magna ut, suscipit urna. Integer posuere tortor non commodo ornare.
  836. [/div]
  837. [div=display: block; margin-top: .5rem;]
  838. &&Paragraph Duis convallis feugiat finibus. Ut eget nulla massa. Integer ut purus eu lorem ornare fermentum laoreet ut orci. Aliquam volutpat purus tincidunt, dignissim magna ut, suscipit urna. Integer posuere tortor non commodo ornare. Nulla fringilla viverra mauris eget aliquet. Morbi elementum tellus elit, sit amet pretium lectus tempor sit amet. Phasellus vel diam et dui bibendum fermentum non ac tellus. Aliquam rhoncus a ligula id fringilla. Nunc quis nibh vestibulum magna vestibulum ultrices. Sed ullamcorper velit quam, eget vulputate nisl sodales sed. Fusce lacinia risus lacus, quis faucibus orci ullamcorper sit amet.
  839. [/div]
  840. [/div]
  841. [/div]
  842. [/div]
  843. [/div]
  844. [/div]
  845. [/div]
  846. [/nobr]
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!