-div.icedeb-button {
- background: lightgray;
+body { padding: 1ex; }
+#clip-pot { position: absolute; left: -1000px; }
+#clipboard {
+ margin: 2px;
+ min-height: 1.5em;
+ max-height: 2.5em;
+ border: 1px solid hsl(0,0%,69.4%);
+ box-shadow: 0 0 0 0 hsla(208.1, 100%, 69%, 0);
+ transition: 250ms box-shadow;
+}
+#clipboard:focus {
+ border-color: hsl(204.6, 94.5%, 50.4%);
+ box-shadow: 0 0 0 2px hsla(208.1, 100%, 69%, 0.8);
+ outline: none;
+}
+
+#button-list-container {
+ background: hsl(222,4%,92%);
+ display: flex;
+ flex-direction: column;
+ padding: 0.1ex;
+}
+#button-list-container > * {
+ margin: 0.5ex;
+ padding: 0.1ex;
+ display: flex;
+}
+
+.icedeb-button {
border-radius: 5px;
+ cursor: pointer;
+ color: blue;
+ margin-right: 1em;
+ opacity: 0.3;
}
-.hidden { display: none; }
-#clipboard {
- position: absolute;
- left: -50000px;
+.likely .icedeb-button { opacity: 1; }
+.icedeb-button:hover {
+ text-decoration: underline;
+}
+a, a:visited { color: blue; }
+.hints { margin-left: auto; margin-right: 1ex; }
+.hints .hint {
+ display: inline-block;
+ width: 1.8ex;
+ text-align: center;
+ margin: 0 0.2ex;
+ cursor: default;
+ opacity: 0.5;
}
-#sorry { font-size: 80%; }
+.hints .hint.b { background-color: hsl(312,100%,96%) }
+.hints .hint.p { background-color: hsl(120,100%,96%) }
+.hints .hint.m { background-color: hsl(240,100%,90%) }
+.hints .hint.i { background-color: hsl( 40,100%,96%) }
+.hints .hint.s { background-color: hsl( 80,100%,96%) }
+.like-b .hint.b,
+.like-p .hint.p,
+.like-m .hint.m,
+.like-s .hint.s,
+.like-i .hint.i { opacity: 1; }